Magento 2 User Experience Extensions

  1. Home
  2. Docs
  3. Magento 2 User Experience Extensions
  4. Magento 2 Instagram Feed
  5. User Guide

User Guide

1. Overview

Magento 2 Instagram Feed extension allows admins to integrate Instagram feeds into the Magento storefront, to showcase attractive media & content from their accounts.

The Instagram Feed will look like this.

Note: If the post has multiple media, the first image/video will be chosen to display on the Instagram feed.

2. How Does it Work?

2.1. Module Configuration

 2.1.1. General Configuration

Here, you will enable the module and configure it to connect Instagram with your Magento store.

Navigate Stores ⇒ Configuration ⇒ BSSCommerce ⇒ Instagram Feed

  • At Enable Module: Choose Yes to activate the module.
  • At Instagram Access Token: Enter the user Token provided for your Instagram account. This token is necessary for calling API to get the images/videos from the Instagram feed.
    To get Instagram token, please follow this guide.

2.1.2. Advanced Token Settings

This is important as Token has expired dates and whenever you post something new, these settings will update automatically for you.

  • API call interval minutes:  Set the interval time between 2 continuous API calls.
  • Refresh Token: Choose Yes to automatically generate and update a new token, replacing the expired one.

Note: Usually, the token will expire after 60 days. If this configuration is enabled, 2-3 days before the token expires, the module will process to let the Meta for Developer system automatically generate a new token and update it to the Instagram Access Token configuration above. However, you need to run cron for your site. Or approximately every 60 days, you have to access and press the Save config button before the token expires to keep it running.

  • Token Expired Date: show the expiration date of the current Access Token.

2.1.3. Media Popup Settings

This module allows a popup to show up whenever customers click on an Instagram feed.

  • At Popup Auto Play: Choose Yes if you want the media to move to the next one automatically. Or No to disable it, and customers have to click the arrow to see the next posts.
  • At Popup Auto Play Speed: Enter the amount of time (seconds) that the post takes to switch to the next one.

2.2. Instagram Feed Widget Configuration

The Instagram feed enabled by this module works as a widget in the Magento store, so that you can set the display pages, positions, titles, and layouts for the feed.

2.2.1. Add the widget

To add a new Instagram feed widget, navigate to Content > Widgets. Click the Add Widget button.

At Settings, in the Type field: Choose BSS Instagram Feed Widget. Then choose Design Theme & Click the Continue button to proceed.

2.2.2. Set up Storefront properties

  • Widget Title: Enter the title for the widget in the backend.
  • Assign to Store Views: Assign the widget to the selected store views.
  • Sort Order: Set the order if there is more than 1 widget in the same container.

  • In Layout Updates, you will choose the pages & positions on those pages to display the Instagram feed. You can put the widget on multiple places by clicking the Add Layout Update button to add more.
  • At Display on: choose to display the widget on which page/product/category type. Then accordingly, you will see the options to choose which page or specifics or all products/categories.

  • On the right, there’s a Container option: choose the container position for the widget.
  • To finish, click on the Save button.

2.2.3. Widget Options: Label, Layout & Auto-play

  • Widget Label: Enter the name of the Instagram feed widget on the frontend.
  • Widget Layout: Choose the layout for the widget - Standard for grid layout and Slider for slide layout. If you choose the Slider layout, you will choose whether the widget auto-plays or not at Auto Play. Then set the auto-play time at Auto Play Time.
  • Enable Repeated Images: Choose Yes to let the slider repeat the images after reaching the end.
Was this article helpful to you? Yes No

How can we help?