Add an Instagram Feed Widget to Your Blog

Mar 1, 2019 | Blogger Tutorials, Weebly Tutorials, WordPress Tutorials

Would you like to add your Instagram feed to your blog? We recommend using the site SnapWidget to generate the widget code. Although they have paid plans, you can use their site to create an Instagram feed for free. If you’ll like to display your feed using hashtags, you will need to upgrade to their Pro plan for $10/month. Also, the Pro plan is also required if you’d like for your photos to link directly to Instagram.

Steps to Add Instagram Feed

1. Go to SnapWidget and create a free account.

2. Click on your name and then Dashboard.

3. Click Create A New Widget.

3. Choose Instagram Grid. (Some of the others will work. To keep it simple, though, this tutorial will explain how to use one of the options with our templates.)

Instagram Feed for Blog

4. You will be prompted to Select Your Instagram Account.

Connect Instagram to Snapwidget

5. Most of the settings will vary based on your personal preference.

Responsive

It’s important that you select Yes for Responsive so your widget displays correctly on mobile devices.

Thumbnail Size & Layout (for Sidebar Feed)

The sidebar on most of our templates is 280px wide. The size of your thumbnail will depend on how many columns you would like and how much space (photo padding) you would like between the thumbnails.

So for example, if you want 3 columns and 2 rows and 5 pixels of space between the images, your thumbnail size should be no more than 90px.

Instagram Feed for Sidebar

Thumbnail Size & Layout (for Footer Feed)

The footer feed thumbnail size will depend on if your template footer area expands to the full-width of your screen or if you have a footer area that does not expand past the content area. Most of our templates with footer areas that are as wide as the content area are 1140px wide. It’s more common to have 0px photo padding between Instagram photos in the footer area. The thumbnail size will depend on the number of photos that you would like to display in one row.

Instagram Feed for Footer

6. After you choose the settings that you prefer, click Update & Get Widget and then Copy to Clipboard.

Instagram Code Snapwidget

7. Paste the code into an HTML widget.

If you’re using SnapWidget for more than one widget area, create a new SnapWidget for each widget space on your blog.

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

Join the Newsletter

Subscribe to get our latest content by email.

    We won't send you spam. Unsubscribe at any time.

    Welcome to Albemarle PR

    My name is Laura and I'm a web designer that specializes in blog designs for teachers and mom bloggers.

    Popular Topics

    Trending Articles

    Busy week? You've got this!

    Albemarle PR is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com.

    Get $100 off the StudioPress Pro Plus All-Theme pack. Expires 3/20/19 at 8PM EST. Dismiss