How to add an Instagram feed to Joomla

An Instagram feed embed for Joomla

Joomla is one of the most popular free and open-source website publishing tools. Joomla comes with an extensive amount of ready-made templates and plugins, and the CMS is trusted by organisations like Hyundai and the NCA, and famous sports stars Michael Phelps and Roger Federer.

Brands love Instagram, and it doesn’t come as a surprise that Joomla customers often add social media widgets on the homepage or create landing pages for their user-generated content campaigns. With tools like Flockler, Joomla customers can combine social media feeds from Instagram, Facebook, Twitter, YouTube, and other channels and then display those feeds anywhere on their websites.

In this tutorial, we will walk you through how to display Instagram feeds on any Joomla website.

Creating an Instagram widget for your website is straightforward and only takes a couple of minutes. Here’s a three-step guide on how to add an Instagram feed to Joomla:

  1. Gather Instagram feeds by username or hashtag
  2. Choose the Instagram feed layout: Wall, Grid, Carousel, or Slideshow
  3. Embed an Instagram feed on any Joomla page

1. Gather Instagram feeds by username or hashtag

Before getting started, sign up for Flockler’s free trial. You get access to the full product – a credit card is not required, and there’s no commitment.

After signing up, create your first Instagram feed. From Instagram, you can gather and display:

Here’s a quick video on how to gather Instagram images and videos from any brand:

Would you like to show more than one account or hashtag, or mix Instagram content with content from another channel like TikTok? With Flockler, you can combine social media feeds from multiple accounts, hashtags or channels and display them all in one place. See the list of supported social media channels and content types that you can display together.

2. Choose the Instagram feed layout: Wall, Grid, Carousel, or Slideshow

Now that you’ve got the Instagram feed set up, the next step is to select a layout that fits your website's look & feel.

From the Display tab, you can create Social Walls, Grids, Carousels, and Slideshows. There’s no limit – you can create as many as you need.

Select an Instagram feed layout

After selecting the layout, you’ll get an embed code that you can add to your Joomla website.

An Instagram feed embed code example

3. Embed an Instagram feed on any Joomla page

The last step is to embed your Instagram feed on your Joomla website. For this tutorial, we will show you two different methods:

  1. Add an Instagram feed to any Joomla page
  2. Add an Instagram feed to all Joomla pages

1. Add an Instagram feed to any Joomla page

Often, Flockler customers display Instagram feeds on a dedicated social wall page or hashtag campaign landing page. Here’s how to add Flockler to your Joomla page:

  1. In the Joomla management, click 'Content', select 'Articles', and then click 'Add New Article'. 
    Adding a new article in the Joomla CMS
  2. In the article editor, add a title for your post and then click the 'Code' button in the toolbar. 
    Selecting 'Code' from the Joomla article editor toolbar
  3. A window opens with a field for the embed code. Go to Flockler’s Display tab and copy and paste the Instagram feed embed code into the field. Then click 'Insert'. 
    Adding an Instagram feed embed code to Joomla
  4. Then click 'Save & Close'. If you like, you can add the page to the site menu from Joomla’s menu editing tools. 
    Publishing a Joomla article with the Instagram feed embed code
  5. And finally, visit your website to view the beautiful Instagram feed!
An Instagram feed embedded on Joomla website


2. Add an Instagram feed to all Joomla pages

Joomla includes Modules that website developers can use to display Instagram feeds on dedicated areas all over the website. For example, you might want to show an Instagram feed on the website footer on all pages – Modules are the perfect solution for that!

Here’s how to add an Instagram feed with a custom Module:

  1. In the Joomla management, click 'Extensions' and select 'Modules'. 
  2. Then click the 'New' button. 
    Adding a new Module to Joomla
  3. From the list, select 'Custom'. 
    Selecting 'Custom' module on Joomla
  4. Then click the 'Code' button in the toolbar. 
    Selecting 'Code' from the Joomla Module editor toolbar
  5. A window opens. Copy and paste the Instagram feed embed code from Flockler to the field and click 'Insert'. 
    Adding an Instagram feed embed code to Joomla Module
  6. Give a title for the Module and select the position from the right. Here you might need the help of your website developer to make sure the Module shows up on all pages and that the selected position is not in use for another purpose.
  7. Finally, click 'Save & Close', and the Instagram feed is embedded on your Joomla website.

With Flockler, you can gather and display social media feeds from your favourite channels. See the full list of supported content types and sources

Flockler helps marketers like you to create social media feeds and display user-generated content on any digital service increasing dwell time and drive conversions.

Book a demo Start your 14-Day Free Trial
Start your 14-Day Free Trial