Removing the Headache from Marketo Template Development

Any developer that has built Marketo landing page or email templates that use Marketo variables knows that it can be a big pain when it comes to viewing your changes locally in the browser.

The reason being is that popular browsers such as Chrome, Firefox, and Safari don’t know what to do with Marketo variables and render them completely incorrectly. This means we are forced to copy the code, open a Marketo instance, and paste it into the template editor just to see a proper preview!

To simplify the process, our team here at MERGE created a Google Chrome Extension that fixes this dilemma. It's called Marketo Browser Support.

Let’s explore a bit about what it does.

 

What does this extension do?

 

Simply put, when viewing HTML files in the browser that use Marketo variables, this extension recognizes and instantly renders them in the exact same way that the landing page or email template preview option in Marketo does!

Let’s see an example.

Below, we are ‘live previewing’ an email template that is utilizing Marketo variables using the text editor VS Code. As you can see, before using the extension, the browser (in this case Google Chrome) does not know what to do with the Marketo variables in the preview. It misaligns them, hides them, and even turns some green. 

This is not very pleasing to the eye, and on top of that, it’s difficult to know if the design/layout is correct during the coding phase. In order for us to see the proper design/layout, we are required to copy and paste our code and paste it into the Marketo template editor. But, let’s not do that!

Instead, by simply installing the Marketo Browser Support extension, we can instantly see the template rendered exactly how it would look like in Marketo, except in the Browser preview. What a difference! 

After using the extension, it’s much easier on the eyes, and on top of that, we didn’t need to open Marketo to view our changes.

What kind of difference does this extension make?

 

As you can see visually, a lot. To our development process, this helps tremendously. The ability to see your changes instantly in the browser as opposed to following the strenuous preview steps in Marketo has exponentially increased the speed at which our team can develop and make changes to landing page and email templates.

For users who do not code or build their own templates, this extension can help assist in viewing a preview when sent over a raw HTML file. In that case, you could simply open the HTML file from your folder/finder with your Chrome Browser and see a fully rendered preview. No Marketo instance is needed!

What are some important things to know?

 

This extension will not interfere with the Marketo Software and does not make any changes to your local documents. This extension will only provide a ‘preview’ in your Google Chrome Browser when viewing documents locally that are containing Marketo Variables.

If you would like cross-browser support, you can find that information in the ever-evolving FAQs here. The FAQs help answer common questions and also explain how to unlock additional features.

This extension will provide live updates to the preview every time a change is made to the document—meaning it will flow nicely with your favorite text editor’s live preview feature.

Interested in exploring how your organization can take advantage of the Marketo Browser Support extension? MERGE's Marketo experts are here to help. Contact us today!