Skip to main content

How to create and display Instagram feeds on your store

After connecting your Instagram account with Mageplaza Instagram Feed, you need to create and display the feed on your storefront. Here’s how to do it.

In Mageplaza Instagram Feed, access Manage feed > Create new feed to add a feed.

I. Feed settings:​

Step 1: Configure feed information

  • Feed name: Add a name for the feed.
  • Feed status: Set the feed status by clicking on the switch button.
  • Feed ID: This field is generated only when you successfully create and save the feed.

Step 2: Customize posts fetched from your Instagram account

  • To update bulk posts, click on the Select all checkbox > choose Show all or Hide all.

  • To show/hide a specific post, click on the eye icon on this post.

Step 3: Select the Next button at the top right corner to save the information.

II. Layout settings​

Select the layout types to show the Instagram posts on your store.

  • Grid: Images will be displayed in rows and columns

  • Slider: images will be displayed in a horizontal slider

III. Advanced settings:​

Device to show:

  • Desktop: Display the desktop illustration.

  • Mobile: Display the mobile illustration

Heading:

  • Text box: Enter the heading text.
  • Text size: Update the heading size* by entering the numbers or using up and down arrows.
  • Font: select the font for the heading.
  • Text color: Select the text color on the palette or enter the color code.
  • Checkbox: Tick the checkbox to show/hide the heading.

Available value: 10/11/12/13/14/15/16/20/24/32/36/40/48/64/96

Subheading:

  • Text box: Enter the subheading text.
  • Text size: Update the subheading size* by entering the numbers or using up and down arrows.
  • Font: select the font for the subheading.
  • Text color: Select the text color on the palette or enter the color code.
  • Checkbox: Tick the checkbox to show/hide the subheading.

Available value: 10/11/12/13/14/15/16/20/24/32/36/40/48/64/96

Number of posts: enter the number of images/posts you want to show on the feed (up to 50 posts).

On post click action: Allow customers to reach Instagram posts directly.

  • Do nothing: Do not show anything when customers click on any images.
  • Open post pop-up: Open the popup showing the posts when customers click on any images.
  • Redirect to Instagram: Redirect customers to an Instagram post when they click on an image.

Columns: Number of post columns on the feed (available on Grid and Slider).

Rows: Number of post rows on the feed (only in Grid).

Post spacing: Distance unit (px) you want to custom among posts.

Button text: Change the content of the button to see more posts.

Border radius: Change roundness of the button.

Background color: Change the background color of the button.

Text color: Change the text color of the button.

Click the Save button to save the feed customization.

Then, a popup will show the feed information. Kindly copy the Feed ID to customize the media position and click on Preview on OS 2.0 theme to check the feed on your shop.

In the Shopify App embeds, active Mageplaza Instagram Feed application and save the change.

On the theme, choose a destination to place the Instagram feed and paste the feed ID. You can add many feeds on the theme.

Click on the Save button to save the Instagram feed and check the result on the storefront.

After configuring Feed, Layout, and Advanced settings, you have successfully finished creating and showing Instagram feeds on the store. Remember to fill out each field carefully for a perfect outcome.