Transform your WordPress website by seamlessly integrating an Instagram feed. This is an excellent way to share fresh and engaging content with your visitors and helps keep your website dynamic by showing live updates from your Instagram account. This guide walks you through each step, from installing the right plugin to embedding the feed on your pages. By the end, you’ll have a customized Instagram feed that fits perfectly with your website design.
Step-by-Step Guide to EASILY Embed in WordPress
Let’s start our guide step by step. We’ll keep it super easy to follow. Whether this is your first time or you’ve done it, this guide will clearly show you each step. Let’s get going and make it easy for you!
How to Add a New Plugin in WordPress to Embed Instagram Feed
Start by going to your WordPress dashboard. Hover your mouse over the Plugins menu on the left side of the screen. Next, click on Add New to open the plugin library. This is where you can find and install an Instagram feed plugin to easily show your Instagram posts on your website. This feature helps to make your site more engaging with live content.
Search and Install the Instagram Feed Plugin
Find the search bar on the top right of the Add Plugin page. Type Spotlight to locate the plugin. When you see the prompt, confidently click the “Install Now” button to get started. The Spotlight plugin helps you show Instagram photos and connect your account quickly. After installation, you will be ready to set up the feed on your website.
Activate the Instagram Feed Plugin
Once you install the plugin, the Install Now button changes to Activate. Click on Activate to unlock the full features of the Spotlight plugin. This activation step is necessary to display your Instagram feed on your website. After activating, you can set up and customize how the feed appears on your WordPress site.
Open Instagram Feed Settings
In the WordPress dashboard, find and click on Instagram Feeds on the left menu. This option opens the plugin settings, where you can connect your Instagram account and manage how your Instagram photos will appear on your website. You can customize and choose how the feed fits your site design.
Create a New Instagram Feed
To create a new feed, select My Instagram Posts from the options. This lets you display photos, videos, or reels from your connected Instagram account. Once selected, click on Next Step to proceed. You can then set up how the Instagram feed will look on your website, giving your visitors easy access to fresh content.
Pick an Instagram Feed Template
Choose a template that fits your website style. For example, you can pick the Classic template to show your Instagram feed in a simple, neat layout. Once you choose a template, click Next Step to continue setting up your feed. This lets you match the feed’s look to your website’s theme.
Connect and Customize Your Instagram Feed
Click Connect & Customize to link your Instagram account and set up your feed. This step lets you choose how the feed will look on your website. You can pick from various settings to make the feed match your site design and style. After connecting, you can see your Instagram posts live on your WordPress site.
Connect Your Instagram Account
To finish setting up, click on Connect Your Account. This step links your Instagram account to your WordPress website. Connecting lets you automatically display all your latest Instagram posts on your site. This updates your visitors with fresh and engaging content directly from your feed.
Log in to Your Instagram Account
Enter your Instagram us:
- To connect your account, please enter your email address in the first box. Type your password in the second box.
- Click on login to access your Instagram account.
His step is needed to show your Instagram posts on your website. Once logged in, your feed will automatically update with new photos and videos.
Allow Access to Your Instagram Account
When prompted, click Allow to give the Spotlight plugin permission to access your Instagram account. This step lets the plugin receive your profile information and display your Instagram feed on your website. By granting permission, you enable the plugin to pull in the latest updates from your account automatically.
Confirm Instagram Account Connection
After you successfully connect your Instagram account, a confirmation message will appear. Click No later if you do not want to add more features immediately. This step finalizes the connection and lets your Instagram feed show on your WordPress website. Your visitors can now see all the latest posts directly on your site.
My Instagram Account is Now Connected
Your Instagram account is now attached and visible in the plugin. Your Instagram username is at the top, confirming your account is connected. All your latest posts will automatically show in this feed on your WordPress site. This helps you update your visitors with fresh and relevant content from your Instagram profile.
Customize Your Instagram Feed Design
Click on a design to change the look of your Instagram feed. Here, you can select different styles and layouts to match your website. Adjust the design options to display your Instagram posts in a way that fits your site’s theme. This lets you personalize how your feed appears to your visitors.
Adjust the Instagram Feed Layout
In the Layout section, you can set the number of posts and columns to display on a single page. Choose how many Instagram posts to show and the number of columns for the feed. This helps you control the appearance of your feed, making it fit perfectly with your website layout. Adjust these options to give your visitors a great viewing experience.
Set Instagram Feed Options
In the Feed Options section, you can choose how to sort your posts and where they open. Pick a post order, like newest or oldest first, and decide if the posts should open in a popup box or a new tab. These options let you control how visitors interact with your Instagram feed on your website. Customize these settings to create the best experience for your audience.
Customize Instagram Feed Appearance Settings
In the Appearance Settings section, you can change how your Instagram feed looks. You can adjust the feed width, height, padding, image size, and more. You can also change the background color and set what shows when someone hovers over the feed. These settings let you match the feed design with your website style, making it more engaging for visitors.
Embed Your Instagram Feed on the Website
Once you’ve made all the changes, click ‘Embed’ to insert the Instagram feed into your WordPress website. This step places the feed directly onto your site pages, allowing visitors to see your Instagram posts in real-time. Embedding the feed helps you keep your website fresh with the latest updates.
Save Your Instagram Feed Setup
Click “Save” to keep all your changes and updates to the Instagram feed. This step secures all your customizations, ensuring the feed displays how you want it on your website. Once saved, the feed will be ready to show live updates from your Instagram profile.
Name and Save Your Instagram Feed
Type a memorable name into the Feed Name box for your Instagram feed. This helps you recognize it later if you create multiple feeds. After entering the name, click on Save to complete the setup. Naming your feed keeps it organized and easy to manage within your WordPress site.
Copy Instagram Feed Shortcode
Scroll down to find the shortcode section. Once there, click on Copy to save the shortcode. You can use this shortcode to display the Instagram feed on any page or post of your WordPress website. This step lets you embed the feed wherever you want it to appear.
Open Your Website with Elementor
Go to your website’s home page and click Edit with Elementor at the top. This will open the Elementor editor, where you can easily add and customize your content. Elementor also lets you place the Instagram feed shortcode on any section of your page.
Add a Container to Your Page
To create space for the Instagram feed, click the + icon in Elementor. This adds a new container to your home page to place the feed shortcode. Adding a container helps you organize your page layout and keep content structured.
Select a Structure for the Container
After adding a container, choose a structured layout that fits your design. From the choices in Elementor, click on the layout option you want to use. Selecting a structure determines how your page’s Instagram feed and other content display.
Add Shortcode Widget to Your Page
In Elementor, search for shortcode in the widgets section. Drag and drop the Shortcode widget into the container you added earlier. This widget lets you paste the Instagram feed shortcode and display your feed on the page. Using the shortcode widget is a simple way to embed your feed exactly where you want it.
Paste the Instagram Feed Shortcode
Click on the Shortcode widget you added. Paste the shortcode you copied during the plugin setup in the left panel. This will display your Instagram feed on the selected part of your page. After pasting, click on Apply to update the changes. This step ensures visitors can see your Instagram posts directly on your website.
Publish Your Instagram Feed on Your Website
After adding the shortcode, click on Publish to save all your changes. This step makes your Instagram feed live on your website, allowing visitors to see your posts instantly. Publishing confirms that your feed is successfully embedded and ready to show updates.
Check Your Website to View the Instagram Feed
Open your website in a new tab and scroll down the homepage to check if your Instagram feed is visible. You should see your posts, confirming that your feed is live for visitors.
Conclusion
Integrating an Instagram feed into your WordPress website is simple with the proper steps. This guide teaches you how to install the plugin, customize your feed, and publish it live on your site. Now, your visitors can enjoy real-time Instagram updates, making your website more engaging and interactive. Keep exploring different layouts and designs to make your feed match your site’s style and enhance the visitor experience.
About Author
This article was written by Haider Aftab Abbasi. If you’re looking for more insightful content or professional collaborations, feel free to connect with Haider on LinkedIn using the provided link.
