Featured Blog: Seth's Blog: A Thanksgiving Reader
Rolling Out of Beta: Upgrading Authors

Instansive, A Responsive Instagram Widget

Third_party_header
As a Typepad blogger, you have access to an ever-growing catalog of built-in features that make blogging with us easy and effective. But that's not all! Typepad also plays well with other services, allowing you to add some nifty bells and whistles to your blog. Over the next six weeks, we'll introduce you to some of our favorite third-party services, making it even easier for you to grow a loyal, engaged audience. Let's get started!

With the necessary move to responsive designs for websites and blogs, it is good to start looking at how the modules on your blog display on small and large devices. Many popular social media services do provide widgets which adjust to different displays, including Instagram.

Instansive is just the widget you need to display Instagram photos in your blog's sidebar. You don't need to have an Instagram account to take advantage of this widget if you want to share photos from your favorite Instagramer or by hashtag.

Configure the Instansive Widget

  • 1) Go to Instansive.com.
  • 2) Enter an Instagram username or a hashtag. Please note the Instagram account must be public.
    Step 2
  • 3) Choose type of widget. Each type - Grid, Slideshow, & Columns - has unique options, and you can select a different type to see the settings that can be configured.
  • 4) After selecting a type of widget, choose the optional settings. Don't worry you can Preview the various settings to find out which one works best for you before adding the code to your blog!
    Step 4
  • 5) Click Preview and review the display of the widget in the left column. If you don't like the result, go back and change the type &/or settings and preview again.
  • 6) Once you have settled on the configuration, click the Get Code button. The code will appear below the button.
    Step 5
  • 7) Use your mouse to highlight the code and key Ctrl+C (for Windows) or Cmd+C (for Macs) to copy it.

Add Instansive Widget to Your Blog

  • 8) In Typepad, open the Blogs menu, select your blog, and click to the Design tab.
  • 9) Go to the Content section.
  • 10) Select the Embed Your Own HTML module and click the Add This Module button.
  • 11) Paste the code for the Instansive widget that you copied previously into the pop-up box. You can add a label which will not display on the published blog as well.

Step 3

  • 12) Click OK.
  • 13) Use your mouse to drag the module to the preferred location in the sidebar.
  • 14) Click Save Changes to update the blog with the new module.

That's it! You can add multiple modules following the same steps.

Note: The code shown in the above screenshots is not valid. You'll generate unique code at Instansive for your own widget.

comments powered by Disqus