Read More
Menu Close

    Multi Vendor Instagram Shop Feeds For WooCommerce

    Multi-Vendor Instagram Shop Feeds for WooCommerce will allow the store owner as well as the vendor to do marketing by using the Instagram post of the product user. Also, the vendor can add the Instagram Shop feed on the Dedicated page, Shop page and Product Page.

    Here shop feeds are nothing but the Instagram images of the products which are Uploaded by the product users and because of these images, the buyer can view the actual image of the product and this helps in building the trust of the buyer for the product.

    Note:

    • This module is an add-on to the WordPress WooCommerce Multi-Vendor Marketplace, before using this module you first need to install WordPress WooCommerce Multi-Vendor Marketplace.
    • It is mandatory to have an Instagram business account connected with a Facebook page.
    • The user needs to register for the Facebook developer account and must possess a basic configured Facebook App.

    Watch the below video tutorial to understand the plugin workflow:

     

    Features

    • The admin can create Hashtags and can assign products to it.
    • The admin can fetch all the images which have used that hashtag on Instagram.
    • This module allows the admin to configure the view for the Instagram feeds as Carousel and List.
    • This module allows the admin to select the images from that particular hashtag images that he wants to use for the marketing of the product.
    • The seller can also create the hashtags and can assign products to it.
    • The seller can fetch the images of a particular Hashtag and can use the selected images as the Instagram shop Feed.
    • Add to cart button is available on the hashtag pop-up for the products linked to the particular Instagram Feeds.
    • The customer can view the Instagram Feeds on the Shop Page, Dedicated Page, and Product Page.
    • The customer can click on the Product image available next to the Feeds image to get redirected to that Product Page.
    • This module is responsive i.e. it is compatible with all screen sizes (Mobile Screen, Tablet Screen, and Desktop Screen).

    Installation

    Firstly, the user will get a zip file which first of all needs to be uploaded in the “Add New” menu option in the WordPress admin panel.

    Start your headless eCommerce
    now.
    Read More

    Furthermore, log in to your account panel and under the Dashboard hover your mouse over the “Plugins” menu option.

    After that, tap on the Sub-Menu, and then select the “Add New” option.

    PayUmoney Payment Gateway-installation add new details

    Next, you will see an option on the top of your page that is “Upload Plugin”, click the option to upload the zip file.

    PayUmoney Payment Gateway- upload plugin

    After clicking on the “Upload Plugin” option, below that you will see a button “Choose File”.

    Click on the button to browse for the zip file as per the snapshot below.

    PayUmoney Payment Gateway-installation choose file

    After browsing the file, click the “Install Now” button to install the plugin as per the snapshot.

    install

    When the plugin is installed correctly, you will see the success message and an option to activate the plugin. After that, click on “Activate Plugin” to activate the installed plugin.

    activate plugin

    Facebook Developer Registration

    Once, you have logged into your Facebook account firstly, go to the Facebook for Developer webpage.

    Facebook-for-Developers-1

    Click Get Started and confirm your email address select developer in the section for About you and complete registration.

    Register-as-a-developer-Facebook-for-Developers

    Create App – Settings

    Right after, completing the registration the user is redirected to the below page. Here, click Create App.

    All-Apps-Facebook-for-Developers

    Further, select the Manage Business Integration option and press Continue.

    All-Apps-Facebook-for-Developers-7

    After, entering your App Display Name App Contact Email click the Create App.

    All-Apps-Facebook-for-Developers-8

    To proceed, the user needs to add the Facebook Login in the section Add products to your App. As a result, the Facebook login will be added to your Products.

    Click on the Facebook Login > Settings.

    mark-williamson-Add-Product-Facebook-for-Developers-1-1

    Further, enter your redirect URL in the Valid OAuth Redirect URLs band and Save Changes.

    Note: The user can add more than one redirect URLs.

    mark-williamson-Facebook-Login-Facebook-for-Developers

    Add Product – Instagram Graph API

    Click the Add product icon and then press the Set Up button under the Instagram graph API.

    mark-williamson-Dashboard-Facebook-for-Developers

    The user will be redirected to the below page.

    mark-williamson-Instagram-Graph-API-Facebook-for-Developers

    In order to be able to use this API in Live mode, the user needs to undergo the process of App Review and permissions for the below.

    mark-williamson-App-Review-Facebook-for-Developers

    Retrieve APP ID & Secret Key

    In order to fetch the APP ID & Secret Key just go to the Settings > Basic in the sidebar menu of the Facebook for developer Dashboard itself and copy your APP ID & Secret Key.

    mark-williamson-Settings-Facebook-for-Developers

    Connect to Facebook

    In order to to be able to fetch the images so your Facebook account must be connected. For this the admin can now go to the Marketplace Instagram Feeds > Configuration.

    Under the Facebook section, save your Facebook APP ID and APP Secret Key and then click Connect to Facebook.

    Configuration-‹-Woocommerce-Marketplace-Instagram-Shop-Feed-—-WordPress

    Note: For the Facebook Access Token this will be Fetched automatically, once you have saved the app ID, secret key and then connect to Facebook. Moreover, the lifetime of the access token is nearly 60 Days.

    After that in the pop-up window that will appear simply click on continue to complete the login.

    Log-in-With-Facebook

     

    Module Configuration

    To edit the view of the Instagram feed in the front end The admin can go to the Marketplace Instagram Feeds > Configuration. Select the type of view under the Instagram feed view section and click Save Settings.

    Configuration-‹-Woocommerce-Marketplace-Instagram-Shop-Feed-—-WordPress-1

    Admin End: Add New Hashtag

    Once the Configuration is done, the store owner can select All Tags to Add/Edit Hashtags. After clicking on the All Tags the store owner can view the list of all hashtags.

    Tags list

    Also, the admin can use the bulk action to Activate, Deactivate and Delete the selected hashtags.

    On the upper left side, the Add New button is available for adding the new Hashtags.

    TAgs

    After clicking on the Add New button the admin will get the following options:

    • HashTag: Here the store owner can enter the Hashtag name.
    • Linked Products: The admin can select the products that will be linked to that particular Hashtag.
    • Hashtag Visibility: The admin can select the visibility of the product on the Shop Page, Dedicated Page, Product Page.
    • Hashtag Priority: On the basis of this priority the hashtag will appear on the Pages.
    • Status: Select Enable to use the hashtag and Disable for not using the tag.

    Note: Only By editing the hashtag the fetch button will appear for adding the Instagram Feed images to the Products.

    Admin End: Editing Hashtag

    Once the hashtag is created that, the admin needs to click on the edit button to edit the hashtag and while editing the hashtag the Fetch image button will appear.

    Marketplace Instagram feeds

    After clicking on the Fetch image button those images will appear in a pop-up that has used the same hashtag on Instagram.

    Instagram Images

    Once the pop-up will appear the admin needs to select the images which he wants to use as an Instagram Feed and then click on the import button to use those images.

    Fetch Images

    The admin can also use the bulk action to Enable, Disable and Delete the selected images.

    Seller End: Add New Hashtag

    The seller can click on the Instagram Hashtag button to view the list of all created hashtag.

    seller tags

    After that, the seller can click on the Add Hashtag the seller can create a new Hashtag.

    Hashtags

    Under Add hashtag, the admin will get these options.

    • Hashtag: Enter the Hashtag name here.
    • Linked products: Select the product which you want to link with the hashtag.
    • Hashtag Visibility: The Seller can select the visibility of the Hashtag on the Shop page, Dedicated page, Product page.
    • Hashtag Priority: Select the Priority of the Hashtag.
    • Status: Select enable to use the hashtag and disable for not using it.

    Likewise to the admin, the seller can also add Instagram feed images only by editing the Hashtags.

    Seller end: Edit Hashtag

    After clicking on the Edit button the Fetch image button will appear.

    Create Tags

    Once the seller clicks on the Fetch Image button, a pop-up will appear for selecting the image for the Instagram Feeds.

    Instagram Images

    For using the selected image the seller needs to click on the import button.

    Fetch images

    Customer End Workflow

    Dedicated Page: Instagram Feeds

    The customer can view Instagram feeds on a dedicated page i.e. Instagram feeds page as shown below:

    Instagram Feeds

    The customer can click on the View Product button on a particular hashtag and a pop-up will appear.

    Products page feeds

    By using the pop-up the customer can view the Instagram images of the product along with the products linked to the respective hashtag and Add to Cart button is also available on the pop-up image.

    By using that Add to Cart button the customer can directly add the product to the cart and proceed with the checkout process.

    Product Page

    Also, On the particular product page, the customer can view the Instagram feeds as shown below:

    Featured Post

    Shop Page

    Similarly, on the shop page also the customer can find the hashtags at the end of the products and can use those hashtags to view the images of the product by the users of it.

    Instagram feeds on shop page

    Responsive

    The Multi-Vendor Instagram Shop Feeds for WooCommerce plugin is compatible with all screen size i.e. this module automatically adjust with the screen size of Mobile, Tablet, and Desktop.

    responsive

    That’s all about Multi-Vendor Instagram Shop Feeds for WooCommerce module. For any further queries and suggestions please add a ticket at the HelpDesk System.

    Current Product Version - 1.0.1

    Supported Framework Version - WooComerce version: 5.0.0, Wordpress: 5.6.2

    Blog Version - WooComerce version: 5.0.0, Wordpress: 5.6.2
    • Version WooComerce version: 5.2
    • Version WooComerce version: 5.0.0, Wordpress: 5.6.2
    • Version WooComerce version: 3.7
    . . .
    Discuss on Helpdesk

    Leave a Comment

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


    Be the first to comment.

    Back to Top

    Table of Content