--- title: 'Design your site: Navigate the layout tab' shortDescription: Learn how to navigate the site designer's Layout tab to arrange pages, sections, and content articleType: Tutorial primaryTopic: site-layout-editor categories: - Store Design - Creator Dashboard tags: - layout-tab - site-editor - theme-editor - page-sections - site-design - homepage-layout - page-structure - section-types - site-customization tasks: - Access the Layout tab in the site editor - Choose which page layout to edit - Add new sections to a page - Edit and reorder existing sections - Hide or delete sections from a page terms: - layout tab - site editor - page sections - site design - theme editor - homepage layout - page builder - drag and drop sections - add sections - customize site layout - site structure - page editor labels: - site-design - layout - site-editor contextString: Available on all plans. Requires a Fourthwall account with an active site. breadcrumbPath: "Getting Started > Design My Storefront > Designing your site: Navigating the layout tab" path: getting-started/design-my-storefront/navigate-layout-tab relatedModules: - name: theme-editor-layout-checkout route: /admin/dashboard/store-design/layout/checkout - name: theme-editor-layout-home route: /admin/dashboard/store-design/layout/index - name: theme-editor-layout-memberships-perks route: /admin/dashboard/store-design/layout/memberships_perks - name: theme-editor-layout-memberships-feed route: /admin/dashboard/store-design/layout/memberships_feed - name: theme-editor-layout-coming-soon route: /admin/dashboard/store-design/layout/password last_updated: '2026-06-12' --- # Design your site: Navigate the layout tab The Fourthwall site editor's Layout tab is where you arrange your site's pages and sections. Use it to add, reorder, hide, or delete sections on any page without writing code. Access it at [**Site Design > Layout**](https://my-shop.fourthwall.com/admin/dashboard/store-design/layout/index/?redirect) in your dashboard. ## Step 1: Access the Layout tab Go to [**Site Design > Layout**](https://my-shop.fourthwall.com/admin/dashboard/store-design/layout/index/?redirect) in your Fourthwall dashboard. The left panel shows all sections on the current page. The right panel shows a live preview. The **Site Design** section's entry URL (`/admin/dashboard/store-design/general/`) lands on the **Style** tab by default. The direct URL for the **Layout** sub-tab is `/admin/dashboard/store-design/layout/index/`. Both URLs are valid. The **Layout**, **Style**, **Pages**, and **Theme** sub-tabs all live inside **Site Design**. For a full overview of all four tabs, see [Fourthwall site design options](/getting-started/design-my-storefront/site-design-options). [Image: Layout tab showing sections list and site preview] ## Step 2: Choose which page layout to edit The **Layout** tab opens to the Home page by default every time you visit it. To edit a different page: 1. Click the dropdown menu at the top of the left panel. 2. Select an existing page or choose **+ Create Page** to make a new one. Available pages include **Home**, **Search**, custom pages, **Memberships**, **Policies**, **Checkout**, and more. [Image: Layout tab page dropdown listing Home, Custom pages, Memberships, Policies, Checkout, and Create page option] Some pages have limited customization options because of their fixed structure. **Checkout** and product pages fall into this category. The **Search** page supports full section customization, just like any other page. ## Step 3: Edit sections within your page Each page is made up of sections such as headers, banners, and product displays. Use these controls in the sections list: - **Move.** Click and hold the six-dot icon next to a section, then drag it up or down to reorder it. - **Hide.** Click the eye icon to remove a section from the page temporarily without deleting it. - **Delete.** Click the section name, then select **Delete** to remove it permanently. - **Edit.** Click a section's name to open its settings and customize text, images, or layout. ## Step 4: Add new sections To add content to any page: 1. Click **Add page section** at the bottom of the sections list. [Image: Click on Add page section] 2. Browse the section categories and select the type you want to add. Available categories include text, text blocks, images, videos, and more. Text blocks divide lengthy content into structured segments, making it easier for visitors to scan and engage with your site. [Image: All available sections to add] 3. Click the new section's name to open its settings and configure it. [Image: Edit a page section] ## Available section types The Layout tab offers sections in five categories. **Layout elements:** - **Text.** Add headlines and descriptions. - **Text banner.** Create clean, impactful header text without image assets. - **Image.** Upload a standalone image. - **Image with text.** Combine an image with text content. - **Image banner.** Combine image, text, and buttons. - **Video banner.** Combine video, text, and buttons. - **Custom HTML.** Embed your own code. - **Links list.** Create a links list with icons and text. - **Announcement bar.** Add a text bar with an optional countdown timer. - **Video.** Upload or embed a video. - **Video with text.** Combine video with text content. **Shop elements:** - **Featured collection.** Showcase a group of your products. - **Featured product.** Highlight a single product. - **Collections list.** Display all your collections. **Memberships elements:** - **Membership tiers.** Promote your membership tiers to site visitors. - **Recent posts.** Embed your latest membership posts. **Social feeds:** - **YouTube feed.** Embed your latest YouTube videos. - **TikTok feed.** Embed your latest TikTok videos. - **Instagram feed.** Embed your latest Instagram posts. **Other:** - **Donations.** Ask your fans for donations. - **Newsletter.** Add an email signup form. - **Embedded section.** Embed a third-party section as an iframe. ## Step 5: Use the other site editor tabs The **Layout** tab controls page structure. Three other tabs in the site editor refine the look and feel of your site: - **Style.** Adjust colors, fonts, and branding. - **Pages.** Manage and organize the pages on your site. - **Theme.** Apply pre-made themes for a consistent design. Go to [**Site Design > Layout**](https://my-shop.fourthwall.com/admin/dashboard/store-design/layout/index/?redirect) to start arranging your site.