Editing Email Designer: Blocks explained

'''Navigation:''' [[Main_Page]] > [[Campaigns]] > [[Email Designer]] > Email Designer: Blocks explained

== Email Designer: Blocks Explained ==

The ActiveCampaign Email Designer, launched in 2022, revolutionizes how users create engaging email campaigns. By employing a drag-and-drop interface, this feature simplifies the process of designing emails, making it accessible to users of all skill levels. Among the key elements of the Email Designer are the '''Blocks'''—the foundational components that you can incorporate into your campaign layouts. Understanding how to effectively use these '''Blocks''' will enhance your campaign's appeal and effectiveness, ultimately impacting user engagement and conversions.

This article will discuss the Email Designer: Blocks, specifically the newly introduced Banner, Timer, and Menu options. 

== How to Access This Feature ==
Accessing the Email Designer is simple. You can find it under the standard campaign workflow in both the '''Campaigns''' and '''Automations''' sections of your ActiveCampaign account. Here’s how to get started:

1. Navigate to the '''Campaigns''' section.
2. Click on '''Create a Campaign'''.
3. Choose either '''Standard''' or '''Automated''' as your campaign type.
4. From here, you'll be taken to the Email Designer where you can start building your email.

You can also access the Email Designer by creating an Automation and adding an email.

== Step-by-Step Instructions ==
This section will outline how to use each block within the Email Designer effectively, explaining the associated configurations and settings.

=== Banner Block ===
Adding an attractive header or footer to your campaigns can significantly elevate their visual appeal. Follow these steps to add a Banner block:

1. Click on '''Blocks''' under the Content menu located in the sidebar.
2. Drag the '''Banner''' block from the sidebar to the preferred location in your campaign.
3. Click the newly placed block to open the '''Content Manager'''. Should you not have an image uploaded, you can select '''Add File''' in the modal that appears to upload your image.
4. Choose the image that you wish to use.
5. With the banner selected, you can adjust settings including '''Orientation''', '''Banner Height''', and '''Filter''' in the settings sidebar. 
6. Optionally, you can link the banner to a page, insert alt text, and set the banner image as an anchor link that redirects to another section of your email. Additionally, elements can be hidden on desktop or mobile devices.

The recommended banner dimensions are 600px by 300px and 600px by 400px. You can modify images and fonts in any order as per your design requirements.

=== Timer Block ===
Utilizing a Timer block is valuable when counting down to significant events, such as flash sales. Here’s how to add a Timer to your campaign:

1. Click on '''Timer''' under the Content menu in the sidebar.
2. Drag the '''Timer''' block to your desired location in the campaign.
3. Click the Timer container to trigger the sidebar settings menu.
4. Set the end date and time for your countdown timer, selecting the appropriate time zone. Note that the timer settings will only reflect the specified time zone, not the contact’s local time.
5. Optionally, you can toggle on the '''Expired Timer Image''' to display an image from the Content Manager when the timer reaches zero.

=== Menu Block ===
Creating a responsive Menu block can help guide recipients to various sections or product pages. To add a Menu block, follow these steps:

1. Click on '''Menu''' under the Content menu in the sidebar.
2. Drag and drop the '''Menu''' block to the desired position within your email.
3. By selecting '''Add Menu Items''', customize the number of menu options. The default is three, but you can add as many as desired (note, however, that after 11 items, the line will wrap).
4. Choose whether to use icons, links, or both for the menu items. Customize the menu names, URLs, fonts, images, background colors, and more.
5. You can hide specific elements on mobile devices by selecting the '''Hide on mobile''' icon.
6. Additionally, menu icons can serve as anchor links, allowing for seamless navigation within the email.

== Configuration Options and Settings ==
Each block in the Email Designer comes with specific settings and options:

* For the '''Banner''' block, key settings include adjusting '''Orientation''', '''Banner Height''', and filters, as well as the ability to link to various content pages and add alt texts.
* For the '''Timer''' block, the main configurations include setting the final countdown date, selecting a time zone, and customizing the appearance of the timer with elements like background color and size.
* For the '''Menu''' block, users can fine-tune their menu by selecting icons or links, defining the names and URLs for each item, and modifying appearance settings such as font and background color.

By understanding these core configuration options, users can create tailored and targeted email campaigns.

== Best Practices and Tips ==
1. **Visual Consistency**: Ensure your banners and menus have a consistent design layout that aligns with your branding. 
2. **Mobile Responsiveness**: Test your emails on both desktop and mobile devices to confirm all elements display correctly, particularly hidden components.
3. **Enticing Calls-to-Action**: Utilize well-placed buttons and timers where applicable to instill urgency among your recipients.
4. **Use of Alt Text**: Always include '''alt text''' for images to improve accessibility and ensure clarity even if images do not load.
5. **Engagement Tracking**: Implement tracking features where relevant to analyze how recipients interact with the various components of your email, which can provide insights for future campaigns.

== Troubleshooting ==
If you encounter any issues while using the Email Designer Blocks:

* **Images Not Uploading**: Ensure that you are selecting compatible file formats (like JPG or PNG) when uploading images in the Content Manager.
* **Timer Not Displaying Correctly**: Check the time zone settings to confirm they align with your expectations for the countdown.
* **Menu Items Not Updating**: Refresh the Email Designer page if changes do not appear; sometimes, caching issues may prevent updates from displaying immediately.

== FAQ ==
=== 1. What types of '''Blocks''' are available in the ActiveCampaign Email Designer? ===
The Email Designer includes the following blocks: Image, Text, Button, Spacer, Video, Social, HTML, Banner, Timer, and Menu.

=== 2. How do I add a Banner block to my email? ===
You can add a Banner by dragging it from the sidebar under the '''Blocks''' option and dropping it into your desired location in the email.

=== 3. Can I customize the Timer block? ===
Yes, you can customize the Timer block by setting the end date and time, selecting the background color, timer size, and optional images for when the countdown expires.

=== 4. How many menu items can I add to a Menu block? ===
There is no limit to the number of menu items you can add, though the default is three; after 11 items, the layout will wrap to a new line.

=== 5. What sizes are recommended for banner images? ===
The most popular banner sizes are 600px by 300px and 600px by 400px.

=== 6. Can I hide elements on mobile devices? ===
Yes, elements can be hidden on mobile by selecting the '''Hide on mobile''' option in the settings.

=== 7. Are there any resources to learn more about the Email Designer? ===
Yes, you can find more details in the [[Email Designer overview]] and reference the [[FAQs for the Email Designer]] for any common questions regarding its features.

== Additional Resources ==
* [Email Designer overview](https://help.activecampaign.com/hc/en-us/articles/4404950771612)
* [FAQs for the Email Designer](https://help.activecampaign.com/hc/en-us/articles/4408732634002-FAQs-for-the-Email-Designer) 

This comprehensive guide delineates how to leverage blocks within the ActiveCampaign Email Designer to develop engaging, visually appealing emails that resonate with your audience.