Use HTML with the Email Designer

With ActiveCampaign’s Email Designer, you can easily switch between code and the drag-and-drop designer. Doing so gives you the full flexibility to create a campaign that best suits your business objectives and allows for easy troubleshooting.

Take note

• You must be comfortable with HTML and CSS to use this option
• Our CX Team cannot help you create or troubleshoot any code you create in the Email Designer

Access the code option

1. From the Email Designer of your direct or automated campaign, click the “Code” button.
   
   
   
   
2. The code panel will load on the bottom of the Designer. Here you can view the code for your email.
   
   

     Note that the code area will show the area you have selected. If you do not have an area selected, it will be the HTML/CSS of the entire email.

3. To adjust the code, click the area you want to update and add or edit the code.
4. To exit the code view, click the code button again.

Create a new template with the Email Designer and custom code

You can create a template in the Email Designer that uses custom code.

1. From the Campaigns page, click “Campaign Templates.”
2. Click the “Create a Template” button.
3. Choose the “Email Designer” option, then click “Continue.”
4. On the next page, click the “Start from Scratch” option.
5. The Email Designer will load. Click the “Code” button.
   
   
   
   
6. The code panel will open at the bottom of the page and display HTML and CSS.
   
   • To add custom HTML, add it to the HTML box
   • To add custom CSS, click “CSS” to expand the box, then add your CSS.
     
     
     
     
7. When finished, click the “Code” button to view your work. You can also use the drag-and-drop options to complete your email (if needed).

Troubleshoot your design

If any text or buttons aren’t rendering correctly, you can view the email code and adjust it by clicking the “Code” button. Having easy access to the code helps you troubleshoot issues and customize the email’s style.