diff --git a/frontend/src/features/collections/collection-edit-dialog.ts b/frontend/src/features/collections/collection-edit-dialog.ts
index 34db016dbc..1b39343377 100644
--- a/frontend/src/features/collections/collection-edit-dialog.ts
+++ b/frontend/src/features/collections/collection-edit-dialog.ts
@@ -16,6 +16,10 @@ import renderGeneral from "./edit-dialog/general-section";
 import checkChanged from "./edit-dialog/helpers/check-changed";
 import submitTask from "./edit-dialog/helpers/submit-task";
 import { type CollectionShareSettings } from "./edit-dialog/sharing-section";
+import {
+  type SelectSnapshotDetail,
+  type SnapshotItem,
+} from "./select-collection-start-page";
 
 import { BtrixElement } from "@/classes/BtrixElement";
 import type { Dialog } from "@/components/ui/dialog";
@@ -86,6 +90,9 @@ export class CollectionEdit extends BtrixElement {
   defaultThumbnailName: `${Thumbnail}` | null = this.collection
     ?.defaultThumbnailName as `${Thumbnail}` | null;
 
+  @state()
+  selectedSnapshot: SnapshotItem | null = null;
+
   @query("btrix-dialog")
   readonly dialog?: Dialog;
 
@@ -103,6 +110,11 @@ export class CollectionEdit extends BtrixElement {
       this.onReset();
       this.collection = undefined;
     }
+    if (changedProperties.has("collection")) {
+      this.defaultThumbnailName = this.collection?.defaultThumbnailName as
+        | `${Thumbnail}`
+        | null;
+    }
   }
 
   readonly checkChanged = checkChanged.bind(this);
@@ -196,7 +208,7 @@ export class CollectionEdit extends BtrixElement {
                 >
                   ${this.renderTab({
                     panel: "general",
-                    icon: "info-lg",
+                    icon: "info-square",
                     string: msg("About"),
                   })}
                   ${this.renderTab({
diff --git a/frontend/src/features/collections/edit-dialog/general-section.ts b/frontend/src/features/collections/edit-dialog/general-section.ts
index 836aaa2b1e..92eceea44b 100644
--- a/frontend/src/features/collections/edit-dialog/general-section.ts
+++ b/frontend/src/features/collections/edit-dialog/general-section.ts
@@ -13,6 +13,7 @@ import {
   DEFAULT_THUMBNAIL_VARIANT,
   Thumbnail,
 } from "../collection-thumbnail";
+import { type SelectSnapshotDetail } from "../select-collection-start-page";
 
 import type { PublicCollection } from "@/types/collection";
 
@@ -67,7 +68,19 @@ export default function renderGeneral(this: CollectionEdit) {
         </sl-tooltip>
       </div>
       ${renderThumbnails.bind(this)()}
-    </div>`;
+    </div>
+    <btrix-select-collection-start-page
+      .collection=${this.collection}
+      .collectionId=${this.collectionId || this.collection.id}
+      @btrix-select=${async (e: CustomEvent<SelectSnapshotDetail>) => {
+        this.selectedSnapshot = e.detail.item;
+        this.dispatchEvent(
+          new CustomEvent("btrix-change", {
+            bubbles: true,
+          }),
+        );
+      }}
+    ></btrix-select-collection-start-page>`;
 }
 
 function renderThumbnails(this: CollectionEdit) {
@@ -86,11 +99,23 @@ function renderThumbnails(this: CollectionEdit) {
   }
 
   const thumbnail = (
-    thumbnail: Thumbnail | NonNullable<PublicCollection["thumbnail"]>,
+    thumbnail?: Thumbnail | NonNullable<PublicCollection["thumbnail"]>,
   ) => {
     let name: Thumbnail | null = null;
     let path = "";
 
+    if (!thumbnail)
+      return html` <sl-tooltip content=${msg("Select a page thumbnail")}
+        ><button
+          class="row-start-2 flex aspect-video items-center justify-center overflow-hidden rounded bg-neutral-50 ring-1 ring-stone-600/10 transition-all hover:ring-2 hover:ring-blue-300"
+          disabled
+        >
+          <sl-icon
+            class="size-10 stroke-black/50 text-white drop-shadow-md [paint-order:stroke]"
+            name="plus-lg"
+          ></sl-icon></button
+      ></sl-tooltip>`;
+
     if (Object.values(Thumbnail).some((t) => t === thumbnail)) {
       name = thumbnail as Thumbnail;
       path = CollectionThumbnail.Variants[name].path;
@@ -110,7 +135,7 @@ function renderThumbnails(this: CollectionEdit) {
         <button
           class="${isSelected
             ? "ring-blue-300 ring-2"
-            : "ring-stone-600/10 ring-1"} aspect-video flex-1 overflow-hidden rounded transition-all hover:ring-2 hover:ring-blue-300"
+            : "ring-stone-600/10 ring-1"} row-start-2 aspect-video flex-1 overflow-hidden rounded transition-all hover:ring-2 hover:ring-blue-300"
           @click=${() => {
             this.defaultThumbnailName = name;
             this.dispatchEvent(
@@ -137,8 +162,18 @@ function renderThumbnails(this: CollectionEdit) {
   };
 
   return html`
-    <div class="flex gap-3">
-      ${when(this.collection?.thumbnail, (t) => thumbnail(t))}
+    <div class="mt-3 grid grid-cols-5 gap-3">
+      <div class="row-start-1 text-xs text-neutral-500">
+        ${msg("Page Thumbnail")}
+      </div>
+      ${when(
+        this.collection?.thumbnail,
+        (t) => thumbnail(t),
+        () => thumbnail(),
+      )}
+      <div class="row-start-1 text-xs text-neutral-600">
+        ${msg("Placeholder")}
+      </div>
       ${thumbnail(Thumbnail.Cyan)} ${thumbnail(Thumbnail.Green)}
       ${thumbnail(Thumbnail.Yellow)} ${thumbnail(Thumbnail.Orange)}
     </div>
diff --git a/frontend/src/features/collections/edit-dialog/sharing-section.ts b/frontend/src/features/collections/edit-dialog/sharing-section.ts
index ebca034912..7d29f02d31 100644
--- a/frontend/src/features/collections/edit-dialog/sharing-section.ts
+++ b/frontend/src/features/collections/edit-dialog/sharing-section.ts
@@ -5,26 +5,17 @@ import type {
   SlSelectEvent,
   SlSwitch,
 } from "@shoelace-style/shoelace";
-import { html, nothing, type PropertyValues } from "lit";
+import { html, type PropertyValues } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 import { when } from "lit/directives/when.js";
 
-import {
-  CollectionThumbnail,
-  DEFAULT_THUMBNAIL_VARIANT,
-  Thumbnail,
-} from "../collection-thumbnail";
 import { type SelectCollectionAccess } from "../select-collection-access";
 
 import { BtrixElement } from "@/classes/BtrixElement";
 import { viewStateContext, type ViewStateContext } from "@/context/view-state";
 import { RouteNamespace } from "@/routes";
-import {
-  CollectionAccess,
-  type Collection,
-  type PublicCollection,
-} from "@/types/collection";
+import { CollectionAccess, type Collection } from "@/types/collection";
 
 @customElement("btrix-collection-share-settings")
 @localized()
@@ -39,17 +30,11 @@ export class CollectionShareSettings extends BtrixElement {
   public access = this.collection?.access;
   @property({ type: Boolean })
   public allowPublicDownload = this.collection?.allowPublicDownload;
-  @property({ type: String })
-  public defaultThumbnailName?: `${Thumbnail}` | null = this.collection
-    ?.defaultThumbnailName as `${Thumbnail}` | null;
 
   protected willUpdate(changedProperties: PropertyValues<this>): void {
     if (changedProperties.has("collection")) {
       this.access = this.collection?.access;
       this.allowPublicDownload = this.collection?.allowPublicDownload;
-      this.defaultThumbnailName = this.collection?.defaultThumbnailName as
-        | `${Thumbnail}`
-        | null;
     }
   }
 
@@ -104,19 +89,7 @@ export class CollectionShareSettings extends BtrixElement {
         this.collection?.access != CollectionAccess.Private,
         () => html`<div class="mb-7">${this.renderShareLink()}</div>`,
       )}
-      <div class="mb-7">
-        <div class="form-label flex items-center gap-1.5">
-          ${msg("Thumbnail")}
-          <sl-tooltip
-            content=${msg(
-              "Choose a thumbnail to represent this collection in the org dashboard and profile page.",
-            )}
-          >
-            <sl-icon name="info-circle"></sl-icon>
-          </sl-tooltip>
-        </div>
-        ${this.renderThumbnails()}
-      </div>
+
       <div>
         <div class="form-label flex items-center gap-1.5">
           ${msg("Downloads")}
@@ -227,78 +200,4 @@ export class CollectionShareSettings extends BtrixElement {
       </p>
     `;
   };
-  private renderThumbnails() {
-    let selectedImgSrc = DEFAULT_THUMBNAIL_VARIANT.path;
-
-    if (this.defaultThumbnailName) {
-      const variant = Object.entries(CollectionThumbnail.Variants).find(
-        ([name]) => name === this.defaultThumbnailName,
-      );
-
-      if (variant) {
-        selectedImgSrc = variant[1].path;
-      }
-    } else if (this.collection?.thumbnail) {
-      selectedImgSrc = this.collection.thumbnail.path;
-    }
-
-    const thumbnail = (
-      thumbnail: Thumbnail | NonNullable<PublicCollection["thumbnail"]>,
-    ) => {
-      let name: Thumbnail | null = null;
-      let path = "";
-
-      if (Object.values(Thumbnail).some((t) => t === thumbnail)) {
-        name = thumbnail as Thumbnail;
-        path = CollectionThumbnail.Variants[name].path;
-      } else {
-        path = (thumbnail as NonNullable<PublicCollection["thumbnail"]>).path;
-      }
-
-      if (!path) {
-        console.debug("no path for thumbnail:", thumbnail);
-        return;
-      }
-
-      const isSelected = path === selectedImgSrc;
-
-      return html`
-        <sl-tooltip content=${msg("Use thumbnail")}>
-          <button
-            class="${isSelected
-              ? "ring-blue-300 ring-2"
-              : "ring-stone-600/10 ring-1"} aspect-video flex-1 overflow-hidden rounded transition-all hover:ring-2 hover:ring-blue-300"
-            @click=${() => {
-              this.defaultThumbnailName = name;
-              this.dispatchEvent(
-                new CustomEvent("btrix-change", {
-                  bubbles: true,
-                }),
-              );
-            }}
-          >
-            <div
-              class="flex size-full flex-col items-center justify-center bg-cover"
-              style="background-image:url('${path}')"
-            >
-              ${isSelected
-                ? html`<sl-icon
-                    class="size-10 stroke-black/50 text-white drop-shadow-md [paint-order:stroke]"
-                    name="check-lg"
-                  ></sl-icon>`
-                : nothing}
-            </div>
-          </button>
-        </sl-tooltip>
-      `;
-    };
-
-    return html`
-      <div class="flex gap-3">
-        ${when(this.collection?.thumbnail, (t) => thumbnail(t))}
-        ${thumbnail(Thumbnail.Cyan)} ${thumbnail(Thumbnail.Green)}
-        ${thumbnail(Thumbnail.Yellow)} ${thumbnail(Thumbnail.Orange)}
-      </div>
-    `;
-  }
 }
diff --git a/frontend/src/features/collections/edit-dialog/homepage-section.ts b/frontend/src/features/collections/edit-dialog/thumbnail-select.ts
similarity index 84%
rename from frontend/src/features/collections/edit-dialog/homepage-section.ts
rename to frontend/src/features/collections/edit-dialog/thumbnail-select.ts
index 7ba36921b9..11d07399e8 100644
--- a/frontend/src/features/collections/edit-dialog/homepage-section.ts
+++ b/frontend/src/features/collections/edit-dialog/thumbnail-select.ts
@@ -12,6 +12,7 @@ import {
 import type { SelectSnapshotDetail } from "../select-collection-start-page";
 
 import { BtrixElement } from "@/classes/BtrixElement";
+import { type Collection } from "@/types/collection";
 
 const OPTIONS: Record<
   HomeView,
@@ -29,11 +30,11 @@ const OPTIONS: Record<
   },
 };
 
-@customElement("btrix-collection-homepage-settings")
+@customElement("btrix-collection-thumbnail-select")
 @localized()
-export class CollectionHomepageSettings extends BtrixElement {
-  @property({ type: String })
-  collectionId?: string;
+export class CollectionThumbnailSelect extends BtrixElement {
+  @property({ type: Object })
+  collection?: Collection;
 
   @property({ type: String })
   homeUrl?: string | null = null;
@@ -50,8 +51,6 @@ export class CollectionHomepageSettings extends BtrixElement {
   @state()
   homeView = HomeView.Pages;
 
-  useThumbnail = true;
-
   @state()
   selectedSnapshot?: SelectSnapshotDetail["item"];
 
@@ -88,11 +87,11 @@ export class CollectionHomepageSettings extends BtrixElement {
           }
         : null);
 
-    const replaySource = `/api/orgs/${this.orgId}/collections/${this.collectionId}/replay.json`;
+    const replaySource = `/api/orgs/${this.orgId}/collections/${this.collection!.id}/replay.json`;
     // TODO Get query from replay-web-page embed
     const query = queryString.stringify({
       source: replaySource,
-      customColl: this.collectionId,
+      customColl: this.collection!.id,
       embed: "default",
       noCache: 1,
       noSandbox: 1,
@@ -107,7 +106,7 @@ export class CollectionHomepageSettings extends BtrixElement {
         <btrix-collection-snapshot-preview
           class="contents"
           id="thumbnailPreview"
-          collectionId=${this.collectionId || ""}
+          collectionId=${this.collection!.id || ""}
           view=${this.homeView}
           replaySrc=${`/replay/?${query}#view=pages`}
           .snapshot=${snapshot}
@@ -176,21 +175,7 @@ export class CollectionHomepageSettings extends BtrixElement {
         this.homeView === HomeView.URL,
         () => html`
           <sl-divider></sl-divider>
-          <section>
-            <btrix-select-collection-start-page
-              .collectionId=${this.collectionId}
-              .homeUrl=${this.homeUrl}
-              .homeTs=${this.homeTs}
-              @btrix-select=${async (e: CustomEvent<SelectSnapshotDetail>) => {
-                this.selectedSnapshot = e.detail.item;
-                this.dispatchEvent(
-                  new CustomEvent("btrix-change", {
-                    bubbles: true,
-                  }),
-                );
-              }}
-            ></btrix-select-collection-start-page>
-          </section>
+          <section></section>
         `,
       )}
     `;
diff --git a/frontend/src/features/collections/index.ts b/frontend/src/features/collections/index.ts
index cb6463e6db..f18fa3cda5 100644
--- a/frontend/src/features/collections/index.ts
+++ b/frontend/src/features/collections/index.ts
@@ -10,4 +10,4 @@ import("./select-collection-start-page");
 import("./share-collection");
 import("./collection-thumbnail");
 import("./edit-dialog/sharing-section");
-import("./edit-dialog/homepage-section");
+import("./edit-dialog/thumbnail-select");