How to Insert Screenshots into Wordpress Pages

Dirk Hoekstra author image By Dirk Hoekstra on 20 August, 2020


Creating website screenshots into your Wordpress posts can be done manually.

But, if you create a lot of posts that require screenshots then this can become quite an annoying task

In this article, I'll show you how you can use the Website Screenshots plugin to automatically add website screenshots into your Wordpress page.

Wordpress post

Installing the plugin

The first step is installing the Website Screenshot plugin.

Simply head over to the Wordpress plugin page in your admin panel, and search for "website screenshots".

Find the website screenshot plugin and click the "install now" button.

Website screenshots plugin

After installing you must also activate the plugin

To do this click on the "activate" link on the plugin page.

Website screenshots plugin

Configuring the plugin

The plugin uses screenshotapi.net under the hood.

To create an account head over to our registration page.

Once you have an account copy your API Token.

Head back to your Wordpress admin panel and find the setting page under Plugins > Website screenshot options

Paste your API token and you're all set to go 🚀

Insert a screenshot into your post

The plugin uses shortcodes to insert screenshots.

To add a screenshot simply copy the following snippet:

[website-screenshot url="https://stripe.com" width="1920" height="1080"]

You can also add the following parameters to the shortcodes

Parameter Description
url The url
width The width of the browser
height The height of the browser
thumbnail_width Resize the screenshot to the thumbnail_width, the aspect ratio is preserved.
alt The alt text of the image
target The target of the link. Use _blank to open in a new window.
class The CSS class of the image

For example, to generate a thumbnail of stripe.com that opens in a new window you can use the following shortcode:

[website-screenshot url="https://stripe.com" thumbnail_width="200" target="_blank"]

Conclusion

And that's it! With the Website Screenshots plugin, you can easily insert screenshots into your Wordpress post.

Good luck with growing your Wordpress blog 🌲