First steps
Courses
Events and Behaviour Tracking
User Data
- Email Builder Review
- Designing your email
- Creating a Synchronized Module
- Setting Responsivity
- Building Smart Containers
- Creating a Gmail Promotions Annotation
- Adding a Rollover Effect
- Adding a Background to an Email
- Adding Anchor Links
- Adding a Video to an Email
- Adding a Table to an Email
- Adding a Custom Font
- Adding Social Media Buttons
- Editing HTML and CSS
- Working with “Images” block
Omnichannel
Automation
Personalization
Analytics
Multilanguage Campaigns
API
Security and Compliance
Integration
Adding a Background to an Email
When creating or editing an email template, you can apply different backgrounds to different email components:
- Entire email;
- Stripe;
- Structure;
- Container.
How to Add a Background to an Entire Email
Color
Go to Appearance > General settings > Email background color and select the necessary color or insert your color code.
Image
To add a background image, enable Background image and upload the image or select it from Bank.
Make sure you pick the right size of the image. For the template with the default width of 600px, the width of the background image should be 1920px. The length will depend on the length of your email copy.
You can change or edit the image straight in the editor by clicking the corresponding icons.
Enable Center image if you use multi-patterned images or images with a focus on particular objects.
If the length of the image isn’t enough to cover the background of the whole copy, enable Repeat image. The image will be repeated as many times as needed to cover the whole template.
Note. This option is more suitable for homogeneous images with seamless transition. Otherwise, the border between repeated images will be noticeable.
How to Add a Background to a Stripe
Color
Click the necessary stripe, go to Stripe background color and select the color or insert your color code. For a contrast effect, you can apply different colors to different stripes.
Image
To add a background image, enable Background image and upload the image or select it from Bank. Enable Repeat image and Align to center if needed. You can change or edit the image by clicking the corresponding icons.
Note. Stripes are mostly optimized for desktops. Mobiles may not display them or distort the display, depending on the device. To preview your email, click View message on the top panel.
How to Add a Background to a Structure
Color
Click the necessary structure, go to Background color of structure and select the color or insert your color code.
Image
To add a background image, enable Background image and upload the image or select it from Bank. Enable Repeat image and Align to center if needed. You can change or edit the image by clicking the corresponding icons.
Note. Be careful with white logos and other elements put against the colorful image background. If the image isn’t rendered by an email client for any reason, white elements won’t be visible. Consider adding an alternative background that will have the color of the structure.
How to Add a Background to a Container
It’s most applicable to add background to containers for
- Banners;
- Product cards;
- Promo codes.
It's convenient for you as you don’t have to edit the image itself or create it in Photoshop. It’s convenient for the user as they can copy the promo code as text and don’t have to enter it manually.
Color
Click the necessary container, go to Background color of container and select the color or insert your color code. Set Rounding if needed, to round your container.
Image
To add a background image, enable Background image and upload the image or select it from Bank. Enable Repeat image and Align to center if needed. You can change or edit the image by clicking the corresponding icons.
