How to Use Sections in Email Templates (new editor)

read
Last updated at:

Overview

Learn how to use sections in your email template layouts in Klaviyo’s new email template editor. All templates in the new template editor contain at least one section, which can be used to group blocks for easy organization and styling. 

This feature is available in Klaviyo’s new template editor, which is currently available in the Email Templates tab by clicking Create Template > Use New Editor.

About Template Sections

Template sections allow you to group related blocks of content in your email templates. By grouping these blocks within a section, you can also apply styles to all the blocks at once, or move the section around your template easily. 

How to Create and Edit Sections

All templates start with at least one section. To add new sections, drag a Section block into your template. Next, add content blocks (e.g., text, image, or button blocks) to the section and configure them. 

To delete a section, hover over the section area, then click the trash icon. 

delete_section.jpg

Click the star icon to save a section to your saved content and use it for future templates. 

save_section.jpg

About Section Styles

Sections enable you to add styles that span multiple content blocks. To see all styling options available for sections, click into a section and view the Styles tab. Styling options include: 

  • Background images
    Add a background image to a section
  • Content color
    Use auto to apply the content color from your template styles, manual to select a different background color, or none for a transparent background
  • Border
    Set a solid, dashed, or dotted border surrounding your section 
  • Padding
    Add space between your content blocks and the edge of a section area 
  • Alignment
    Choose whether columns should stack on mobile, and whether column content is aligned to the top, center, or bottom of the section 

About Section Display Options 

Section Visibility 

To set a section to display on either desktop or mobile devices only, toggle on Set same visibility for all blocks in this section in the section’s Display options tab. Then select either Desktop or Mobile

section_desktop_only.gif

Show/Hide Logic

Like individual blocks, sections can be set to show to or hide from recipients who have certain characteristics. When configuring your display options, it’s important to make sure that your block and section show/hide rules don’t conflict. For example, if a section is set to show to recipients in Canada, don’t set a block in that section to display only to recipients in Massachusetts. If you do, the block will be hidden for all recipients. 

Learn how to show or hide template blocks and sections based on a recipient’s profile information. 

Content Repeat

Like individual blocks, sections can be set to repeat based on dynamic profile or event data. Learn how to set up a content repeat

Section Use Cases and Best Practices 

Every template in the new editor is comprised of sections, and there are a few use cases where this can be particularly helpful. For example, headers and footers are easy to manage with sections, and you can also use sections to add a background image to a content block. 

Headers

Use a section to build all of your email header content, including your logo, any navigation links, and other content included at the top of your emails. Once you’ve built a header as a section, save the section as saved content to easily add it to other emails. 

Footers

Your email footer likely includes a variety of content, such as an unsubscribe link, your business address, key links, and any disclaimers or legal language you include in your messages. Keep all of this content organized using a section, and save the section as saved content so it’s easy to add to future emails. 

Add Background Images Beneath Text

The section’s Styles tab allows you to set a background image with text, buttons, or other content overlaid on top. Learn how to add a background image to a section

Additional Resources 

x
Was this article helpful?
0 out of 2 found this helpful