In this article i’m going to write about an easy way you could fetch your instagram account feeds on your shopify store.
- We will be using instafeedjs.
Download instafeedjs library from http://instafeedjs.com/ : It is a plugin we will be using to fetch instagram account feeds. [Here is a direct download link – https://raw.githubusercontent.com/stevenschobert/instafeed.js/master/instafeed.min.js]
- Include instafeedjs on your shopify store
Inlcuding instageedjs is as easy as including any js file in shopify store. I hope you have `instafeed.min.js` and now navigate to `Online store > theme > edit HTML/CSS`. First upload the instafeedjs file under Assets.
Now find a file `theme.liquid` and add this before end of head. and this should include this js file on your current theme.
{{ 'instafeed.min.js' | asset_url | script_tag }}
- Get required credentials
To fetch feeds from instagram account you require `user id` and `access toekn`.
- User ID
– Your instagram username IS NOT user id. But you can easily find your account user id from here https://smashballoon.com/instagram-feed/find-instagram-user-id/ or jelled.com/instagram/lookup-user-id
- Access Token
– Similarly like user id, you can get your access token from here : http://instagram.pixelunion.net/ but for this you need to be loggedin.
Now you have obtained required credentials.
- Create theme options for admin management
Create theme customization from where you could input those credentials. This will give flexibility to change account id if required if future.
- Result.
Let’s get the feed here. In the desired liquid template add code below and you would be able to fetch feeds
<div id="instafeed"></div> <script type="text/javascript"> var userFeed = new Instafeed({ get: 'user', userId: 'YOUR_USER_ID', accessToken: 'YOUR_ACCESS_TOKEN' }); userFeed.run(); </script>
Leave a Reply