Instagram is the most popular social photography app on the planet right now, boasting over 200 million monthly active users who share some 16 billion photos. Given its popularity, it makes sense to embrace Instagram on your website, whether that is by showcasing your own photos or sharing some of your favorite shots from other users of the service.
In this tutorial, we will show you how to embed Instagram photos in your WordPress posts, add images to your sidebar, and promote your own profile by displaying an Instagram Badge.
Embedding Instagram Images and Videos
Embedding an Instagram image or video on your site could not be any simpler and works in exactly the same way as embedding a Vine or YouTube video.
All you need to do is find the image or video you like and copy the page URL from the web browser address bar.
In your post/page editor, paste the URL on its own line wherever you want it to appear. Click on Publish and you’re all done.
By default, URL embeds will display images and videos at the largest size available – 612 pixels wide.
If you want better control over the size of the image, or want to display photos side by side, you should wrap the URL in a shortcode. This can be done easily using the following code:
The result is the same, but you will no longer need to place URLs on their own line. You can also input your own image size. In this case, a shortcode would look like this:
Images will automatically link to the URL of the original image. Videos can be viewed directly from within the post.
Using the Instagram Widget
The Instagram widget works in the same way as a Twitter feed, allowing you to display your latest images directly from the sidebar of your blog.
To use the widget you will need to grant WordPress access to your Instagram account. Drag the widget over to your sidebar, open it and click on Authorize Instagram Access.
Login to your Instagram account and click on Authorize – you will now be taken back to your WordPress site where you can customize the widget.
Give your widget a title, chose the number of images you wish to display and the number of columns. Click on Save to confirm the settings and your widget will automatically display in your sidebar.
Adding an Instagram Badge
An Instagram Badge is a great way of promoting your Instagram account through WordPress. To get one, login to your Instagram account and go to Badges. Select the badge you want to display on your site and generate the code.
You do not need to copy the full generated code, just the part at the bottom starting with <a href= and ending with </a>.
Back on your WordPress site, drag a Text widget over to your sidebar, paste in the code and click Save.
You will now have a shiny new Instagram Badge.