Design your template with the Email Composer

Introduction

Batch Email Composer helps you build beautiful and impactful email templates, no code needed.

Email remains one of the most impactful ways to connect with your users. Whether you're welcoming new customers, promoting an offer, or building long-term loyalty, email is a key touchpoint in the customer journey.

This guide will walk you through how to make the most of the Email Composer. Let’s get started! 🚀


Appearance Menu

Let’s start with the Appearance menu. Why? Because the styles you define here will apply to your entire email 💪

You only need to configure design elements once — these settings will automatically apply wherever that element is used. No need to restyle buttons, text blocks, or headings every single time.

This saves time and ensures design consistency across your entire template.

In the Appearance menu, you will find the following settings:

General Settings

In this tab, you define the overall look and feel of your email. You can:

  1. Set the Message width (default is 600px, the most common width across email clients);

  2. Choose the Message alignment (centered, left, or right-aligned within the inbox);

  3. Define default padding for structures you will add later;

  4. Pick a general background color and optional background image for your entire email;

  5. Set the default font used across all text blocks (except headings);

  6. Adjust line spacing to make your content more readable or match your brand tone;

  7. Enable or disable paragraph bottom spacing;

  1. Choose whether to underline links throughout the email;

  2. Activate RTL text direction if you're writing in right-to-left languages (like Arabic or Hebrew for example);

  3. Manage responsive design (enabled by default, so your emails look great on both desktop and mobile).

Stripes

A stripe is a horizontal section of your email that contains structures, containers, and content blocks.

To add a stripe, click the "+" icon at the bottom left of an existing stripe:

Each stripe can be manually assigned a type: Header, Content, Footer, or Info area. Using different types of stripes can be helpful for structure and styling adjustments:

You can:

  • Define unique font sizes for each stripe (especially useful for footers, which often use smaller text);

  • Customize text and link colors;

  • Apply a stripe background color to draw attention to specific sections;

  • Add a background image if your brand requires it.

Some email clients, like Outlook, may not display background images. We recommend setting a solid background color as a fallback that matches your image's tones.

Headings

Need to highlight a key message or divide sections? Use Headings.

Just select your text and apply a heading style from the formatting menu:

In the Settings panel, you can customize the font, size, style, color, and line spacing of your headings to fit your design:

Buttons

Buttons drive action. Whether it's visiting your website, redeeming a promo, or following on social media— they matter.

You can set global look for all your buttons:

  • Outlook support toggle (enabled by default, to ensure better rendering in Outlook via VML code)

  • Font and button size, style, and color;

  • Highlight hovered buttons (change colors when you hover the mouse over it);

  • Border radius;

  • Borders (full or per side, including color);

  • Inner padding;

Mobile formatting

All emails built with Batch are responsive by default. This means they automatically adapt to mobile screens. But for full control over how your content appears on smaller devices, you can customize certain settings specifically for mobile.

A your email for mobile

  1. Go to the "Appearance" tab in the editor;

  2. Open the "Mobile view" section:

Here, you’ll be able to:

  • Set custom font sizes for headings H1, H2, and H3;

  • Adjust text size for buttons (we recommend 18px or higher for readability);

  • Apply different font sizes and margins for content;

  • Enable "Full-width buttons" to make your call-to-action buttons span the full width of the mobile screen;

Back to Desktop view you can disable "Responsive images" for specific elements, if needed.

Hide elements on mobile or desktop

If you want to hide some elements on mobile or desktop devices, you don’t need to write a single line of HTML! To hide content from mobile users:

  1. Select the element you want to hide.

  2. Click the "Hide on mobile or desktop" option in the settings panel;

With this enabled, the selected element won’t appear in the mobile/desktop version of your email — ideal for simplifying layouts or removing non-essential visuals.


Content Menu

Now that we've set our general styles in the Appearance menu, editing your template becomes much faster — no need to manually style each element one by one.

In the Content menu, you will find three main building elements of your email:

What is a Structure?

In Batch, the stripe sits at the top of the email layout hierarchy. Each stripe must contain structures, which are automatically added by default.

To insert an additional structure, just drag and drop it from the Content menu to the desired section of your email:

Each stripe can hold multiple structures. And each structure can contain up to 8 containers in a row.

You can move, copy, delete, or save a structure as a module by hovering over it and using the dropdown menu:

What are Blocks?

Blocks are the foundation of your email layout—they’re the most granular elements you’ll work with in Batch. In the Content → Blocks menu, you have access to 13 essential blocks such as:

To use a block, just drag and drop it into your email layout and customize it as needed:

What are modules?

Modules are reusable sections — made up of stripes, structures, or containers — that help you speed up email creation:

You can create your own custom modules and reuse them across templates. Learn how to save modules on the email composer.

Now that you're familiar with the Content section of the Email Composer, it's time to start building your template 🚀

Adding a logo or image

Images bring your emails to life — whether it’s your logo for brand recognition or a banner to support your message. In Batch, adding visuals is quick and intuitive. You can upload images directly, link to them via URL, and adjust their appearance to fit seamlessly into your design. You can add images to your email in two simple ways:

1. Drag and drop / upload from Computer

  • Drag your image directly into your email layout, or

  • Click the arrow icon to browse and upload from your device.

Supported formats: JPEG, PNG, GIF Max file size: 3 MB Max resolution: 4000 × 4000 px

2. Paste external image URL

Don’t have the image locally? Paste a link to the image in the External Link field to pull it directly from the web.

It is also possible to edit images directly into the Email Composer.

Adding text

Text is a core element of any email — whether you're crafting a warm welcome message, highlighting a promotion, or guiding users to take action. In Batch, adding and customizing text and links is simple and flexible. You can easily drag a text block into your layout:

Then, you can style it to match your brand, and structure your content for maximum impact:

Adding CTA button

A CTA (Call to Action) button is one of the most critical elements in your email — it directly impacts your click rate. Without a clear button, your audience can’t take the next step, whether it's making a purchase, signing up, or learning more.

Here’s how to create one in Batch:

  • Drag and drop the "Button" block into your email layout, ideally next to the content it relates to.

  • Click the button block to activate the Settings panel.

  1. Enter the destination URL your button should link to.

  2. Add your button label (this is the call to action your users will see for example: Shop Now, Get Started).

  3. Customize the text styles: choose your font, size, and colors for both text and background.

  4. Set the border-radius to round the button corners, if desired.

  5. Define an alignment.

In the Appearance tab, you can globally enable “Highlight hovered buttons.” The hover color itself is configured in the Content tab when editing a specific button.

Add a spacer

While a spacer won’t increase conversions, it plays an essential design role — it helps structure your content, adds breathing room, and improves overall readability.

Here’s how to add and customize a spacer in Batch:

  • Drop the "Spacer" block inside that structure.

  • Click the spacer to open the settings panel.

  1. Enable dynamic resizing to manually adjust the spacer’s size by dragging;

  2. Choose a background color;

  3. Pick a line style — options include solid, dashed, or dotted;

  4. Define the width of the spacer.

  5. Adjust the alignment (centered by default, but you can change it to left or right);

  6. Toggle "Responsive spacer" to ensure proper rendering on mobile devices;

  7. Set padding to manage the space around the spacer within its container;

  8. If needed, add anchor links (they are not supported in some email clients: iOS Gmail app, iOS Apple Mail, Outlook app on Android, Outlook app for macOS and AMP Emails).

A well-placed spacer keeps your email clean, balanced, and easier to scan — small detail, big visual impact.

Add video

Want to make your emails more dynamic and engaging? Adding videos to your email is a great way to capture attention and increase interaction. Whether you’re showcasing a product demo, a testimonial, or event highlights, adding videos in your Batch email template is quick and easy.

Add social media

Including social media icons in your emails is a great way to encourage your audience to connect with your brand beyond the inbox.

Whether it's Facebook, LinkedIn, Instagram, or others, adding these links is simple with Batch. You can easily embed social media links using our Email Composer.

Social blocks not only complete your email visually — they also help drive traffic to your online communities. Add them strategically, typically in the header or footer, to stay connected with your audience.

Add banner

Banners are the first element your reader will see at the opening of your email. They introduce your brand and set the tone of the e-mail, which is why it's so important to make them as impactful as possible.

Let's see how to create an email banner?

Add menu

The Menu block allows users to navigate to specific pages on your website — or even to sections within the email itself. It is a smart way to guide your readers and encourage click-throughs, make sure it’s clear, concise, and consistent with your branding!

Here’s how to add and customize a menu block in Batch:

  • Drag the "Menu" block into your email template.

  • Add additional menu items if needed. By default, Batch provides three items to start with.

  • In the Settings panel, choose whether your menu should display:

    • Icons only

    • Links only

    • Icons and links

  • Adjust the font size if needed for better visibility. For example, set it to “18” for a more prominent look.

  • If using Icons and links, choose the desired alignment and upload your icons.

If you choose Links, the font and colors you defined in your General settings will automatically apply. You can further customize the font style (e.g., make it bold) directly from the settings panel.

  • Label each menu item and insert the corresponding URL for redirection.

  • Repeat for all menu tabs.

  • To hide menu items on mobile, simply click the “Hide on mobile” icon next to each item.

Mobile optimization: enable the "Adaptive menu" toggle to ensure menu items stack vertically on mobile devices. This greatly improves readability and usability on smaller screens.

Add countdown timer

A countdown timer is a great way to capture attention and inspire action. It adds excitement by clearly showing how much time remains before an offer begins or ends — perfect for creating anticipation and encouraging quick decisions.

To add a timer:

  • Drag a structure into your template.

  • Drop the "Timer" block into it.

  1. Set the end date and time;

  2. Choose the time zone;

  3. Choose number font, size and color

  4. Add background color

  5. Toggle "Display days" if you want the timer to show days

  6. Choose your preferred separator (e.g., “:”, “-”, “/”).

  7. Enable "Number labels" to show "days", "hours", etc., under digits.

  8. Choose the language of your label

  9. Style the labels (font, size, color).

  10. Toggle "Expired timer image" to show a fallback image after expiry.

  1. Add a URL to redirect users to a specific page when they click the timer.

  2. Set alt text for the expired timer image for better accessibility.

  3. Align the timer to match your brand’s layout and design.

  4. Adjust the size for optimal display across devices.

  5. Define the timer’s width to suit your layout.

  6. Choose whether to make the timer responsive

  7. Use Advanced Settings to further customize digit and label colors.

  8. Add padding to give the timer breathing room.

That’s it — your countdown timer is all set to drive engagement!

Add HTML code

Sometimes, your email design might require specific features or layouts that go beyond what the visual editor offers. In these cases, you can easily insert your own custom HTML code into your Batch template.

Here’s how to do it:

  • Inside a structure, drag and drop the “HTML” block.

  • Click “Insert your HTML in the Code editor” to open the code editor window.

  1. Paste your custom HTML code into the editor.

  2. Customize or fine-tune the code as needed.

This feature gives you the flexibility to embed widgets, dynamic content, or any HTML-based elements that fit your brand’s needs.

Save a custom module

If you find yourself reusing the same layout blocks across multiple emails — like headers, footers, product sections, or CTAs—Batch lets you save time by turning them into reusable custom modules.

Once saved, you can quickly drag and drop these modules into future templates, keeping your emails consistent and efficient to build. Here is how to save modules on the email composer?

Add hidden preheader

Email marketing is a powerful tool for engaging with your audience, but optimizing your campaigns for maximum impact requires attention to detail!

One crucial element often overlooked is the pre-header, a valuable asset that can significantly improve the open rate of your email campaigns:

You can add the pre-header directly into the HTML.


Once your email template is complete, you can preview and test it by returning to the email message editor. This allows you to review how the template will appear in recipients' inboxes and make any final adjustments before sending 🚀

Last updated

Was this helpful?