Take full page website screenshots using API

Learn how to programmatically take full page website screenshots using this API. Just pass the website URL, customize width, height and other params and make a request


By Rishi Mohan
Feb 23, 2024

Tags

How to

Share

There are many use cases for API for capturing website screenshots. Whether using it with your favourite apps using Zapier, or to generate link previews or generate website previews on directory websites

With a screenshot API, the benefit is you can automate it once and forget about it. The API will do its work and you don't have to worry about it(unless you've missed your website screenshot subscription's payment :P)

In case you're looking for something that doesn't involve API you complicating yourself with code and stuff, here's a free website screenshot generator

So let's get started, but before that let's make sure of pre-requisites:

  • We'll be using Pika's Website Screenshot API for this. It is fast website screenshot API, which can also capture full page screenshots
  • You can get your API key here if you don't already have one(it includes free trial so you can test it out without paying)
  • We'll need this API key to make requests to generate screenshots

Generating website screenshots

Now that you have your API key ready, here's a simple Node.js code to make request to Pika API

Code explanation:

  • `https://api.pika.style/v1/templates/website-screenshot/images` is the endpoint we're making request to
  • Make sure to replace YOUR_PIKA_API_KEY with your Pika API key
  • `response_format` is the output format you want, "base64" return the base64 of the image, if you want it to be a URL then you can use "url"
  • `modifications` are basically options to configure your request. `websiteUrl` is the website you want to capture screenshot of, `fullCapture` if set to `true` takes full page screenshot of `websiteUrl`. Alternatively you can set `width` and `height` if you want screenshot of specific size

You can also play with this website screenshot API and build your request visually and see the response before integrating in your backend

Here's the output of the response from the API:

Slack homepage screenshot using Pika API

If you have a Ruby/PHP/Python/Node.js backend, you can use Pika API SDKs to simplify the integration

In case the website has cookie banners or popups, they'll automatically be removed and you'll get clean screenshot. The API also blocks all ads if the website has any

Using with Zapier

If you prefer a nocode solution, you can also use Pika's Zapier integration to generate website screenshots using other apps like Google Sheets, Airtable etc. as sources

Have any questions? DM us on Twitter @AppPika or send us an email at hi@pika.style

Recent from Blog

Beautiful screenshots made easy!

Save hours of creative thinking and efforts with Pika

Mockups and Images created using Pika