Thursday, May 22, 2014

How to Share Your Instagram Feed on Blogger Using SnapWidget (Free)

There are probably lots of ways to do add your Instagram Feed to your Blogger blog, but here is the widget I use, which is easy to configure and easy to install.  Plus, with the free version there are plenty of options to customize its appearance to fit the style and layout of your blog.

Sharing my Instagram Feed to my blog was a lot easier than I expected!  This widget also works with all other blog and website platforms.

First, go to and click on Get Your Free Widget.

Begin by typing in your Instagram username at the top, and then work your way down the customization options.

Do you want to display only a selection of photos tagged with a certain hashtag?  Enter a hashtag filter here.

Then you can fiddle with the Widget Type (which are the display options) to get the size and shape you want, beginning with the pixel size, number of rows and columns, border addition, background color, space around each photo (photo padding).  The available customizations will vary depending on the Widget Type you select.

SnapWidget's Easy Widget Creator for Instagram
SnapWidget's Easy Widget Creator for Instagram

You can play around with the settings until you get it to look the way you like, and it will generate functional examples so you can preview the final thing before you implement it.  Here are some examples:

Grid Style (choose the number of rows and columns)

Board Style (also displays a part of your photo descriptions)

Scrolling Style (animation moves left to right)

You can also add some mouse-over effects (I like Fade-In), and decide if you want Social Media sharing turned on or off.

When you are done, click on Get Widget.  Copy the code they provide for you, and paste it into Blogger.

Not Sure How to Add a Gadget to Blogger?  Here's How:

  1. In your Blogger dashboard, go to Layout.
  2. On your page you'll see all your blog elements and gadgets laid out.  Click on any link called Add a Gadget (in your Sidebar, below your posts, etc.)
  3. The "Add a Gadget" window will open.  Scroll down and choose the HTML/Java Script option.
  4. The "Configure HTML/JavaScript" window opens.  Paste the piece of code, that the above website provided for you, in the window.  If you want to, you can add a title to this gadget.  Click Save.

Back in your Layout menu, drag your new gadget box up or down to position it where you want it. Click on Preview if you want to see a non-live version of what the gadget will look like on your page, or click Save Arrangement to finish.

You can follow Zen Shmen Home on Instagram @zenshmenhome


No comments:

Post a Comment

Please share your thoughts on this! Your email address will remain private.