Add and Edit Web Page Sections

When you build your Mailchimp website, use the Sections panel to quickly mix and match different types of content on each page. Choose a section layout, then add your images, text, signup form, or other custom details to make your website your own.

In this article, you'll learn about the different types of sections you can use to design your website.

Before you start

Here are some things to know before you begin this process.

• Be sure to check out our articles about the website feature to learn more on how to create a website.
• Custom HTML, iframes, and audience features like merge tags aren’t compatible with your Mailchimp website.
• Before you can publish a website, you must agree to our additional terms.

Types of sections

Here are the different section types you can add to your web page.

View sections

To view the sections in your page, follow these steps.

1. Navigate to your website dashboard and click Edit Site.
2. Hover over the page you want to work with and click Edit Page.

3. In the site builder, click the Sections panel.
   
   The panel will expand to show you the sections in your web page.

4. Hover over any section in the panel to view that area of the page.

From here, you can click a section name to access its style options, or click and hold the item handle to move a section.

Edit section styles and components

Each section has a background and layout styling options to help you design a unique page for your website. Some sections also have optional components you can customize, like a logo or social links. To change these settings, click the name of a section in the Sections panel, or hover over the section you want to work with and click Edit Section.

Here are the different styles and components you can edit.

• Layout
  Choose how to arrange the text, image, or other elements in the section.
• Background
  Choose a background color from your palette, or a background image from the content studio.
• Logo
  Replace the logo image or adjust the slider to change the image size.
• Navigation (Header section only)
  Toggle navigation links on or off.
• Fixed Position (Header section only)
  Toggle fixed position on or off. When turned on, the header remains in a fixed position as visitors scroll down the page.
• Transparent nav (Header section only)
  Toggle transparent navigation on or off. When turned on, your header will appear transparent and blend with other sections on your page. The assigned header color scheme will be based on the color scheme of the section directly below it.
• Social links (Footer section only)
  Toggle social media links on or off.

Add a section

There are multiple ways to add a section to your webpage.

Add a section from the Sections panel

To add a section from your Sections panel, follow these steps.

1. On your web page, click the Sections panel.
   
   The panel will expand to show you the sections in your web page.

2. Hover your cursor below the name of the section where you'd like to add a new section, then click Add Section.
   

3. On the Add Section step of the Sections panel, choose the section type you'd like to add.
   
4. Choose a layout for your new section.
   
5. If you select a Video section, click the Link icon, then enter the YouTube or Vimeo URL you want to share. Click Save then Preview to play your video.
   

Add a section from the page layout

To add a section from your page layout, follow these steps.

1. In your page layout, hover your cursor over the plus (+) icon where you’d like the new section to go.
   

2. Click Add Section.
   

3. On the Add Section step of the Sections panel, choose the section type you'd like to add.
   

4. Choose a layout for your new section.
   

5. If you select a Video section, click the Link icon, then enter the YouTube or Vimeo URL you want to share. Click Save then Preview to play your video.
   

Remove a section

To remove a section, follow these steps.

1. Hover your cursor over the section you'd like to remove.

2. Click the Trash icon.
   

3. In the pop-up, click Remove Section.
   

Nice job. If you accidentally remove a section you want to keep while editing your website, click the Undo button.

Next steps

Your website is up and running. Now what? Here are a few ways to optimize your Mailchimp website.

• Customize your website favicon
  Change your site icon to a custom image that matches your brand style and brings a polished look to your website. To learn how to customize your website favicon, check out Customize the Favicon of Your Mailchimp Website or Landing Page.

• View reports
  We’ll start to compile reporting data as people visit your site. You can see who visits your website, clicks links on your web pages, and subscribes to your emails.

• Promote your website
  Promote and share your new website through marketing campaigns in Mailchimp. Run an ad for your website. Link to your website from a regular email campaign. You can also share your website URL on social media.

• Add a pop-up signup form
  A pop-up signup form helps you connect with your website visitors. Design and customize it to fit your brand, and add special offers or discounts to help grow your audience and boost sales. To learn more, check out Add a Pop-Up Signup Form to Your Website.

• Create a store
  Add an online store to sell your products. Creating a store in Mailchimp allows you to add store pages to your existing website. You can then add and sell as many products as you want. To learn more, check out Create Your Mailchimp Store.

• Set up appointments
  Add scheduling tools to grow your business. If you offer professional services, you can use Mailchimp Appointments to set up the details of your services, including pricing and availability. Customers will be able to book appointments with you on your website. To learn more, check out Use Mailchimp Appointment Scheduling.