Video has become the most sought-after type of content on the internet, and with Instagram Videos, you can push your audience engagement to the next level with both short-form and long-form videos that keep viewers coming back for more.
But if you want to take full advantage of the videos you produce, displaying them on your website is a must.
Cross-promoting your content across platforms gives your brand a significantly broader reach – growing your audience and ultimately boosting your sales. In short: This means more impact for your efforts!
In this tutorial, I’ll show you how you can quickly and easily display Instagram videos on your website.
Note that as of late 2021, Instagram combined IGTV and normal video posts into a single format called “Videos”, so when we mention videos below, we’re referring to the old IGTV format as well.
Let’s get to it!
How to Embed Instagram Videos on Your Website
If you’re looking to just embed a single Instagram video on your website, it’s a pretty simple process. If you’d like to display multiple Instagram videos without manually embedding each one – which you can do very easily with Spotlight PRO – skip to the next section.
In this example, I’d like to add a single video to my home page.
In order to do this, I’m going to go to my Instagram from my computer. As long as I’m logged in, I will be able to navigate to the video section and from there, find the specific video I want to embed.
Note: At the time of writing this tutorial, I was only able to generate Embed codes for public profiles.
Next, I’ll click the three-dot menu in the top right corner of the post, and choose “Embed”.
Then, I can easily copy the embed code and paste it into my website’s HTML editor.
The final result looks like this:
Now, let’s talk about how to embed multiple Instagram videos!
Step 1: Connect your account
If you’ve got Spotlight PRO installed and activated on your WordPress website, you’re ready to go! But first, you’ll want to connect your Instagram Business account.
This allows you to:
- Put usable links in your captions.
- Display Instagram videos where you are tagged.
- Showcase Instagram videos based on hashtags (including posts by other users) with Spotlight PRO.
After authorizing Spotlight to access your Instagram media, Spotlight will allow you to choose from one of the pre-made templates. You can also choose to design your own feed.
In this case, I chose the Brick template.
Then, you’ll want to select the Business account you’re going to use from the “show posts from these accounts” section. Your Instagram posts will populate within a few seconds.
Once the desired account is selected, you’ll want to navigate over to the Design tab.
Step 2: Design your video feed
Here you can modify the design of your feed. You can choose from slider, grid, or other layout types to display your videos according to your needs.
The Masonry layout (enabled when I chose the Brick template) adapts to show each video in its full size – whereas Slider, Grid, and Highlight display all posts as squares.
To show your video content exclusively, head over to the Feed section and select “All videos only”.
To show like and comment counts on hover, scroll down to Appearance > Show on hover and select the items you wish to see:
Now, I want my posts to open up in a lightbox with a sidebar with the caption displayed.
Scroll down to Popup box > Show sidebar to enable this feature.
Now I am going to look at filtering and moderation, but before I do that, I’d like to make sure my feed is ready for tablets and mobile devices.
Spotlight is completely responsive by default, but it also lets you choose specific layouts for different devices.
At the top of the Design tab, select the icon for the device you want to adjust. The live preview customizer will adapt to the screen size to give you a preview of what your layout will look like.
Step 3: Filter and moderate your video feed
One of the best things about Spotlight PRO is an absolutely essential feature: Filtering and moderation. This lets you filter your feed to make sure only the content you choose gets displayed to your site visitors.
In this case, I’ve chosen to hide videos with the hashtag #city.
Now, if you click on the Moderate tab, you can scroll through your feed to find those posts featuring landscapes. I’ve selected ‘Only show the selected posts’ in order to highlight only the ones I want to display.
Step 4: Embed your video feed
The only thing left to do is embed your feed! Use the generated hashtag or the dedicated widget to do this, and you’re good to go.
For my site, I’m using popular page builder Elementor, which integrates perfectly with Spotlight. To add a feed to any section, all you need to do is use the dedicated widget and drag and drop it to the desired location. Next, simply select the feed you want to show from the dropdown menu.
The end result
There you have it! The feed is now live and completely responsive.
Switching to mobile view, the layout automatically changes to show 6 Instagram videos.
Clicking on a specific post opens up the image in a lightbox with the caption and like count showing in the sidebar.
Conclusion
Videos are some of the most engaging types of content out there, and showcasing them on your website lets you make the most of the content you produce.
Video posts are already more high-impact, so why not take advantage of this? Plus, broadening your reach by embedding them on your website ultimately leads to more sales.
With Spotlight PRO you can now showcase your videos on your website in no time at all.
Have you used Spotlight PRO to display videos? Let us know in the comment section below.
