diff --git a/app/javascript/dashboard/components/widgets/Avatar.vue b/app/javascript/dashboard/components/widgets/Avatar.vue
index c6cb55b91..28255209e 100644
--- a/app/javascript/dashboard/components/widgets/Avatar.vue
+++ b/app/javascript/dashboard/components/widgets/Avatar.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="avatar-container" :style="style" aria-hidden="true">
-    {{ userInitial }}
+    <slot>{{ userInitial }}</slot>
   </div>
 </template>
 
diff --git a/app/javascript/dashboard/components/widgets/Thumbnail.vue b/app/javascript/dashboard/components/widgets/Thumbnail.vue
index c827135df..ff460e2d2 100644
--- a/app/javascript/dashboard/components/widgets/Thumbnail.vue
+++ b/app/javascript/dashboard/components/widgets/Thumbnail.vue
@@ -5,19 +5,21 @@
     :title="title"
   >
     <!-- Using v-show instead of v-if to avoid flickering as v-if removes dom elements.  -->
-    <img
-      v-show="shouldShowImage"
-      :src="src"
-      :class="thumbnailClass"
-      @load="onImgLoad"
-      @error="onImgError"
-    />
-    <Avatar
-      v-show="!shouldShowImage"
-      :username="userNameWithoutEmoji"
-      :class="thumbnailClass"
-      :size="avatarSize"
-    />
+    <slot>
+      <img
+        v-show="shouldShowImage"
+        :src="src"
+        :class="thumbnailClass"
+        @load="onImgLoad"
+        @error="onImgError"
+      />
+      <Avatar
+        v-show="!shouldShowImage"
+        :username="userNameWithoutEmoji"
+        :class="thumbnailClass"
+        :size="avatarSize"
+      />
+    </slot>
     <img
       v-if="badgeSrc"
       class="source-badge"