---
title: Add, remove, and reorder page sections
shortDescription: Add, remove, reorder, duplicate, and hide sections on any page of your Fourthwall site using the Layout tab in Site design.
articleType: Tutorial
primaryTopic: page-sections-management
categories:
  - Store Design
tags:
  - page-sections
  - site-design
  - layout-editor
  - section-visibility
  - drag-and-drop
  - homepage-layout
  - section-types
  - storefront-customization
  - duplicate-section
  - section-management
tasks:
  - Add a section to a page
  - Remove a section from a page
  - Reorder page sections by dragging
  - Hide a section without deleting it
  - Duplicate a page section
  - Edit a section's settings and advanced options
  - Edit blocks inside a section
terms:
  - add page section
  - remove section from page
  - reorder sections
  - hide section from visitors
  - duplicate section
  - page layout editor
  - site design layout
  - section types fourthwall
  - hero section
  - announcement bar countdown
  - advanced section settings
  - custom CSS section
  - block settings sub-view
  - edit blocks in section
labels:
  - site-design
  - layout
  - page-sections
contextString: Available on all Fourthwall plans. Accessed via Site design > Layout in the creator dashboard.
breadcrumbPath: "Getting started > Design my storefront"
relatedModules:
  - name: theme-editor-layout-home
    route: /admin/dashboard/store-design/layout/index
  - name: theme-editor-pages
    route: /admin/dashboard/store-design/pages/
  - name: theme-editor-layout-checkout
    route: /admin/dashboard/store-design/layout/checkout
last_updated: '2026-05-11'
path: getting-started/design-my-storefront/managing-page-layout-sections
---

# Add, remove, and reorder page sections

Your Fourthwall site pages are built from sections — content blocks you can add, move, hide, duplicate, or delete at any time. Use the Layout tab in Site design to control what appears on each page and in what order.

## Step 1: Open the Layout tab

Go to [**Site design > Layout**](https://my-shop.fourthwall.com/admin/dashboard/store-design/layout/index/?redirect) in your Fourthwall dashboard.

[Image: Site editor sidebar showing the Home page Layout tab with Header, Image banner, Featured collection, and Footer sections, alongside a preview of the storefront.]

Use the dropdown at the top of the Layout panel to select the page you want to edit. The **Home** page is selected by default. You can switch to any other page, including custom pages, collections, memberships, and checkout.

## Step 2: Add a section

Click **(+) Add page section** in the left panel to open the section picker.

[Image: Add new section modal displaying layout options including Image, Video, Text, and Shop categories, with section previews like "Bold new looks" banner on the right.]

Sections are organized into categories:

**Layout**
- **Hero/banner** — full-width image with optional text and buttons
- **Image** — a single image or image gallery
- **Text** — headlines and body copy
- **Text carousel** — scrolling text in a rotating banner
- **Links** — a list of links with icons and text
- **Spacer** — adds vertical space between sections

**Media**
- **Video** — upload or embed a video
- **YouTube** — display your latest YouTube videos
- **Instagram feed** — show your latest Instagram posts
- **TikTok feed** — show your latest TikTok videos

**Shop**
- **Shop** — displays all your products
- **Featured collection** — highlights a specific collection
- **Featured product** — spotlights a single product

**Memberships**
- **Membership tiers** — promotes your membership options
- **Recent posts** — shows your latest membership posts

**Engagement**
- **Newsletter** — adds an email signup form
- **Donations** — lets supporters send donations
- **Embed** — embeds an external page as an iframe
- **Custom HTML** — adds your own HTML and code

**Navigation**
- **Search bar** — lets visitors search your site
- **Announcement bar** — adds a text bar with optional countdown

Click **Add** next to the section type you want. The section appears at the bottom of the page and its settings open automatically.

## Step 3: Reorder sections

Grab the drag handle (the six-dot icon) to the left of any section and drag it to a new position in the list.

[Image: Site editor sidebar showing Layout panel with Header, Image banner, Featured collection, and Footer sections, alongside a homepage preview with "Join the gang today" banner.]

The live preview on the right updates as you drag.

## Step 4: Edit a section's settings

Click any section in the left panel to open its settings. Each section has its own set of options. Common settings include:

- **Alignment** — controls how text and elements are positioned
- **Background color** — sets a custom background for the section
- **Links and buttons** — configures where the section's call-to-action points

Make your changes in the settings panel. The preview updates live. Click **Save** when you're done.

## Show advanced options

Less common settings sit behind the **Advanced** toggle at the bottom of the section panel. Click **Advanced** to reveal options like:

- **Customize colors** — override the section's colors independently of your theme
- **Adjust text size** — change font sizes for that section
- **Padding** — adjust the space above and below the section content
- **Add custom CSS code** — apply your own CSS to fine-tune the section

[Image: Announcement bar settings panel with Text, Countdown, and Links to options visible and a collapsed Advanced toggle at the bottom.]

Some settings only appear after you turn on a related option. For example, in the **Announcement bar** section, the **Countdown start date** and **Countdown end date** fields appear only after you check **Enable countdown**. This keeps the panel focused on what's relevant to your current setup.

## Edit blocks inside a section

Some sections, like **Hero/banner** or **Featured collection**, contain individual blocks such as a heading, a button, or an image. To edit a block, open the section and click the block in the **Blocks** list. The panel switches to a dedicated sub-view for that block.

Each block has its own settings page. Use the back arrow at the top of the panel to return to the parent section.

## Step 5: Duplicate, hide, or delete a section

Click the three-dot menu icon next to any section to see these options:

- **Duplicate** — creates a copy of the section directly below it, with all settings preserved
- **Hide** — toggles the section's visibility for site visitors without removing it from the page
- **Delete** — permanently removes the section from the page

[Image: Image banner settings panel with an open context menu showing options to Hide section, Rename section, Duplicate section, and Delete section.]

The eye icon on each section also controls visibility directly. Click it to hide or show the section. Hidden sections appear grayed out in the editor but are not visible to visitors.

Hiding a section is useful for seasonal content. You can build a holiday promotion section, hide it until it goes live, and re-hide it once the promotion ends, without deleting anything. All settings and content are preserved when a section is hidden, and you can make it visible again at any time.

## Frequently asked questions

### Can I add sections to pages other than the homepage?

Yes. Use the page dropdown at the top of the Layout tab to switch to any page on your site, including custom pages, collection pages, and membership pages. The **(+) Add page section** button works the same way on every page.

### Can I have the same section type appear more than once?

Yes. You can add multiple instances of the same section type on a single page. For example, you can add two **Featured collection** sections to highlight different collections.

### What happens to a section if I hide it?

The section stays on the page with all its content and settings intact. Visitors don't see it, but you can make it visible again at any time by clicking the eye icon.

### Can I copy a section to a different page?

No. **Duplicate** creates a copy on the same page only. To recreate a section on a different page, navigate to that page using the dropdown at the top of the Layout tab, click **(+) Add page section**, add the same section type, and configure its settings manually.

### Can I reorder sections on mobile?

The Layout tab is designed for use in the desktop dashboard. Drag-and-drop reordering works best on a desktop or laptop.
