Website Screenshot Thumbnails using a Linux Server
There’s always more than one way to get something done with a Linux server and sometimes it depends on which distribution you’re using. Here’s one way to create website screenshot thumbnails on Debian-based distributions with XVFB, webkit2png and ImageMagick.
Unlike website screenshot thumbnail services such as “ShrinkTheWeb”, there are no restrictions on how often you can generate or update the images and you don’t have to pay anything extra when you start doing hundreds or thousands of website screenshot thumbnails from your own server.
The Software you need to Create Website Screenshot Thumbnails
Use APT to install the programs and libraries:
apt install imagemagick libicu48 python-qt4 libqt4-webkit xvfb
Download the webkit2png zip file, extract it to a working directory and install the python script:
wget https://codeload.github.com/adamn/python-webkit2png/zip/master unzip python-webkit2png-master.zip python python-webkit2png-master/setup.py install
Sometimes XVFB will fail to start because it’s already running. To fix that, run killall Xvfb. Make sure it’s a capital X or it won’t be found. I do it at the beginning of my scripts, just to be sure. Here’s a shell script you can work with:
#!/bin/sh # kill any lingering XVFB processes killall Xvfb # capture website screenshot (I'm using my site as an example) # width, height, depth xvfb-run --server-args="-screen 0 1024x768x24" python /usr/local/bin/webkit2png -o rtcx.png https://www.rtcx.net/ # the python script ignores the height and captures the complete page, so crop anything below the fold mogrify -crop "1024x768+0+0" rtcx.png # convert from png to jpg to get a smaller file size mogrify -format jpg rtcx.png rm rtcx.png # shrink and sharpen to make the thumbnail # by specifying the width (150) but not the height, the aspect ratio is kept # check your results with an image editor to see the effects of the quality and sharpening mogrify -resize 150 -quality 80 -sharpen 14 rtcx.jpg
There’s a lot you can do with ImageMagick’s mogrify command. I urge you to play with it.
I created the image above using the shell script above. 150 pixels is the standard width for WordPress images. You can shrink your images to whatever size you need. 120 pixels seems to be what some directory sites use.
I’m not a programmer by profession, so getting something like this to work can be a daunting task. If I can do it, you can do it. If you want to do this in bulk, I recommend using the shell commands from within a PHP script. Variable substitution and looping seems to be easier with PHP (at least for me).
Note: If you get a responsive-type image, like I did, start out with a larger screen size.