Home / Prestashop Module Tutorials / Ap Page Builder / Ap Page Builder Module Tutorial – Add Instagram with Raw HTML Widget
Add widget Instagram with Raw HTML
Add widget Instagram with Raw HTML

Ap Page Builder Module Tutorial – Add Instagram with Raw HTML Widget

Dear valued customers,

Welcome back to our minor error tutorial series regarding guide to add an Instagram feed in Ap Page Builder Module.

In this article, we will come up with another way to add the Instagram feed, which is Add Instagram with Raw HTML in Ap Page builder Module

The step by step guide will be presented in the following part of this blog. Now, let get started.

I. Create Instagram Account and get the code to Add Instagram with Raw HTML

Step 1: 

Access website:

https://elfsight.com/instagram-feed-instashow/create/

And create a new account on the site:

1. create new instagram account
1. create a new Instagram account

 

Step 2:

In the category Get all apps, select tab Social in category Instagram Feed:

2. select Tab Social in Get All App
2. select Tab Social in Get All Apps

 

Click on the button Create widget:

3. click on create Widget button
3. click on create Widget button

 

Step 3:

In the browser, open a new tab and login to your Instagram account then copy your Instagram name on your URL

4. copy your instagram name in URL
4. copy your Instagram name in URL

 

Step 4: Back to the page to create Instagram widget Feed  

5. click Create Widget button to create widget Instagram
5. click Create Widget button to create widget Instagram

 

Select 1 in 6 display styles namely Slide, Grid, Hashtag Showcase, Collage, Post slide, and Single Post

 

6. Select a template to create Instagram feed
6. Select a template to create an Instagram feed

Now you click on Continue with this template button

Insert the Instagram name, which you have got from Step 3: 

7. After click on Continue with this template option
7. After clicking on Continue with this template option

Now you will see a list of Instagram images displayed :

8. Instagram images display
8. Instagram images display

Click on Apply button:

9. click on Apply button
9. click on Apply button

Click on Save button:

10. click on Save button
10. click on Save button

Click on Add to website:

11. Click on Add to website button
11. Click on Add to website button

Now there is a popup window which contains the embed code, what you need to do is click on the copy code button

12. Click to copy code
12. Click to copy code

You have just got the embed code step. Now let come to the final step to Add widget Instagram with Raw HTML in Ap Page builder Module

II. Add widget Instagram with Raw HTML in Ap Page builder Module

Step 5: Back to the Ap Profiles Manager page in Ap Page builder Module, please follow instructions as the pictures below:

13. access ap profiles manage in Ap Page Builder Module
13. access ap profiles manage in Ap Page Builder Module

 

14. click to view profile in Ap Page Builder Module
14. click to view profile in Ap Page Builder Module

 

15. Click to create widget with Raw Html
15. Click to create a widget with Raw Html

 

16. add the code and save
16. add the code and save

 

Now you have just finished all the steps to display Instagram Feed.

Good luck.

 

About Luu Ly

Check Also

Update Ap Pagebuilder Module Version 2.2.8

Update Ap Pagebuilder Prestashop Module version 2.2.8

Happy New Year to all of our valued customers, we hope you enjoy your warmest …

Leave a Reply

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