2 Ways To Take Screenshots Of Websites In PHP

So I was working on my other blog and curating a list of websites. I thought it will be a good idea to include screenshots, but it turned out to be a repetitive nightmare of take screenshot, resize, and “save image as”. My dark developer side then screamed “just write a script to automate this sh*t”.

But “by default”, PHP does not have an HTML to image engine. To take screenshots in PHP, we can use PHP to call Chrome in the command line in headless mode… Or use a screenshot API altogether. Thus, here it is. A few quick snippets that will hopefully save you time if you are planning to do the same “automated screenshots”.

CODE DOWNLOAD

ZIP File

I have released this under the MIT license, feel free to use it in your own project – Personal or commercial. Some form of credits will be nice though. 🙂

VIDEO TUTORIAL

METHOD 1) CHROME HEADLESS MODE

1A) INSTALL GOOGLE CHROME

For this method to work, you need to install Google Chrome.

This script uses Google Chrome headless mode.
That is, run Chrome in the command line without showing the Chrome window. Access a website, take a snapshot, and close.
Not tested, but other Chromium-based browsers that support headless mode should work too – Edge, Opera, and Brave.

1B) SETTINGS

1-headless.php

// (PART A) SETTINGS
$chrome = "C:\Program Files\Google\Chrome\Application\chrome.exe"; // path to chrome
$saveas = __DIR__ . DIRECTORY_SEPARATOR . "demo.png"; // screenshot file
$size = "1920,1080"; // window width and height
$url = "https://en.wikipedia.org/"; // url to screenshot

$chrome Path to Google Chrome, change to your own.

$saveas Save the screenshot as this file. Chrome is capable of saving to JPG, PNG, and WEBP.
$size Window size. Technically, this is a virtual window. You can set this all the way to 8K if you want…
$url The website/page that you want to take a screenshot of.

1C) TAKE SCREENSHOT WITH HEADLESS MODE

1-headless.php

// (PART B) SCREENSHOT WITH HEADLESS CHROME
exec(<<<HEADLESS
"$chrome" --headless --screenshot="$saveas" --window-size=$size "$url"
HEADLESS);

TLDR –

"$chrome" Run Chrome in the command line.
--headless In headless mode.
--screenshot Save a screenshot to this file.

--window-size This is the window size.
"$url" Open this URL.

P.S. There are many other parameters, but a noteworthy one is --disable-gpu if you run into trouble with headless mode not taking screenshots.

METHOD 2) USING A SCREENSHOT API

2A) REGISTER WITH API FLASH

If you cannot install anything on the server, the next best option is to use an API.

There are many free “screenshot API” services, one that I found is APIFlash. Not sponsored.
Just register with them and get your ID/key.

2B) API SETTINGS

2-api.php

// (PART A) SETTINGS
$settings = http_build_query([
  "access_key" => "SET YOUR OWN",
  "url" => "https://en.wikipedia.org/wiki/Coffee",
  "format" => "webp", // png, jpeg, webp
  "width" => 600, "height" => 400
]);

The usual stuff – Insert your API key. Set the URL you want to screenshot, the file format, and dimensions.

P.S. The API offers more options, check out their official documentation.

2C) CALL API & SAVE IMAGE