X

Display screenshot of any website using shortcode

StudioPress Altitude Pro Review - color picker

Adding the first snippet to the functions.php of your wordpress theme will let you use the bellow shortcode to display a screenshot of any website.



Code Snippet:


function wps_screenshot($atts, $content = null) {
extract(shortcode_atts(array(
"screenshot" => 'http://s.wordpress.com/mshots/v1/',
"url" => 'http://',
"alt" => 'screenshot',
"width" => '400',
"height" => '300'
), $atts));
return $screen = '<img src="' . $screenshot . '' . urlencode($url) . '?w=' . $width . '&h=' . $height . '" alt="' . $alt . '"/>';
}
add_shortcode("screenshot", "wps_screenshot");


Code Snippet:


[screenshot url="http://wpsnipp.com" alt="wordpress code snippets for your blog" width="200" height="200"]

Comments  Leave a Reply

  1. Any help on how to use this with a custom meta field that can be entered from front-end?
    thanks.

  2. I really like this snippit and just put it to use on my portfolio page. After the first page refresh the images seem to load just fine even on my other computer. So I guess they just have to go through that mshots once really. Pretty cool

  3. The main downfall is not utilizing the featured image.

    1. Hi Jamie, You could do this with the featured image but would require you do create screenshots of every site. This way you only need to add the url of any site to get a screenshot.

  4. This may be true but if you preview your post before hand that should not be a big problem.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

WordPress Launch Checklist

The Ultimate WordPress Launch Checklist

We've compiled all the essential checklist items for your next WordPress website launch into one handy ebook.
Yes, Send Me the Free eBook!