Responsive HTML code is not created equal. Coding HTML for a responsive web page is very different than coding for a responsive email template. Whether your internal team created a responsive template or you hired an outside agency to do this for you, the template you load into your HighRoad Campaign eMail tool to use may not render how you would like it to. As more of our valued clients begin to make their templates responsive and use these templates, we are addressing issues as they come into our support channel to help resolve any rendering issues they may be experiencing. When the HighRoad design team creates the responsive templates, we do so in a way we know from experience works with the greatest number of email clients and test before we load the templates into your account. Once tested responsive templates are in use in your Campaign eMail account, here is the ideal workflow to ensure the responsive back-end code does not inadvertently get deleted:
If HighRoad wasn't involved in the creation of your templates, here are some common issues/solutions for responsive templates from our resident responsive guru Lydia Roberts:
When building a template in an outside HTML editor like Dreamweaver, the <meta> tags are normally added at the top of your HTML document. You will need to move any <meta> tags to after the closing </style> tag and before the closing </head> tag in order to maintain your CSS styles in the HighRoad editor.
Columns can be stacked in a few different ways, but one of those most reliable methods is to use separate tables for each column. This creates the appearance of two columns appearing side by side for desktop and allows us to stack the columns on top of one another for mobile. Example: