Skip to main content

Email Template

Content Studio​

Email Template

TrueBeep’s Email Template feature makes it simple to design and customize professional emails. This guide outlines everything you need to know about using the drag-and-drop builder to create dynamic email campaigns.

Learn how to add widgets, use pre-designed modules, style your content, and explore templates to save time. For those with coding expertise, the JSON section allows manual editing for complete control over your designs.

Follow the steps to build and personalize email templates that align with your brand and deliver the right message to your audience.

Accessing the Email Template Editor​

To create email content:

  1. Click on "Emails" under the Content Studio menu on the left.
  2. You will be redirected to the Emails page where you can create or edit email content.

To begin creating a new email:

  • Click the "Create" button to access the Email Template Editor page.

On the left sidebar menu, you will find five sections:

  • Widgets (default selection)
  • Modules
  • Styles
  • Templates
  • JSON
note

Ensure you name an email template before saving. Save the template after adding or editing sections to preserve progress.

Widgets​

Adding and Managing Widgets​

The Widgets section contains tools to build your email:

  1. Drag a widget from the left sidebar onto the empty page on the right.
  2. Use the Grid Columns option to combine multiple widgets in the same section.

Example: Adding a Heading Widget​

  1. Drag the Heading widget onto the page.
  2. Click the widget to edit. Three options will appear:
    • Drag to reposition.
    • Duplicate to copy the widget.
    • Delete to remove the widget.
  3. Write your desired heading text in the field that appears.

AI Suggestions​

If you're unsure how to write effective content:

  1. Launch the AI Suggestion tool from the left sidebar.
  2. Enter your topic in the prompt field.
  3. Select a tone (e.g., Professional, Friendly, Sales) from the dropdown.
  4. Click "Get Suggestions" to view five options. Choose one to auto-fill the text field.
  5. Style the text using the upper toolbar.

Styling and Padding​

  • Adjust Padding from the left menu under the AI suggestion field.
  • Change the block background color via the Colors option.
  • Use the alignment tool at the bottom of the right sidebar for precise layout adjustments.

Modules​

The Modules section includes pre-designed components:

  • Topbar
  • Navigation
  • Hero
  • Footer

Drag and drop these modules to streamline your design process.

Styles​

The Styles section allows further customization:

Color​

  • Body Background: Change the email's overall background color.
  • Container Background: Adjust the background where widgets are placed.

Border​

  • Increase thickness to add borders.
  • Set Border Color and choose styles (Solid, Dashed, Dotted).

Typography​

Customize text by selecting Body or Heading and adjusting:

  • Font Family
  • Font Size
  • Line Height
  • Letter Spacing

Widgets​

Fine-tune widget padding using the sliders.

Templates​

Using Pre-Designed Templates​

If you're short on ideas, explore the Templates section:

  1. Browse professionally designed templates.
  2. Click "Preview" to examine a template's layout.
  3. Select your desired template to load it into the editor panel.

Customizing Templates​

  • Modify widgets, text, images, and buttons.
  • Adjust fonts, colors, and layouts to match your brand.
  • Add unique elements like logos and brand colors for consistency.

Regular updates to the template library ensure fresh designs for your campaigns.

JSON​

Coding Your Email Template​

For advanced users:

  1. Click "Code" on the top-right corner of the editor.
  2. Enter your HTML code in the notepad provided to build the template manually.

Start creating impactful email content with Truebeep and captivate your audience today!