It can be devastating for any marketing campaign to overlook a single error, considering the amount of time and effort put into crafting the best marketing emails.
To maximize the effectiveness of your emails, it's crucial to ensure that your designs work well on different clients and devices. By using the preview tool, you can determine the optimal format and layout for your email template.
How to create a preview pop-up window?
In order to obtain a compressed HTML code for preview, you should call the compileEmail function.
Then you should create a button on the top panel and link it with your own logic to display a preview window. You can connect one of the open libraries that can generate the needed screenshots.
A comprehensive example on GitHub demonstrates how to integrate the preview window into your application effortlessly.
Consequently, we'll end up with a window that looks like this:
Remember that the way the window looks and works is up to you according to the logic and design you choose to implement.
Our example doesn't separate the HTML and AMPHTML, and only the common AMPHTML version is visible. If you wish to separate HTML and AMPHTML in the preview, you will need to establish your own logic.
To get the AMPHTML, you also need to use the compileEmail function. In case your email template contains AMP elements or components, the ampHtml parameter will contain the HTML code of the AMP HTML Mime type.
Moreover, in case AMP HTML is invalid, the ampErrors parameter will contain the error descriptions (array of strings).
To learn how to call the showAmpErrorsModal function, kindly refer to this link for detailed instructions.
Thank you for taking the time to read our articles. We hope you will find this information helpful.
If you have any additional questions, please email us at support@stripo.email.
We would be glad to talk with you.