View and Edit Section Design in Email and Landing Pages
Design entire sections of your emails and landing pages, including the header, footer, and body. Learn how to add borders, background colors, and more.
Add and Edit Web Page Sections
Copy Article URL
Copied
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.
| Section Type | Description |
|---|---|
| Header | The top area of your web page. This can display your logo, your navigation bar, and a button. Each page has only one Header, which can't be moved or removed. |
| Intro | A place to introduce your business or brand. This can include a text area, an image, and a button. |
| Text | A section just for text. This can include 1-column text or 2-column text. |
| Text & Image | A section for including images and text side by side. This can include a text area, an image, and a button. |
| Subscribe | A section that includes a basic signup form so visitors can subscribe to your email marketing. When someone signs up, they’ll be added to the audience associated with your website. This can include an email input field, an image, a text area, and a subscribe button. |
| About | A section to share details about your business, brand, or message. This can include multiple images and text areas. |
| Contact | A section to inform your visitors on how to get in touch with you. This can include text areas and a call-to-action button. |
| Footer | The bottom area of your web page. This can display your logo, your sitemap, social links, a text area, and a button. If you're on a free plan, it will also display the Mailchimp badge. Each page has only one Footer section, which can't be moved or removed. |
View sections
To view the sections in your page, follow these steps.
- Navigate to your website dashboard and click Edit Site.
- Hover over the page you want to work with and click Edit Page.
In the site builder, click the Sections panel.
The panel will expand to show you the sections in your web page.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. - Social links (Footer section only)
Toggle social media links on or off.
Add a section
To add a section, follow these steps.
In your page layout, hover your cursor over the plus (+) icon where you’d like the new section to go.
Click Add Section.
On the Add Section step of the Sections panel, choose the section type you'd like to add.
Choose a layout for your new section.
Nice job. You’ve added a new section to your page design and can now customize it with your own content.
Remove a section
To remove a section, follow these steps.
Hover your cursor over the section you'd like to remove.
Click the Trash icon.
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.