Showcase your Instagram photos directly in your Adobe Muse site. This fully customizable gallery beautifully presents your images as thumbnails, which display in a lightbox when clicked. With control over size, captions, transitions, and even the option to create a slideshow, focus is brought to your inspiring images.
Note: Instagram has implemented changes to their developer API on June 1st, 2016. These changes impact the functionality and features of our widget. Any widget prior to version 1.4 will need to be updated in order to function. See this article for more information.
Widget Compatibility: Highly Compatible (No known issues when combining with other MuseThemes widgets)
Current Version: 1.9
Supported Devices: Desktop, Tablet, Phone
Release Log
1.95: Ensures proper playback of video posts (11/19/2019)
1.9: Adds carousel feature, allowing multiple mixed-media items per post. Also addresses issue of distorted image aspect ratios. (02/01/2018)
1.8: Enhancement adds support for video posts, column number control for better page placement reliability, general optimizations (04/25/2017)
1.7: Updated Instagram loading icon (02/14/2017)
1.6: Fixed issue causing lightbox to open at the top of the page on mobile devices (11/11/2016)
1.5: Updated option panel notes (06/16/2016)
1.4: Updated to incorporate mandatory Instagram API changes, added nav button opacity parameter, improved lightbox button sizing, set minimum allowable thumbnails in gallery to one image (06/01/2016)
1.3: Added option to disable "Load More" button from gallery, added option to disable date and caption in lightbox (05/04/2016)
1.2: Fixed load more functionality, fixed lightbox images opening at the top of the page (03/11/2016)
1.1: Fixed height display issue and updated multi-color loading icon to a black icon (02/17/16)
1.0: Adds collapsible panel functionality and support for responsive Muse
L11.3: Fixed bug causing some user accounts to be loaded incorrectly (08/04/2015)
Setup
Drag the widget from the library and drop into your project in Design mode.
You will need to acquire your Instagram access token. Pixel Union's Instagram token generator tool is the easiest way to get it. Follow the link in the Thumbnail widget option panel.
Click the Generate Access Token button on the Pixel Union site, and follow the instructions to receive your token.
Copy the entire access token code.
Paste the access token into the first field in the Thumbnail widget options.
Copy the first series of numbers in the token. This is the series of numbers before the first period (usually 8-12 characters long). Paste that series of numbers into the User ID field.
It's a good idea at this point to preview the page in browser to make sure your information was entered correctly. The default settings at this point will display an Instagram feed if your account settings were entered correctly.
The Thumbnail Settings section allows for control of how the thumbnail images within the gallery appear: size, padding, overlay, icons, etc.
You may use the number of columns to more reliably control the size and shape of the thumbnail gallery within your page. A couple of non-traditional ideas:
For a wide horizontal "stripe" of thumbnails, set the columns to a higher number (like 4) then limit the Number of Thumbnails to just 4.
For a single feature image that you can be dynamic, meaning it updates automatically, set your number of thumbnails to 1, and disable the load more button. This will eliminate the impression that the image is part of a feed.
The Load More Button Settings section allows for control of the look and feel of the Load More button seen at the end of the gallery. There is a default option, as well as a custom option. The custom option allows you to create your own button in Muse.
To use a custom button, design a button using a state button or rectangle, then apply a graphic style to it. Define the graphic style in the Custom Button Style Name field.
The Lightnox Settings section allows for all elements seen when the lightbox appears after a thumbnail image is clicked upon.
You may set individual transition styles to lightbox open and transitions between slides.
You may set transition speeds for lightbox open and close.
The Overlay Opacity setting applies to the full page overlay behind the lightbox.
The remaining checkbox options allow for enabling/disabling options such as showing captions and pagination, slideshow loop, keyboard navifation and more.
Instagram restricts image count to a maximum of 20 images
Our widget displays gallery thumbnail images in a square format. Non-square aspect ratios will display with white bars