Custom Instagram Feed

Add instagram feed to page from URL

🚧 Edit - As of 13th April 2021 - This code does not work. Solution is being looked into, however due to time constraints from client work, this may be a bit of time until I am able to look at trying to fix this.

Feel free to have a go at fixing it. Make a pull request if you find a solution.

---

Table of Contents

• Tutorial
• Usage
• Shortcode
  • Attribute Options
  • Examples
• Extra Info
• Troubleshooting
• Support

Tutorial

Watch the demo and tutorial from Jonathan at Permaslug

Usage

Using Wordpress

1. Add index.php to code snippets or functions.php
2. Replace $insta_id with Instagram username
3. Add shortcode to page

For slider integration

1. Add slider CSS to head of website
2. Add slider JS just before closing </body> tag
3. Add the <script> and <styles> code to functions.php or code snippets

Shortcode

[instafeed user="ATTRIBUTE_NAME"]

To use grid = [instafeed user="feed-grid"] To use slider = [instafeed user="feed-slider"]

You can pass extra parameters to the grid and slider:

• caption=true - shows the caption (Default is false)
• class="my-custom-class" - this adds a custom class to the grid or slider so you can target specific sliders if more than 1 on the page
• post_count="6" - returns 6 in the slider or grid (Default is 12)

Attribute name options

• feed-grid - User feed grid
• feed-slider - User feed slider
• username - Users username
• name - Users display name
• user_pp - Users profile picture thumbnail
• user_pp_hd - Users profile picture HD
• followers - Users follower count
• following - Users following count
• bio - Users bio
• user_post_count - Total number of users posts

Examples

Grid

[instafeed user="feed-grid" caption=true post_count=6]

Slider

[instafeed user="feed-slider"]

Extra Info

• To see what other data is available, use - https://www.instagram.com/{username}/channel/?__a=1

• You can change the length of the transient (cache) by changing line 19 86400 to a different time (in seconds). Default is 1 day.

  • 604800 = 1 week
  • 86400 = 1 day
  • 3600 = 1 hour

• The default instagram feed does not come with any styling.

• Feel free to make a pull request if you come up with a nice design and share it with the community

Troubleshooting

Instagram Feed showing wrong user

If the instagram feed is showing the wrong user, this is usually down to the transients showing a cached version.

To fix this, pleaase use these steps:

1. Uncomment lines 8 and 20 in index.php
2. Load the frontend where the shortcode appears
3. Re-comment lines 8 and 20

Support

If you found this useful,and would like to support me. You can use my buyMeACoffee link below.
Please note: it is NOT required. It is here for you to enjoy either way.