Marketing

Tutorial: Google Sheets Function to Take Screenshots of Any Website

Post by
Andrew Pierno
Tutorial: Google Sheets Function to Take Screenshots of Any Website

If Google Sheets is your central HQ and you need to take website screenshots, don’t stress! In this tutorial, we’ll show you how to use Google Sheets to take screenshots of any website.

We’ll use Apps Script to create a custom Google Sheets function, ‘screenshot,’ which will accept a website URL as a parameter and return the screenshot URL.

google sheets function to take screenshots

This little function has proven to be of great value to content sites that have sections of repeatable content (i.e., it leverages the benefits of programmatic SEO) or use cases where the goal is to automate website monitoring and reporting of any sort (e.g., monitor competitor pricing or ads, monitor website compliance, etc.).

What Will You Need?

  1. Google Sheets
  2. A screenshotapi.net API Key

Step 1: Create a New App Script Project

To create a new App Script Project, open the desired Google Sheet and go to Extensions > App Script.

The App Script project will automatically open in a new window.

google sheets function to take screenshots

Step 2: Get a Screenshot API Key

Go to https://screenshotapi.net, sign up for a free trial, and copy your API Key.

get a screenshotapi api key

Step 3: Create a Custom Function to Take Screenshots

Now, let's get started with creating our custom function! 

Our function needs to accept the website URL as a parameter, generate the screenshot of the website using the Screenshot API, and finally return the image returned by the Screenshot API as a response. 

(This website URL can be referenced from a different column, and the results can be put into a different one.)

Here’s our implementation of an App Script function ‘screenshot’ that does the job:

/**
* Takes a website URL as input and returns a screenshot of the website using the ScreenshotAPI service.
* @param {string} websiteUrl - The URL of the website to take a screenshot of.
* @return {string} screenshotUrl - The URL of the screenshot image.
* @customfunction
*/
async function SCREENSHOT(websiteUrl) {
 const YOUR_API_KEY = "XXXXXXX-XXXXXXX-XXXXXXX-XXXXXXX"; // Your ScreenshotAPI API key
 const query = `https://shot.screenshotapi.net/screenshot?token=${YOUR_API_KEY}&url=${websiteUrl}&output=image&file_type=png&wait_for_event=load`; // The URL for the screenshot API request
 const options = {
 'method' : 'get',
 'contentType': 'application/json',
 'followRedirects':false
 }; // The options for the fetch request
 const response = await UrlFetchApp.fetch(query,options); // Make the fetch request to ScreenshotAPI
 const screenshotUrl = response.getHeaders()['Location']; // Get the URL of the screenshot from the response headers
 return screenshotUrl; // Return the URL of the screenshot
}

Replace the YOUR_API_KEY variable with the API key you copied in step 2.

Hit Ctrl + S or Cmd + S to save the file.

google sheets function to take screenshots - app script

Step 4: Call the Function from Google Sheets

Call the function by typing in =SCREENSHOT(). Provide the website URL as a parameter by passing in the appropriate cell reference. 

You can also drag this to execute for multiple rows at once.

google sheets function to take screenshots

Quickstart Template: Google Sheets Function to Take Website Screenshots 

If you’d like to get started without having to set up the App Script on your own, duplicate the spreadsheet below: 

https://docs.google.com/spreadsheets/d/1eVvtoQWII3rym7bXe8rmgx61znWL0DjRm-IFFwxFHmo/edit?usp=sharing

Note: This function expects you to pass two parameters - Website URL and API Key. You’ll need to pass the API Key as the second parameter.

google sheets template to automate website screenshots

Frequently Asked Questions

Why Take Screenshots of a Website in Google Sheets?

Some of the use cases we frequently see include: 

  1. Building content for a programmatic SEO website
  2. Tracking website changes over time inside Google Sheets
  3. Monitoring competitor pricing, website, or ads inside Google Sheets

What Is the Google Apps Script?

Google Apps Script is a cloud-based JavaScript platform that lets you integrate and automate tasks across Google products.

For the context of the tutorial, App Script helped us create our own custom functions using JavaScript, which can then be used just like any other built-in function in Google Sheets.

You can learn more about the App Script here.

Ready to Get Started?

Open a new Google Sheets spreadsheet and grab your ScreenshotAPI key here!