Instagram Slideshow Module Released

I’m pleased to announce yet another module into Vapor modules called Instagram Slideshow. This module allows you to create a nice and fancy Instagram slideshow.

You can create a carousel using your own Instagram photos. The module is heavily customizable and works great on mobile as well. Here’s a screenshot below or you can view the demo.

Instagram Slideshow
Instagram Example

The module is heavily customizable. You can change:

  • The number of images available
  • Hide/show the bullets
  • Hide/show the navigation arrows
  • Adjust the image size
  • Adjust the number of images shown
  • Change the colors of the bullets and navigation arrows
  • Add padding and margin to the images
  • Display images in a lightbox
  • Adjust the slideshow settings such as autoplay and looping
  • Add animation effects if you choose just one image at a time

I’m confident you’ll love this module. It uses Owl Carousel to display the images in an easy-to-use and responsive format. It also uses CSS Animate to transition the images if you happen to only have one image at a time in the carousel.

The carousel is ready for mobile. We’ve set it up so that only one image is shown on mobile so the images don’t shrink down unpredictably when on a mobile device. On a mobile device, you can also use touch controls to change the image shown.

The Instagram API is finicky and I know some other Beaver Builder add-ons have had to deal with the nuances of the API being deprecated. So far, we’ve had no problems with the Instagram API and it is still working for several clients, so I believe I have set up the API endpoint correctly.

Feel free to check out a demo below. It contains several examples of how to use the Instagram carousel on your site. It’s a nice carousel that allows you to quickly show off your latest Instagram images. Choose a lightbox effect when clicking on the images, or have it link directly to the Instagram images.

Posted in

Leave a Comment

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