The article explains how to add an Instagram feed to WordPress without coding. We will see ways of embedding your custom feed, explore features and settings that you access with a user-friendly Instagram Feed widget.
Instagram feed is a handy and well-built free premium plugin for WordPress that allows you to integrate an interactive feed with content from this online media on your WordPress website. You are welcome to start forming your Instagram plugin right now through the use of our active demo. Simply follow the steps below and you’ll see your Instagram Feed:
Start using our active demo and build your first Instagram plugin.
Save your Instagram feed and copy the code from the popup window.
Embed the code to your WordPress website’s HTML editor.
Try building your live Instagram feed right now through the use of our demo!
Let’s explore how to create an Instagram Feed plugin for your WordPress website, step by step. This guide will walk you through the features and settings available in the plugin, helping you build a perfect Instagram feed. Visual aids are provided to help you replicate each step on your WordPress website.
Select your content. Start by finding the ‘Sources’ section in the left panel of the plugin settings. Here, you can easily connect your public or business Instagram account with just one click. Simply sign in, and your Instagram profile, along with its posts, will appear instead of the default sample content. Alternatively, you can curate a custom feed by adding a set of hashtags and profiles to display their content directly on your WordPress website.
Choose a layout. Continue customizing your Instagram feed by navigating to the ‘Layout’ tab in the left panel. This is where you can choose a layout that best suits your WordPress website’s design. Adjust various parameters to ensure your Instagram posts are displayed optimally for your visitors.
Pick elements. In the ‘Post’ tab, you’ll find numerous options to refine your content. You can enable or disable features like likes, comments, text, CTA buttons, and more. Additionally, you can set on-click options and define popup patterns to enhance the user experience with the embedded Instagram feed on your WordPress website.
Set your colors. Once you’ve defined the elements for your Instagram posts, it’s time to give them a unique touch in the Instagram Feed plugin. Choose from pre-designed color palettes or customize your own colors for each element in the feed to match your WordPress website’s branding.
Select a language. In the ‘Settings’ tab, you’ll find a list of supported languages for the Instagram Feed plugin. Choose a language, and the widget’s elements will be instantly displayed in your selected language, ensuring a consistent experience for your WordPress website visitors.
Get an embed code. To display the Instagram feed on your WordPress website, click the ‘Add to website for free’ button, get an auto-generated code, and simply insert it into the desired location on your webpage. Detailed guidelines on embedding the Instagram Feed into WordPress are provided in the next section.
How to Add Instagram Feed Widget to Specific Page of Your WordPress Website
#1 via Pages
Explore the tutorials in our video concerning this popular method of embedding an Instagram feed into WordPress pages:
Or read the text manuals if that suits you better:
Go to WordPress website’s backend. Log in to your WordPress website’s backend and click on Pages.
Find the page you need to edit, click on the action button (…) and choose Edit:
Add code element to the page. In the editor, find where you’d like to show the widget and click on Add Block.
Then find and click Custom HTML:
Paste the installation code. Paste your installation code in the popup window and click Update to save changes:
#2 via Themes
Go to WordPress website’s backend. Log in to your WordPress website’s backend, click on Appearance and choose Themes:
Find the theme you need to edit, click on the action button (…) and choose Edit:
Add code element to the page. Go to Pages tab and choose the page you want to add the widget to.
Then click on the template on the right side:
In the editor, find where you’d like to show the widget and click on Add Block:
Then find and click Custom HTML:
Paste the installation code. Paste your installation code in the popup window and click Save to save changes:
How to Add Your Instagram Feed to All Pages of WordPress website
#1 via Theme Editor
Go to WordPress website’s backend. Log in to your WordPress website’s backend. Go to the Appearance tab in the left-hand menu and click Theme Editor:
Add the installation code. Choose the footer.php file in the right-hand menu of Theme Files, insert the code before the closing Body tag and press the Update File button:
#2 via Widgets
Go to WordPress website’s backend. Log in to your WordPress website’s backend. Go to the Appearance tab in the left-hand menu and click Widgets:
Choose the placement for the code. Open Custom HTML (1) in the Available Widgets list, choose one of the Footers in the drop-down menu, for example, Footer One (2) and click the Add Widget button (3):
Paste the installation code. Paste your installation code in the Content field and click Save to apply the changes:
#3 via Customize
Go to WordPress website’s backend. Log in to your WordPress website’s backend. Go to the Appearance tab in the left-hand menu and click Customize:
Add Custom HTML element. Choose Widgets in the left-hand menu:
Click Add a Widget at the bottom of menu and select Custom HTML in the menu appeared:
Paste the installation code. Paste your installation code to the Content field, click Done and press the Publish button to apply changes:
Useful Features of Instagram Feed Widget
Filters to display relevant galleries
Customize your gallery to display only the posts that align with a specific page or product. With the Elfsight widget, you can apply multiple filters to curate the ideal content grid. For example, you can showcase posts exclusively from your offline events or highlight content on trending topics.
Call-to-actions for more engagement
Add CTA buttons to your posts to drive specific actions and boost engagement. Whether it’s linking directly to a product page under a promotional post or encouraging users to attend an event, these buttons can be tailored to fit your strategy and business objectives. Each post can feature its own distinct call-to-action.
Unlimited branding opportunities
Elfsight offers extensive customization options to ensure your Instagram embed for WordPress reflects your brand’s identity. Whether you’re working with established brand colors or selecting a palette that suits your style and activities, our pre-designed color schemes and flexible settings allow you to create a gallery that’s uniquely yours.
Templates for Elfsight Instagram Feed Widget
The Elfsight Instagram Feed widget brings a range of fantastic features to your WordPress website. Here’s how you can customize your feed to stand out.
Discover a selection of beautiful, ready-made Instagram templates in the free demo. These templates can greatly enhance your website’s look. They are fully customizable and flexible, giving you the freedom to completely change the style of your Instagram gallery.
Instagram Carousel
The Carousel template from Elfsight provides an interactive and engaging way to embed your Instagram posts. Featuring a dynamic, circular format, this template transforms your Instagram feed into a lively carousel plugin, bringing a fun and engaging element to your WordPress website. By enabling users to scroll through the carousel, you encourage them to explore your Instagram content more thoroughly, which can lead to increased time spent on your WordPress pages and potentially higher conversion rates.
Single Instagram Post Widget
The Single Instagram Post Widget offers a targeted and effective way to showcase a specific Instagram post on your WordPress website. It’s ideal for highlighting content that conveys an important message or theme of your website or for promoting special offers and announcements. The widget is designed in a way to help you seamlessly embed the Instagram feed on your WordPress, ensuring a smooth and cohesive user experience.
Instagram Grid
Elfsight’s Grid template provides a clean and organized way to showcase your Instagram posts. The elegant square format is ideal for arranging photos and videos in a tidy grid. This layout is both visually attractive and practical, featuring a ‘Load More’ button that encourages visitors to explore more of your content. The grid template automatically updates with new Instagram posts, ensuring your WordPress website always displays your most recent content.
Hashtag Feed
An Instagram Feed offers a live showcase of user-generated content that highlights your brand’s activity. This genuine content acts as social proof, encouraging potential customers to trust your brand and take action, whether it’s making a purchase or reaching out for more information. With its advanced customization options, the Elfsight Instagram Feed widget provides endless opportunities to enhance your WordPress website, making your Instagram content a standout and engaging feature.
Discover these and many other ready-made designs in our outstanding Catalog of templates ⬇
Template Catalog
Explore 70+ Instagram Feed Templates
Check out more ready-made templates for any use case or build your own one!
Embedding an Instagram feed into your WordPress website is a strategic way to boost engagement and increase brand visibility. We’ve explored several methods to seamlessly incorporate this feature, emphasizing the simplicity and effectiveness of using the Elfsight Instagram Feed widget. This tool lets you effortlessly display dynamic, real-time content, making your website more engaging and interactive.
By following the best practices and tips we’ve discussed, you can ensure the Instagram Feed enhances the user experience, drives conversions with authentic content, and strengthens your social media integration. Whether your goal is to increase time spent on your website, boost conversions, or expand your follower base, the Elfsight Instagram Feed widget is a powerful WordPress solution to help you achieve these objectives.
FAQ
How to embed an Instagram feed to WordPress with Gutenberg?
Launch the Gutenberg Editor for Instagram feed integration. Click on the Add button located in the upper-right corner to access the capabilities of the Gutenberg editor, setting the stage for customizing your page with the Instagram feed.
Insert the Shortcode block. Start typing “short” in the search bar and choose the Shortcode block from the suggested options. This block will allow you to embed your Instagram feed.
Embed the shortcode. Right-click in the Shortcode block and select the Paste option to insert your Instagram feed’s shortcode.
Publish your changes. Click the Publish button in the upper-right corner, then click Publish once more to confirm your changes.
View your page. Select the View Page option to see how your Instagram feed plugin appears on your website. Your Instagram feed is now successfully embedded and displayed on your WordPress website.
How to embed an Instagram feed to WordPress with Elementor?
Launch the Elementor Editor for Instagram feed integration. Click on the Edit with Elementor button to access the capabilities of the Elementor editor, setting the stage for customizing your page with the Instagram feed.
Insert the Instagram Feed widget. Utilize Elementor’s drag-and-drop feature to place the Instagram widget in your desired location within the page layout.
Embed the code. Simply paste the Instagram feed’s installation code into the HTML Code box of the Elementor editor. After this step, click the Update button to save your changes and activate the Instagram feed on your page.
