Q&A: Capturing Full Email Screenshots

Awile back, someone asked me how I take screenshots of emails for my monthly email design inspiration series if the email doesn’t have a view online link. The problem is, taking a normal screenshot doesn’t work if you have to scroll to view the entire email, and using a tool that allows scrolling capture usually breaks when taking a screenshot in Gmail. After trying many different methods and tools, this is my current process for taking full email screenshots.

Add the Litmus Scope Bookmarklet to Chrome

First, you need to install the Litmus Scope Bookmarklet to Chrome. Using Scope will allow you to grab the HTML from any any email in Google Mail.

Open the email in Gmail

Open the email you want to screenshot within Gmail and click on the Scope bookmarklet.

email-screenshots-open-email

email-screenshots-scope-email

The Scope app will open and your email will be displayed.

email-screenshots-scoped-email

Copy & Paste the HTML Code

Toggle to the HTML view in Scope and copy all the code.

email-screenshots-scoped-email-code

Open up notepad, or any other HTML editor and paste the code. Save it as ’email.html’, then open that file in your browser.

Take the Screenshot

Now that you have extracted the email you can take the screenshot. There are a couple tools that allow you to take scrolling screenshots. I use Snagit for my screenshots, but here are some free extensions for Chrome.
Full Page Screen Capture
Awesome Screenshot

email-screenshots-capture

The Result

full-email-screenshot

Questions?

Email me, send me a tweet @jennamolby, or leave a comment