Alternating background colors are a simple design technique that can help your Mailchimp templates pop. In this blog post, we’ll explore three strategies for creating an alternating background color effect in Mailchimp, including both the new builder and classic template builder. Get ready to captivate your audience with alternating background colors in Mailchimp emails!
Classic Builder: Using Sections for Alternating Background Color
In Mailchimp’s classic builder, the simplest way to create an alternating background color effect is by using the pre-built sections. Depending on the template you choose to begin with, these may include:
- Preheader
- Header
- Upper body
- 2-column section
- Lower body
- 3-column section
- Footer
As you can see from the names, these sections place some restrictions on the layout of an email. Additionally, sections in the template cannot be moved or duplicated. The upper body will always be placed above the footer, etc.
Without using custom-coded templates, classic builder emails allow for a maximum of 6 sections, which can each be assigned a unique background color under the style settings.
Still wondering how to make section backgrounds work for you? Book a 1 hour training session for answers to all your questions!
Classic Builder: Using Boxed Text & Code
For users looking for more flexibility in background color, without creating an entirely custom-coded template, there is another option. Mailchimp’s boxed text & image card blocks give you the option to assign as many background colors as you want throughout an email. However, both boxed text & image card blocks come with a few pixels of padding on all sides.
Reflect Digital has a great guide on working around this restraint. Their method involves creating a boxed text block, copying the html code, and pasting it into one of Mailchimp’s “code” content blocks. Then, users can locate the padding settings in the code and remove them.
This tip is a great way to work around the classic builder’s limitations, but users with no code experience should be careful. Messy HTML can create deliverability issues and render poorly on different devices. To work with the support of a professional, contact Pure Firefly about custom-coded templates.
New Builder: Background Color Settings
In Mailchimp’s new builder, users can now customize the background color settings within each content block. This makes an alternating background effect much easier to achieve. Just use the left-side style menu to choose the background color for each section. Mailchimp’s new builder also saves a swatch for each color you’ve used within the template, allowing users to create a cohesive template. If you have yet to get acquainted with the new email builder, try a training call with one of our email specialists, or keep an eye out for our upcoming new builder webinar!
Unlock More Options with Pure Firefly
Alternating background colors are possible in both Mailchimp’s classic and new builders. However, there are limitations depending on which builder you use. To maximize your design potential, try working with Mailchimp experts like the ones at Pure Firefly. With a history of designs for clients in various industries, our team is flexible and ready to create an eye-catching email for your brand or organization! Just contact us for a quote, or book a training session for all your Mailchimp questions.
