19 February 2014

How to Create Screenshots of Websites (html) with PHP Script and Linux Command LIne

Written by Rahul K. | February 19, 2014

Linux Tutorials, PHP html to image, wkhtmltoimage

Wkhtmltoimage is a very useful application to create screenshot of a website or webpage. Some times we required to create an screenshot of webpages and store to our system. It uses QT Webkit rendering engine for creating images in various formats. This article will help to capture screenshots of a webpage using php script and Linux command line.

Step 1: Install wkhtmltoimage in Linux

Download wkhtmltoimage from google code and install on your linux system using following steps.

# cd /opt
# wget http://downloads.sourceforge.net/project/wkhtmltopdf/0.12.0/wkhtmltox-linux-i386_0.12.0-03c001d.tar.xz
# tar xJf wkhtmltox-linux-i386_0.12.0-03c001d.tar.xz
# ln -s /opt/wkhtmltox/bin/wkhtmltoimage /usr/bin/wkhtmltoimage
# chown apache:apache /usr/bin/wkhtmltoimage
# chmod +x /usr/bin/wkhtmltoimage

Step 2: Create Image Using Command Line

First check wkhtmltoimage script using linux command line. Following command will take screen shot of http://google.com and create and image with name google.jpg.

# /usr/bin/wkhtmltoimage --no-images --load-error-handling ignore http://google.com google.jpg

Step 3: PHP Code to Create Image

Use following php code to generate image from html ( website url ). This script required to be enabled shell_exec function for Apache. Most of shared hosting providers doesn’t allow’s this function.

Create a file name getImage.php and put below code:

&lt;?php

$url = $_GET['url'];    // Website URL to Create Image
$name = $_GET['img'];   // Output Image Name
$command = &quot;/usr/bin/wkhtmltoimage --no-images --load-error-handling ignore&quot;;
$dir_img = &quot;/var/www/html/images/&quot;;     // Image files will be saved here
$ex_cmd = &quot;$command $url &quot; . $dir_img . $name;
$output = shell_exec($ex_cmd);
?&gt;

<?php

$url = $_GET['url']; // Website URL to Create Image

$name = $_GET['img']; // Output Image Name

$command = "/usr/bin/wkhtmltoimage --no-images --load-error-handling ignore";

$dir_img = "/var/www/html/images/"; // Image files will be saved here

$ex_cmd = "$command $url " . $dir_img . $name;

$output = shell_exec($ex_cmd);

Use following syntex or demo url to generate image of website ( html ).

Syntax:

http://youdomain.com/getImage.php?url=<website url>&img=<image name>

Example:

https://tecadmin.net/getImage.php?url=http://google.com&img=image1.jpg

Step 4: PHP Script for SEO Friendly URL

If you want to create SEO friendly URL for this setup, you can use below steps.

Create few required directories in your web server document root

# mkdir -p /var/www/html/getImage/
# mkdir -p /var/www/html/getImage/images/

Create index.php file with following content. Make sure all directory path are correct,

&lt;?php

$url = str_replace('index.php','', $_SERVER['PHP_SELF']);
$url = str_replace($url,'',$_SERVER['REQUEST_URI']);
$url = explode('/',$url);
$name = array_shift($url);
$weburl = array_shift($url);

$command = &quot;/usr/bin/wkhtmltoimage --no-images --load-error-handling ignore&quot;;
$dir_img = &quot;/var/www/html/getImage/images/&quot;;     // Image files will be saved here
$ex_cmd = &quot;$command $weburl &quot; . $dir_img . $name;
$output = shell_exec($ex_cmd);
echo &quot;&lt;img src=&quot;/getImage/images/$name&quot; &gt;&quot;;  // comment this to disable image show on page

?&gt;

<?php

$url = str_replace('index.php','', $_SERVER['PHP_SELF']);

$url = str_replace($url,'',$_SERVER['REQUEST_URI']);

$url = explode('/',$url);

$name = array_shift($url);

$weburl = array_shift($url);

$command = "/usr/bin/wkhtmltoimage --no-images --load-error-handling ignore";

$dir_img = "/var/www/html/getImage/images/"; // Image files will be saved here

$ex_cmd = "$command $weburl " . $dir_img . $name;

$output = shell_exec($ex_cmd);

echo "<img src="/getImage/images/$name" >"; // comment this to disable image show on page

Now create a .htaccess file in this directory to move all requests to index.php file. make sure you server is enabled to use .htaccess file.

# vi /var/www/html/getImage/.htaccess

RewriteEngine On
RewriteCond %{REQUEST_URI} /images/.+(gif|png|jpg)$
RewriteRule .* - [L]
RewriteRule ^.*$ index.php

Now you can create images by accessing urls like below