Knowband Blog | Ecommerce Modules

OpenCart Instagram Shop Gallery Extension – User Manual

Joe Parker

1.0 Introduction

Instagram is undoubtedly one of the fastest ways to reach a huge number of specific users and have them familiarize with a brand. Opencart Instagram Shop Gallery Extension by Knowband lets your customers shop what they see in your Instagram Account. You can showcase your Opencart Shoppable Instagram Feed on to your eCommerce website. More and more businesses want to advertise on Instagram because of its incredible audience. As technology evolves toward a visual-centric approach, users wanting to obtain as much information as possible but in less time are shifting from editorial to mainly visual content. You can give your customers a visual approach for them to view the products on your eCommerce store as Opencart Shoppable Instagram Feed and buy tagged products as if they are shopping on Instagram.

2.0 Features

3.0 Installation Guide

Before starting the installation process, you have to buy the Opencart Instagram Shop Gallery Extension from the Knowband store. Once purchased, you will receive the following files on your registered email.

Now in order to install this Opencart Instagram Shop Gallery Extension module on your online shop, follow the given steps:

Step 1: Unzip the zip file. You will get the folders as shown in the image below


Step 2: Copy all the folders of the zip file in the Root Directory of OpenCart setup via FTP manager.

So, Opencart Instagram Shop Gallery Extension plugin is now successfully installed and is ready to use at your store. Go to the admin menu and click on the extensions. Choose the Extension Type as Modules. You will find a list of modules. Select the Opencart Instagram Shop Gallery Extension.

To configure the Opencart Instagram Shop Gallery Extension, Navigate the settings in the following order:
Admin Panel > Extensions > Modules > Instagram Shop

The Admin Interface of Opencart Instagram Integration Extension is divided into 6 Tabs:

4.0.1 Instagram Account

Under the Instagram Account of the Opencart Instagram Integration Extension, You will have the following configuration option:

Know how to generate Access Token: Annexure 1: How to generate Access Token?

4.0.2 Photos & Videos

Under the Photos & Videos of the Opencart Instagram Integration Extension, You will have the following configuration option:

1.All
2.Featured
3.Tagged with Products

4.0.2.1 All

Here all the Photos added on your eCommerce store will be shown. The page will look like the following as shown below:

Instagram Icon: Click on the Icon to view the Photo on Instagram Profile.
When you will click on the Photo, the following pop up will be appear to them as shown below:

You can add an Image or Video to a Tagged Gallery Page as follows:

You can Tag as many Products as you want with this Photo.

Tagged products will be shown in your eCommerce store as below:

All the Photos and videos marked as Featured in ‘All’ Tab will be shown here. The page will look like as the one shown below:

4.0.2.3 Tagged with Products

All the Photos and Videos which are tagged with products will be listed here. You can click on the image to Tag photo with products. The screen will be shown as below.


4.0.2.4 Add Photos & Videos

Follow these simple steps to add a Photo and Video. Click on the Add Icon which is highlighted on the screenshot below:

The following screen will appear:

Users will have 2 options to add a screen:

Search with Hashtag
You can search a Photo using Hashtags and all the photos listed under that Hashtag will appear on the screen. You can select a Photo and click on Save and the Photo will be saved under ‘All’ Tab.

*Note – Do not use ‘#’ before the keyword to search a Photo.
You can only add a Photo using the Hashtag. To add a Video, you need to search it from your own account.

Search from own Account
When you click on Search from own account, the following page will be shown below. All the Photos and Videos uploaded on your Opencart Shoppable Instagram Feed will be shown.

Once the Photo or video is added, it will be shown on the ‘All’ Tab of the Photos & Videos setting page of Opencart Instagram Integration Extension.

4.0.3 Tags

Using Tags, you can add a page in your store and show specific Products under that Tag. The Tag page will look like as shown below:

Preview Tag: If you click on this option then it will redirect you to the Store where you can view the Tag Page.

4.0.3.1 Add a Tag

Under the Add Tag of Opencart Instagram Integration Extension, Admin will have the following configuration options:

After the information is saved on both the Tabs of Add Tag. You can click on Save and the Tag will be added.

Layouts:
The following two types of layout options are present in Opencart Instagram Shop Gallery Extension:

Carousel Slider

Grid View

4.0.3.2 Edit a Tag

Under the Edit Tag of Opencart Instagram Integration Extension, You will have the following configuration options. It will be same as Add Tag, the only difference is that data will be pre-filled.

4.0.4 Layouts

You can add your Instagram images on any page of your webstore from this option. Under the Layouts of the Opencart Instagram Integration Extension, You will have the following configuration option:

Edit Layout: Edit Layout Page will be same as Add a Layout Page. The only difference is that in edit page all the field will be pre-filled.
Delete Layout: When you click on Delete Layout, the page will give a Pop up to confirm. Once you confirm it, the Layout will be deleted.

4.0.4.1 Add Layout

You can add images from your Instagram feed on any page of your Webstore from this option. Add Layout of Opencart Instagram Shop Gallery Extension will have the following configuration option:


Position of Layouts:

Content Top

Content Bottom

Column Left

Column Right

4.0.5 Settings

Settings page will have the following configuration options:

4.0.5.1 General

Under the General Settings of the Opencart Instagram Integration Extension, You will have the following configuration option:

4.0.5.2 Colors and Labels

You can change the Look and feel of ‘Follow’ Button from this setting. The same is shown on the screenshot below:

Follow button will look like as shown below:


4.0.5.3 Gallery Page

You can change the main gallery page settings from this option. Under the Gallery Page Settings of the Opencart Instagram Integration Extension, You will have the following configuration option:

4.0.6 Help

Under the Help Tab of the Opencart Instagram Integration Extension, You can see on how to get the access Token for your Instagram account. You can follow the listed steps to generate Access Token. The page will look like following:

Annexure 1: How to generate Access Token?

Click here to go to Instagram Account

Step 1:
Go to https://instagram.pixelunion.net/ and click on Generate Access Token

Step 2:
Copy Access Token

Step 3:

Paste it in the Access Token field under Instagram account settings.