Mailosaur logo
Mailosaur logo
Dashboard

Home

How to test the appearance of emails with Mailosaur

Learn how to examine the quality of your emails with with Mailosaur.

Last updated:

What are email previews?
A hashtag icon

Whether you are sending emails as part of a marketing campaign or in order to welcome new customers to your product, it is very difficult to know exactly what your email will look like to everyone who will receive it.

Email previews are screenshots of your email taken on a wide array of email clients, using physical devices including PC, Mac and mobile.

Test a design using standalone HTML
A hashtag icon

When creating or modifying the HTML content of an email, you can quickly test the appearance in various email clients by creating a "design" in Mailosaur.

Follow these steps to create design:

  1. Navigate to the Designer via the main menu
  2. Click New Design to create a new design for your email.
  3. Name your design and click Create.
  4. Once in the design editor, paste the HTML you wish to test on the left-hand side of the screen.
  5. Select the Screenshots tab on the right and click Generate Screenshots.
  6. Select the email clients you wish to test and click Generate Screenshots again.
  7. Your screenshots will be ready to view in moments

Using a test email address to check an email designed elsewhere
A hashtag icon

When the email you want to check already exists in another system, such as your own product or your email marketing solution, it is often easier to send a copy of the email to Mailosaur using a test email address.

To do this, follow these steps:

  1. Select Servers from the main menu, and select one of your existing inboxes.
  2. In the top-right of the inbox you should see an option to copy an email address to your clipboard.
  3. Use this email address to send the email from whichever system has it (note: many email marketing solutions have an option to "send a test email").
  4. Once the email arrives in your inbox, click on it to open the email viewer.
  5. Select "Generate Emails Previews" from the email viewer.
  6. Select the email clients you want to preview your email in and click Generate.
  7. Your screenshots will be ready to view in moments

Creating an end-to-end test using the API
A hashtag icon

You can generate email previews within the Mailosaur Dashboard as described above, but you can also create end-to-end email tests using the API:

// Fetch the email to generate previews for
const email = await mailosaur.messages.get('SERVER_ID', {
    sentTo: 'TEST_EMAIL_ADDRESS'
});

// Generate a preview for Outlook 2021
const request = new PreviewRequest('OL2021');
const options = new PreviewRequestOptions([request]);
const result = await mailosaur.messages.generatePreviews(email.id, options);

// Download the generated screenshot
const file = await mailosaur.files.getPreview(result.items[0].id);
fs.writeFileSync('screenshot.png', file);