Website Snapshots with WordPress Shortcode

• Tweet

WordPress.com uses a nifty little tool to take screenshots of Commercial Themes. If you right click on a few of the screenshots on that page you’ll see that they have consistent URL form.

The following shortcode makes use of the functionality on WordPress.com by rendering a screenshot of any webpage in your blog post. I suspect that WordPress never intended for the service to be used indiscriminately by the online world so I would assume, at some point, the service will cease. The more people that use this feature, the less likely WordPress will be able to provide reliable screenshots on their own website.

Copy the following function into your functions.php file.

function wpr_snap($atts, $content = null) {
        extract(shortcode_atts(array(
			"snap" => 'http://s.wordpress.com/mshots/v1/',
			"url" => 'http://www.internoetics.com',
			"alt" => 'Image text',
			"w" => '400', // width
			"h" => '300' // height
        ), $atts));

	$img = '';
        return $img;
}
add_shortcode("snap", "wpr_snap");

You can define the website URL, alt text, width and height in the shortcode.

The first time you call the website it will take some time to render (it seems to cache on WordPress for an unknown period after that). I suggest you preview the post first and let the screenshot render before you publish your post to the world.

The following shortcode:

[snap url="http://www.internoetics.com" alt="Snapshot of Internoetics" w="400" h="300"]

… will render the following image:

You could quite easily extend the shortcode by including alignment, a link or additional styling.

Incidentally, TimThumb has the ability to build webpage screenshots if you have access to your own server. Instructions are within the source code.

There are at least a few people claiming rights over the find, but I understand Valentin Brandt should be credited with the ‘discovery’.

First Name: Your Email Address:

If you liked this article, you may also like:

1. [Shortcode] Include an RSS feed in a post or page with shortcode
2. [Shortcode] A better way of permalinks in WordPress
3. [Shortcode] Insert Youtube videos into your blog with shortcode
4. [Shortcode] Easily post an aviation Metar report into your post or page with shortcode
5. WordPress Audio Player and Shortcode