Earlier this year, I released Twenty Seven Pro—a free lifestyle blog theme that included an Instagram feed in the site footer. It seems as though this a is a very popular feature these days, so I thought Genesis users would like it.
After all, automatically displaying an array of beautiful photos across the bottom of your website has some appeal—it’s great for bloggers, retailers, and anyone else hoping to grow their brand on Instagram.
Here’s what the site footer of the Twenty Seven Pro demo looks like:
I thought it might be helpful to show you how I did that. Implementing in one of your StudioPress themes will vary depending on which one you are using.
How to Add an Instagram Feed to Your Site Footer
1. Register the “Instagram” widget area in the functions file:
View the code on Gist.
2. Hook the “Instagram” widget area before the site footer:
View the code on Gist.
3. Download and install the WP Instagram widget plugin.
4. Go to Appearance > Widgets screen in your WordPress dashboard, and move the WP Instagram widget into the Instagram widget area. For the Twenty Seven Pro demo, I have selected to display 6 photos, with a size of “small”—configure the display of your Instagram feed as necessary.
5. Add CSS for Instagram feed images in theme style sheet:
View the code on Gist.
If you’re looking to add your Instagram feed in another location, here’s a comprehensive list of Genesis Hooks for you to use as reference.
We have published additional Genesis Quick Tips for you, so feel free to use what you see to build something awesome.
This blog was originally posted on Studiopress.com This post is in no way associated with Kembel.ca. For more posts by this author, please click here.
