This plugin hasn’t been tested with the latest 3 major releases of WordPress. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.

Urlbox Screenshots

Description

Ever wanted to automate the generation and display of webpage screenshots on your wordpress site? Now it is easier than ever with the Urlbox Screenshots wordpress plugin. Simply specify a URL, and choose your screenshot options such as viewport width/height, retina resolution or full page screenshots and Urlbox will return a highly accurate PNG or JPEG image snapshot of the website and display it right inside your post.

Using the plugin is as simple as writing out the shortcode

[urlbox url=example.com]

That’s all there is to it!

What do you need

  • WordPress, duh!
  • A Urlbox.io Account (You can sign up for free)
  • Your Urlbox API Credentials (API key and secret)

In order to use this plugin you will need to sign up for a urlbox account at urlbox.io to get your API key and secret.

Once Activated

  1. Visit ‘Settings > Urlbox’ and fill in your Urlbox API Key and Secret. You will need to sign up for free at urlbox.io in order to get these.
  2. Set your default screenshot options on the Urlbox Screenshots settings page. For example, if you want all of your screenshots to be thumbnailed to 400px wide, set the Thumbnail Width option here to 400.

Once Configured

Using the plugin is super easy..

Wherever you want to display a screenshot in a post or other piece of content, use the [urlbox] shortcode like so:

[urlbox url=google.com] // this will generate a screenshot of google.com 

If you want to override any of the defaults you setup, simply pass the relevant option into the shortcode:

[urlbox url=google.com full_page=true thumbnail_width=400] // displays a full_page screenshot of google, thumnailed down to 400px wide

The plugin wraps the <img> tag inside a <div>, you can set the class of both this div and the img tag from the settings page, and override these settings by passing in the options in the shortcode:

[urlbox url=google.com div_class=mydivclass img_class=myimgclass ] // change the css classes of the wrapping div and img element

Known Bugs

  • None at this time

Screenshots

  • Settings page - Setup your Urlbox API Key and Secret and your default screenshot options here
  • Use the shortcode - Use the [urlbox] shortcode inside your posts and other content
  • See the results - The Urlbox plugin generates high quality PNG or JPEG snapshots of the website according to your options and displays them inside your post.

Installation

From your WordPress dashboard

  1. Visit ‘Plugins > Add New’
  2. Search for ‘Urlbox’
  3. Activate Urlbox Screenshots from your Plugins page.

From WordPress.org

  1. Download Urlbox Screenshots.
  2. Upload the ‘urlbox-screenshots’ directory to your ‘/wp-content/plugins/’ directory, using your favorite method (ftp, sftp, scp, etc…)
  3. Activate Urlbox Screenshots from your Plugins page.

Start automating screenshots in wordpress!

  1. Insert shortcode into post

    [urlbox url=google.com] // display a screenshot of google.com with default options

  2. Customise screenshots via the shortcode

    [urlbox url=urlbox.io width=320 ] // display a mobile screenshot of urlbox.io

FAQ

How do I change options from the shortcode

Pass them in like:

[urlbox url=www.bbc.co.uk' width=100]

See the settings page for all the option names to use inside the shortcode.

Reviews

Nice plugin, but $29/mo after 7 days (Ouch)

This is a well-executed plugin and would be a helpful tool for many users if not for the price. In order to use the plugin, a URLbox.io account is necessary. Good news, it’s free for 7 days. Bad news, it’s $29 a month after that. I’m not sure of many applications that would justify that price tag. Shame… it’s a nice plugin.

Read all 2 reviews

Contributors & Developers

“Urlbox Screenshots” is open source software. The following people have contributed to this plugin.

Contributors

Translate “Urlbox Screenshots” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.0.2

Update readme.txt

1.0.1

Update readme.txt

1.0.0

Initial Release