All Collections
Basics
How to add Flockler to Webflow
How to add Flockler to Webflow

Flockler is easy to add to Webflow. Gather content, select your layout, and embed Flockler to any page.

Toni Hopponen avatar
Written by Toni Hopponen
Updated over a week ago
An Instagram feed embedded on a website

Embedding a social media feed to any Webflow page takes a few minutes.

Here’s a three-step guide on how to do it:

  • Step 1: Collect content from Instagram, Facebook, X (formerly Twitter), YouTube, and more

  • Step 2: Select a layout: Wall, Grid, or Carousel

  • Step 3: Add Flockler’s embed code to any Webflow page

Step 1: Collect content from Instagram, Facebook, X (formerly Twitter), YouTube, and more

If you’re just getting started with Flockler, start by adding some content to your Flockler account. If you already have content, skip to step 2.

The best way to add content to your Flockler account is to create an automated feed. Click ‘Feeds’ in Flockler’s navigation and create at least one automated feed (see the list of content sources).

Here’s a short video on how to create an Instagram hashtag feed:

Step 2: Select a layout: Wall, Grid, or Carousel

After adding content to your Flockler, the next step is to click ‘Display’ in Flockler’s navigation. Flockler has three different layout options (Wall, Grid, and Carousel) to embed on any Webflow page. Select one of the layouts, and you’ll get an embed code.

Flockler’s embed code layouts

Here are examples of the layouts:

Wall

Flockler’s wall layout

Grid

Flockler’s grid layout

Carousel

Flockler’s carousel layout

Step 3: Add Flockler’s embed code to any Webflow page

The last step is to add Flockler’s embed code to Webflow. Please note that you’ll need a paid plan of Webflow to add any third-party widget.

Select an area where you’d like Flockler to display. Then click the + icon, scroll down to the Components section, and select the ‘Embed’ button.

An editor of the Webflow CMS

After selecting the ‘Embed’ component, an editor opens up. Add the embed code from Flockler’s Display tab to the editor and save changes.

Embedding a script code to Webflow

Then publish the changes to your Webflow site, and the Flockler layout shows up on your page.

Did this answer your question?