Stripo Drag-and-Drop Email Editor Settings

Updated: November 22, 2024

Email Settings Column Overview

On the right-hand side of the Maildroppa email editor, you'll find the Email Settings Column, which provides tools to help you structure and customize the content and appearance of your email. This column is divided into two tabs: Content and Appearance.

Content Tab

The Content tab is where you design and organize the content of your email. It contains two main sections: Structures and Blocks.

1. Structures

Structures define the layout of your email by arranging content into rows and columns. You can select from various pre-designed layouts, such as single-column, two-column, or multi-column structures. However, you are not limited to these options—you can combine multiple blocks to create any custom layout you like, providing complete flexibility to suit your design needs.

• Drag and Drop: Simply drag a structure from this section and drop it into your email design area to begin adding content.
• Customization: Once a structure is added, you can populate it with different content blocks like images, text, or buttons.

2. Blocks

Blocks are the content elements you place inside the structures to build your email.

The available block types are:

• Image: Upload images (PNG, JPG, GIF) and customize their appearance.
• Text: Add and format text to communicate your message.
• Button: Add clickable buttons with customizable text, links, and styles.
• Spacer: Insert a blank space to adjust the layout between other blocks.
• Video: Embed video content from platforms like YouTube, Vimeo, and more.
• HTML: Add custom HTML and CSS code for advanced email content customization.

Each block is designed to be flexible and customizable, allowing you to create an email that aligns with your brand’s look and feel.

Detailed Explanation of Content Blocks

Image Block

The Image Block in Stripo’s drag-and-drop email editor allows you to add and customize images in your email campaign.

Here’s how you can work with the Image Block:

Adding an Image Block

You can add an image block to your email in two ways:

Option 1
Hover over the "Drop Content Here" area in a structure, and then click the Image icon. This will immediately turn the selected structure into an image block.

Option 2
Navigate to the Blocks section under the Content Tab. Drag the Image block into the desired structure in your email layout. This method gives you more control over where exactly to place your image.

Uploading an Image

Once you’ve added the image block, you have two methods for uploading an image:

Drag and Drop
You can directly drag and drop an image file (PNG, JPG, GIF) from your computer into the upload box that appears inside the image block.

Upload from Computer
Alternatively, you can click on the cloud icon in the image block to open your file browser, allowing you to select an image from your computer (up to 2MB). Once selected, the image will appear both in the block and in the content tab on the right.

Changing the Image

To replace the image, use the Change Image option found in the content tab. Click the circular Change Image icon, which will allow you to upload a new image or link an image from an external URL.

Editing the Image

After uploading an image, you may want to make additional edits directly within the platform. Stripo’s built-in Image Editor allows you to enhance and adjust your images without leaving the email editor.

Here’s how you can edit an image:

Accessing the Image Editor

1. Once an image is uploaded, click on the Edit Image button. This opens the Image Editor interface.

2. The editor offers a wide range of tools, displayed in the top menu bar.

Available Image Editing Tools

• Filters
  Apply various filters (e.g., grayscale, sepia, or brightness adjustments) to give your image a unique look.

• Resize
  Adjust the dimensions of your image. You can define a specific width and height or maintain aspect ratio.

• Crop
  Select a portion of the image to keep and remove unwanted parts.

• Transform
  Rotate or flip the image horizontally or vertically.

• Draw
  Use the drawing tool to add freehand elements, such as lines or custom shapes, on top of your image.

• Text
  Add text directly to the image. Customize the font, size, color, and alignment.

• Shapes and Stickers
  Enhance your image by overlaying pre-made shapes or fun stickers.

• Frames
  Choose from a selection of frames.

• Corners
  Adjust the corner style for a polished look.

• Background
  Use this tool to remove or replace the background of an image for a cleaner appearance.

Saving the Edits

Once you’ve made the desired changes, click the Save button at the top left of the editor. The edited image will automatically replace the original in your email layout.

Image Settings

After uploading the image, you can customize it using the Image Settings options available in the Content Tab on the right-hand side.

Link
Add a link to the image. You can choose from various types of links, such as:

• Website (HTTP, HTTPS)

• Mail (mailto:)

• File (ftp)

• Social Sharing (Facebook, X (formerly Twitter), LinkedIn, Pinterest)

  You can find these options in the link settings dropdown.

Alternate Text
Add alternative text that will be displayed if the image does not load. This text is also useful for accessibility, allowing screen readers to describe the image to visually impaired recipients.

Alignment
Choose how the image should be aligned within its container. You can align it to the Left, Center, or Right.

Size
Adjust the width and height of the image manually using the plus/minus buttons or by typing in the desired dimensions (as shown in the image below).

You can also enable the "Adjust to Width" option to make the image automatically fit the full width of the container.

Responsive Image
Enable the "Responsive Image" option to ensure the image adapts to different screen sizes, especially on mobile devices.

Padding
Customize the padding around the image to control how much space appears between the image and the surrounding content. You can apply padding uniformly or customize it for each side (Top, Bottom, Left, Right).

Anchor Links
You can assign an anchor link to the image, which will allow recipients to jump to a specific section within the same email when they click the image. However, note that anchor links may not work in certain email clients like Gmail and Apple Mail.

Text Block

Enhance your text blocks by customizing their appearance and functionality using the following settings. Each option allows you to fine-tune how your text is displayed, ensuring it aligns perfectly with your design preferences.

Text Toolbar

When you click into a text block, the Text Toolbar appears above the content area, providing quick access to many common text formatting options. Here are the features available in the toolbar:

1. Paragraph Format
   Set the paragraph style by choosing from options like "Normal" for regular text, or various heading levels (Heading 1 to 6) for creating a structured hierarchy in your email. This helps make the content more readable and organized.

2. Font Family
   The default font is Arial, but you can choose from a variety of fonts, including common options like Georgia, Helvetica, and Courier New. There's also a search function to quickly find a specific font.

3. Font Size
   You can adjust the font size from 8pt to 72pt. The default is 14pt, which works well for most email body text. Use the dropdown to quickly set the desired font size.
   

4. Text Styling
   Style your text using the following options:

   • Bold (B): Emphasizes text by making it bold.
   • Italic (I): Italicizes the text for a more stylized appearance.
   • Underline (U): Underlines text, commonly used for hyperlinks.
   • Strikethrough (S): Draws a line through the text, useful for edits or removed content.

5. Advanced Text Styling (Three Dots Menu)
   Clicking the three dots in the toolbar expands additional options:

   • Subscript: Lowers text below the baseline (useful for footnotes or chemical formulas).
   • Superscript: Raises text above the baseline (commonly used for exponents or ordinal numbers).
   • Remove Formatting: Strips away any applied formatting, returning the text to its default style.

6. Text and Background Color

   • Text Color: Click the Text Color button to choose from a palette or input a hex code for precise control over the text color.
   • Background Color: Similarly, select a background (highlight) color for your text. This is useful for highlighting important information or visually separating sections.

7. Text Alignment
   Align your text within the block:

   • Align Left: Aligns text to the left.
   • Center: Centers the text.
   • Align Right: Aligns text to the right.
   • Justify: Distributes text evenly across the width of the block.

8. Lists
   You can create ordered (numbered) and unordered (bulleted) lists:

   • Insert/Remove Bulleted List: Adds or removes bullet points.
   • Insert/Remove Numbered List: Adds or removes a numbered list.

9. Line Wraps
   Enable or disable line wrapping within the text block. When enabled, long lines of text automatically move to the next line.

10. Indentation
    Adjust the indentation of your text:

• Increase Indent: Moves the text further from the margin, useful for sub-points or quotes.
• Decrease Indent: Reduces the indent, bringing the text closer to the left margin.

11. Insert Hyperlink

    To add or edit a hyperlink in your email content, follow these steps:

    Highlight the Text
    Select the text you want to turn into a link.

    Click the Link Icon
    In the Text Toolbar at the top of the content area, click the Link Icon.
    

    Modify the Link in the Right-Hand Settings Panel
    After clicking the icon, the settings panel on the right-hand side opens a dedicated section for link management:

    • Link Field: Enter or edit the URL in the provided field. You can select a predefined Site option or manually enter the full link.

    • Tag: Use the dropdown menu to add a tag associated with the link. Tags help label or organize subscribers who click the link and may trigger specific automations if configured.

    Note: If you want to use the link re-targeting feature, you must enable Click Tracking in your email campaign settings. While some customers may choose to disable Click Tracking for privacy reasons or to improve email delivery rates, this feature is required for re-targeting functionality.

    Adjusting Links or Tags After Sending
    Once the email campaign has been sent, links can still be edited, assuming the campaign was sent with Click Tracking activated.

    • View Campaign:
      Go to the campaign overview, locate the sent email, and click the three dots next to the campaign. Choose View Campaign.
      

    • Modify Link Targets:
      At the bottom of the campaign details, you will find a list of all links included in the email. From here, you can:

      • Update Link Targets: Change the destination URL if there was a typo or if you need to update the link after the campaign was sent.
      • Manage Tags: Add or remove tags assigned to a link, allowing you to manage automations triggered by link clicks.
        

• Customize Link Appearance
  You can further customize how links appear in the Right-Hand Settings Panel under the Blocks section:

  • Link Color:
    Choose the color of the link by selecting from a palette or entering a hex code (e.g., #cc0000).
    

  • Underline Links:
    Toggle this option to underline the link or remove the underline for a cleaner design.
    

12. Personalization Tags
    Add dynamic content, such as the recipient's first name or other personalized fields, using the Personalization Tags dropdown in the toolbar. You can select common fields like First Name, Email, or Country, or define custom fields to personalize the email for each recipient.

13. Emojis
    Add emojis to your text by clicking the emoji icon in the toolbar. Emojis are categorized for easy browsing, but remember to test emails in certain clients like Outlook, as some may not display emojis correctly.

14. Table Insertion
    Insert tables into your email by clicking the Table icon. You can customize the number of rows and columns, along with cell spacing, padding, and border size, to control how the table appears in the email.

15. Insert Special Characters
    Click on the Insert Special Character icon to access a wide range of symbols, accented characters, and more. This is useful for adding non-standard characters to your text.

Additional Text Block Settings (Right Panel)

The right panel provides further control over how your text block appears:

1. Text Color
   Define the color of the text using a hex code or the color picker.

2. Background Color
   Set the background color for the text block (transparent by default), or choose a custom background color using the color picker.

Note: In case the text content area contains links, two additional items will appear in the menu:

3. Link Color

Adjust the color of the links within the text block by selecting from the color picker or entering a hex code.

4. Underline Links

Toggle this option to decide whether or not links within the text block are underlined.

5. Link Editing (in combination with selecting a link in the content area)
   When you select a link in the content area, you can edit the link URL in the settings area on the right. To edit the tag for a link, simply choose from the available tags in the dropdown menu labeled 'Tags' directly below the link URL. ![Edit a link and optionally add a tag to it.]

6. Alignment
   Align the entire text block within its container (Left, Center, Right).

7. Fixed Height
   Toggle on to set a fixed height for the text block, allowing you to define the block's height in pixels. You can also control the vertical alignment of the text (Top, Middle, Bottom).

8. Line Spacing
   Choose between Tight, Normal, or Wide line spacing to control how close or spaced out the lines of text are.

9. Padding
   Adjust the padding around the text block. You can apply padding uniformly or customize it for each side (Top, Bottom, Left, Right).

10. Anchor Links
    Create anchor links to jump to specific sections of your email. Be aware that some email clients do not support anchor links.
    

Button Block

Link Settings

At the top of the Button Content Block, the first setting you encounter is the Link option. This setting determines the action that occurs when a recipient clicks the button. Similar to other areas where you can define a link, you have the ability to choose the link type that best suits your needs.

You can select from several link types, including:

• Normal Site Link (HTTP or HTTPS): Directs the user to a specific webpage.
• Mail Link: Opens the user's email client to compose a new email.
• File Link (FTP, FTPS): Links to a file on an FTP server.
• Skype: Initiates a Skype call or chat.
• Telephone (tel): Initiates a phone call when clicked on a device capable of making calls.
• SMS: Opens the messaging app with a pre-filled recipient number.
• Viber: Opens the Viber app for messaging or calls.
• Another Protocol Type: Allows you to specify a different protocol not listed.

Alternatively, you can set the button to facilitate sharing on social media platforms or via email. The options include:

• Facebook
• X (formerly Twitter)
• LinkedIn
• Pinterest
• Email Sharing

Next to the link type selection, there is a URL field that typically starts with "https://". Here, you enter the specific URL or address corresponding to the link type you've chosen.

Button Label

Below the link settings, you'll find the Button Label field. The default text displayed on the button is "Button." You can change this label to any text that aligns with your call to action, such as "Learn More," "Subscribe Now," or "Shop Now."

Text Style

The Text Style settings allow you to customize the appearance of the text on your button. The first option is the Font Selection. You can choose from a variety of fonts to match your brand's typography.

Standard fonts available are:

• Arial
• Comic Sans MS
• Courier New
• Georgia
• Helvetica
• Lucida Sans Unicode
• Tahoma
• Times New Roman
• Trebuchet MS
• Verdana

For non-standard fonts, you can select from:

• Arvo
• Lato
• Lora
• Merriweather
• Merriweather Sans
• Noticia Text
• Open Sans
• Playfair Display
• Roboto
• Source Sans Pro

At the top of the font list, there is a search box that allows you to quickly find a specific font by typing its name.

Next to the font selection, there is a Font Size dropdown menu. You can select a font size ranging from 8 to 72, depending on how prominent you want the button text to appear.

Additionally, there are options to format the text as Bold or Italic by clicking the "B" or "I" icons, respectively. These formatting options help emphasize the button text and make it stand out.

Color Settings

Below the text style options, you can customize the colors associated with the button.

The Button Color setting allows you to change the background color of the button. By default, the button is green with the hex code #31cb4b. You can modify this by typing in a different hex code or by using the color picker tool to select a color visually.

The Text Color setting lets you define the color of the text on the button. The default text color is white (#ffffff), but you can change it to any color that provides good contrast with the button background for readability.

Next, you have the Background Color setting, which is transparent by default. This setting affects the background of the button's container. You can change it by entering a hex code or selecting a color using the color picker, allowing the button to stand out against the email's background.

Border Radius

The Border Radius setting controls the roundness of the button's corners. The default value is 30, providing moderately rounded corners. You can adjust the border radius between 0 (resulting in sharp, square corners) and 100 (producing fully rounded, pill-shaped buttons) to achieve the desired aesthetic.

If you want the border radius effect to display correctly in Microsoft Outlook, you need to activate the "Support of Outlook" option in the Appearance tab. This ensures that the rounded corners are rendered properly in Outlook email clients, which can sometimes have rendering issues with certain CSS properties.

Alignment

The Alignment setting allows you to position the button within its content area. You can align the button to the Left, Center, or Right, depending on the layout of your email and your design preferences. Center alignment is common for emphasis, while left or right alignment can be used to match other design elements.

Fixed Height

There is a Fixed Height option available, which is deactivated by default. Activating this option allows you to set a specific height for the button, starting from a minimum of 44 pixels. This is useful when you want all your buttons to have the same height for a consistent look, regardless of the length of the button text.

When the fixed height option is enabled, you can also adjust the Vertical Alignment of the content within the button. You can align the content to the Top, Middle, or Bottom of the button, ensuring the text and any icons are positioned exactly where you want them within the button's height.

Button with Icon

Another feature you can enable is the Button with Icon option, which is deactivated by default. When activated, this allows you to include an icon alongside the button text, enhancing the visual appeal and reinforcing the call to action.

You can upload an icon in PNG, JPG, or GIF format, with a maximum file size of 2 MB. After uploading the icon, you can choose whether it appears on the Left or Right side of the button text, depending on your design preference.

Please note that icons within buttons are not displayed in certain versions of Microsoft Outlook on Windows, specifically:

• Outlook 2002
• Outlook 2007
• Outlook 2010
• Outlook 2013
• Outlook 2016
• Outlook 2019

This limitation is due to how these versions of Outlook render HTML emails. It's important to consider this if a significant portion of your audience uses these email clients.

Border Settings

The Border settings enable you to define borders around your button. You can set the border width for each side—left, right, top, and bottom—individually, with values up to 40 pixels. This allows for creative border designs, such as having borders of different thicknesses on each side.

You can also select the Border Style, choosing between Solid, Dashed, or Dotted lines to match your design aesthetic.

To customize the border color, you can enter a hex code directly or use the color picker to select a color visually. This allows you to match the border color with your brand colors or the overall color scheme of your email.

Internal Padding

The Internal Padding setting allows you to adjust the space inside the button, between the content (text and icon) and the button's border. You can define padding values for the left, right, top, and bottom sides, with maximum values up to 99 pixels. Adjusting internal padding can affect the button's overall size and how the content is positioned within it, providing control over the button's appearance.

External Padding

Similarly, the External Padding setting controls the space outside the button, effectively adjusting its margins relative to other elements in your email. You can set external padding values for each side—left, right, top, and bottom—up to a maximum of 40 pixels. This helps in positioning the button appropriately within your email layout, ensuring it doesn't appear too close to other content or the edges of the email.

Add Anchor Link

Finally, there's an Add Anchor Link option available. Anchor links are used to direct readers to specific sections within the same email, which is particularly useful in longer emails or newsletters where you want to provide quick navigation to different content sections.

When you enable this option, you can define an Anchor Name, which serves as the target within the email. You then link the button to this anchor, so when clicked, the email will scroll to the specified section, improving the reader's navigation experience.

It's important to note that anchor links are not supported in certain email clients, including:

• iOS Gmail App
• iOS Apple Mail
• Outlook App for Android
• Outlook App for macOS
• AMP Emails

Due to these limitations, consider whether using anchor links is appropriate for your audience, and test your email to ensure it functions as intended across different email clients.

Spacer Block

The Spacer Block allows you to add adjustable space within your email content. This block provides several customizable settings, giving you precise control over its size, alignment, appearance, and internal spacing. Below, you'll find an explanation of the key features and differences between the Normal Spacer and Dynamic Spacer.

---

1. Normal Spacer

The Normal Spacer is a line element that can act as a visual separator between sections in your email.

Its key settings include:

• Line Thickness and Style
  Use the Line setting to define the thickness and style of the line. Options include:

  • Thickness: Adjustable using the + and - buttons, starting from 1.
  • Style: Choose from solid, dashed, or dotted.
  • Color: Customize the line color using a hex code or the color picker. By default, it is set to #cccccc.

• Width
  The Width setting allows you to adjust how far the line spans across your email content. Use the + and - buttons to define the width in pixels.

• Alignment
  You can align the line to the left, center, or right using the alignment options provided.

• Padding
  The Padding setting allows you to adjust the internal spacing around the spacer:

  • By default, the padding is set to 20 on all sides.
  • Use the More toggle to define specific padding values for:
    • Top
    • Right
    • Bottom
    • Left

This spacer is ideal for creating clean, visual separations between content sections.

---

2. Dynamic Spacer

The Dynamic Spacer is a block of empty space designed to create breathing room within your layout.

Unlike the Normal Spacer, it does not include a visible line and has the following properties:

• Height Adjustment
  Adjust the height directly in the content area or via the control panel using the + and - buttons. The height defines how much vertical space is added between sections.

• Background Color
  By default, the background color is set to transparent. You can add a custom background color using a hex code or the color picker, effectively turning the spacer into a visible block if needed.

• Responsive Behavior
  The Responsive Spacer option ensures that the dynamic spacer adjusts to screen sizes dynamically, providing an optimal layout across devices. This is enabled by default.

  

Key Differences
The Dynamic Spacer is purely empty space and does not include line-specific settings like width, alignment, or line styles, nor does it have a padding option. It is designed to create separation without the visual element of a line.

---

3. Add Anchor Link

You can add an Anchor Link to both spacer types. This allows users to navigate to the spacer’s location via a link elsewhere in the email. However, note that anchor links are not supported by certain email clients, such as:

• Microsoft Outlook
• Gmail (on mobile)

---

Video Block

The Video Block allows you to embed videos into your email and customize their appearance and behavior. It supports video links from platforms such as YouTube and Vimeo. Below is a detailed guide to the available options for this block.

---

1. Link to Video

The Link to Video field is where you input the URL of the video you wish to embed. Supported platforms include YouTube, Vimeo, and other services that provide embeddable links.

• Automatic Behavior: When you add a valid video URL (e.g., from YouTube or Vimeo), the block will:
  • Automatically generate a preview image in the content area, using the thumbnail provided by the video platform.
  • Automatically populate the Alternate Text field with the video title or description from the platform (if available).
• You can edit or replace these values if needed.

---

2. Alternate Text

The Alternate Text field provides a description of the video. This text is displayed if the video fails to load, ensuring accessibility.

• If a YouTube or Vimeo URL is added, this field is automatically populated with the video title or description.

---

3. Custom Thumbnail

The Custom Thumbnail toggle lets you upload a custom image as the video preview.

• How to Upload: Activate the toggle and upload a PNG, JPG, or GIF file from your local device.
• When to Use: If the automatically generated preview image does not fit your design, you can replace it with a custom thumbnail.

---

4. Play Button

You can customize the appearance of the Play Button that overlays the video thumbnail.

• Options: Choose between YouTube, Vimeo, or several other play button styles.
• No Play Button: Select “None” if you do not want a play button to appear.

---

5. Size

The Size setting allows you to adjust the dimensions of the video.

• Toggle between Width and Height adjustments.
• Use the + and - buttons to fine-tune the size.
  

---

6. Adjust to Width

The Adjust to Width toggle enables the video to automatically fit the width of the container. This ensures responsive behavior across devices.

---

7. Responsive Image

The Responsive Image toggle ensures that the video thumbnail adjusts to the width of the screen on mobile devices.

• Warning: Adaptivity depends on device and email client support.

---

8. Alignment

The Alignment setting determines the horizontal position of the video in the block. Options include:

• Left: Aligns the video to the left.
• Center: Centers the video.
• Right: Aligns the video to the right.
  

---

9. Mobile-Specific Options

• Hide Element on Mobile: Allows you to hide the video on mobile devices.
  • Warning: This setting relies on media query support and may not work in all email clients.
• Mobile Padding: Adjust the padding for mobile displays.
  • Use the “More” toggle to customize padding for Top, Right, Bottom, and Left individually.

---

10. Include in AMPHTML or HTML

This option lets you choose whether the video block should appear in:

• Both AMPHTML and HTML versions of the email.
• AMPHTML-only or HTML-only versions.
  

HTML Block

The HTML Block allows you to insert custom HTML and CSS code into your email design. Whether you're adding a single HTML section or coding an entire email, this block provides flexibility while maintaining compatibility with email client constraints. Below is a comprehensive guide to using this block effectively.

---

1. Code Editor Interface

When you select the HTML Block, a black code editor window appears in the content pane. Here, you can write, paste, or edit your custom HTML and CSS. The editor has two primary sections:

• HTML Section: Write the structure of your email in HTML.
• CSS Section: Open a separate CSS editor to define the styling of your content.

---

2. Font Size Adjustment

At the top-left corner of the editor, you'll find the A+ and A- buttons. These allow you to increase or decrease the font size of your code, making it easier to read and edit.

3. Editor Window Size Adjustment

The size of the code editor window can be adjusted using the slider control located at the center-top of the editor.

• How to Use: Hover your mouse over the three dots in the top-center of the black editor window to reveal the slider.
• Drag the slider up or down to resize the editor window, giving you more or less space to work with your HTML code.
  This feature is especially useful for working on larger or smaller blocks of code.

---

4. CSS Editor

The CSS Editor is accessible via a button in the top-right corner of the code editor. This lets you manage the styles for your HTML content. However, keep in mind:

• Email clients often do not support advanced CSS features like Flexbox, Grid, or media queries.
• Stick to basic inline CSS for better compatibility across email platforms.
• Do not delete pre-configured styles, as they ensure proper rendering across major clients.

5. Email Client Compatibility

Email HTML differs significantly from modern web development due to the outdated rendering engines of many email clients. Important considerations:

• Use table-based layouts instead of modern elements like <div>, as these are better supported.
• Avoid advanced CSS features (e.g., animations, Flexbox, Grid) that may not render properly.
• Media queries and minor CSS properties may behave inconsistently across platforms.
• Testing: Always test your email on multiple clients, such as Gmail, Outlook, and Apple Mail, to ensure proper rendering.

---

6. Padding

The Padding setting allows you to adjust the space around your HTML content.

• Default Padding: Set to 0 by default.
• Custom Padding: Enable the More toggle to define individual padding values for Top, Right, Bottom, and Left.
  This feature is useful for aligning your HTML content within the email layout.

7. Add Anchor Link

The Add Anchor Link option allows you to create a clickable link elsewhere in your email that navigates to the HTML Block.

• How to Use: Toggle the option and enter an anchor name in the field.
• Email Client Limitations: Not all clients support anchor links. Common unsupported clients include:
  • iOS Gmail app
  • iOS Apple Mail
  • Outlook app (Android and macOS)
  • AMP Emails

8. Writing Custom HTML

The HTML Editor provides a straightforward space to write your HTML code.

• Paste or write your email's HTML structure directly into the editor.
• Follow email HTML best practices, using simple, widely-supported HTML.
• Avoid using <div>-based layouts or overly complex markup.

---

9. Tips for Success

• Start Small: Use the HTML Block for specific sections if you're new to email development.
• Validate Code: Ensure all code complies with email client requirements.
• Test Thoroughly: Use tools to preview and test your email across various clients and devices.