How to Embed Instagram Stories on Your Website? [Full Guide + Examples]

Embedding Instagram stories on websites is getting more popular these days since it’s a great way for brands to keep their website fresh and engage their visitors.

Plus, you can easily lead your Instagram followers to your website via link-in-bio apps or by simply adding your website link to your posts via a lien autocollant.

To add this Instagram content to your website, you need to use an Instagram website widget, which can be fully customized to your liking and updates automatically.

I’ll tell you all about that process in the sections below and why you need to do it as soon as possible. Plus, you’ll find the best tools and examples for it.

POUR INFO: Vous pouvez intégrer le widget Instagram stories automatiquement sur votre site web et afficher vos stories Instagram en quelques secondes. Essayez-le maintenant.

Guide rapide : Embed Instagram stories on your website in a few steps

Embedding Instagram stories on website pages is very simple with the right tools. For instance, when using EmbedSocial, you only have a few steps to follow:

1. S'inscrire for an Instagram story widget and a full Plate-forme UGC.
2. Aller à Sources → ‘Manage accounts’ and press Ajouter un nouveau compte.
3. Robinet ‘Add Instagram account’ and approve EmbedSocial’s connection to your Instagram.
4. Retourner à 'Sources' → 'Ajouter une nouvelle source' et tapez sur Instagram.
5. Choisir @Stories as your source and pick your IG account from the list.
6. Robinet Créer un widget, select your widget template, and design your widget.
7. Copy the widget code from the Onglet "Embed and paste it onto your website.

If you’re still unsure what to do, check out this interactive video of the process:

That’s all you had to do, and when you’re done, you’ll get something like this:

The above widget also includes our UGC commercialisable functionality, which helps your customers immediately navigate to your product pages to shop the look.

However, before you proceed, there are a few things to keep in mind for a successful Instagram story embed, which I outline below, and then you’ll also get the full guide.

What to know when you embed stories on Instagram?

Before you embed Instagram stories on your website, understand that Instagram’s API requires that your Instagram account be a Business or Creator account.

Having a professional Instagram account is necessary to authorize any third-party app—like EmbedSocial—to access and display your stories.

En outre, only active (live) stories from the last 24 hours can be pulled from Instagram. Archived and highlighted stories are not available via the API.

Lastly, once the connection is established, the system automatically fetches and updates your latest stories as long as they remain live sur Instagram.

Remarque : Unlike some competitors, EmbedSocial can connect directly to your professional Instagram account sans going through your Facebook page first. That said, you must already be logged into your Instagram account on desktop.

Guide complet : How to embed Instagram Stories on website step by step

Here are the detailed steps to create an immersive Widget Instagram stories, customize it, generate its embeddable code, and embed it on your website:

Step 1: Sign up for the EmbedSocial UGC platform

Before you do anything, you need an EmbedSocial account. Don’t worry, we also offer a Essai gratuit de 7 jours so you can check out all our features before you commit.

Step 2: Add your Instagram account

Next, you have to navigate to Sources et tapez sur Ajouter un nouveau compte:

Step 3: Approve the EmbedSocial connection to your Instagram

Once you do that, you have to tap ‘Add Instagram account’ and approve the connection:

Step 4: Add Instagram as a source in EmbedSocial

Now that Instagram is connected, it’s time to add a specific Instagram source, which you can do via 'Sources' → 'Ajouter une nouvelle source' and pressing Instagram:

Step 5: Choose @Stories as a source and choose your account

You will have to tap @Stories at this point and then select your connected IG account:

Step 6: Create and design your widget

Once you tap Créer un widget, you’ll be asked to choose a widget template and taken to the EmbedSocial widget editor.

There, you can change every little thing about your widget’s appearance, from layout to colors, fonts, and the elements your widget will include:

Step 7: Copy and paste the widget code on your website

Lastly, you just need to copy the embeddable widget code, which you can find in the Editor’s Embed' (Intégrer) tab (top-left corner. Once there, click Copier le code:

Naturally, the last step is to paste that code on your website. Below, I cover the process of doing that across all popular website builders and CMS platforms.

Video guide: How to embed an Instagram story widget easily

If you’d rather watch a video about how to embed Instagram feeds, here’s one:

How to add an Instagram wall to your website via different CMS platforms?

The process of pasting your Instagram story widget code is similar across all popular website builders. Here’s how to display Instagram posts across most of them:

Comment intégrer des contenus UGC sur Shopify ?

Voici comment intégrer des contenus UGC sur les sites Shopify :

1. Connectez-vous à votre compte Shopify après avoir copié le code du widget intégrable dans EmbedSocial ;
2. Naviguez jusqu'à la page Pages et cliquez sur Ajouter une page;
3. Dans le cadre de la Contenu le code incorporable ;
4. Sélectionnez la page où vous souhaitez que le code apparaisse et appuyez sur Sauvegarder.

Comment intégrer des contenus UGC sur Squarespace ?

Voici comment intégrer des contenus UGC sur les sites Squarespace :

1. Copiez le code de votre widget EmbedSocial et connectez-vous à votre compte Squarespace ;
2. Choisissez la page sur laquelle vous souhaitez que les avis apparaissent ;
3. Cliquez sur Ajouter une nouvelle section et ensuite Ajouter un bloc à l'endroit où vous souhaitez afficher le widget ;
4. Dans la liste des blocs, sélectionnez Emboîter‘;
5. Cliquez sur le bloc, sélectionnez ‘Extrait de code", et cliquez sur ‘Intégrer les données" ;
6. Enfin, dans la boîte de code, collez le code de révision copié ;
7. Veillez à enregistrer et à publier vos modifications sur Squarespace.

Comment intégrer un contenu UGC sur Wix ?

Voici comment intégrer des contenus UGC sur les sites Wix :

1. Connectez-vous à votre éditeur Wix et choisissez la page et l'emplacement pour ajouter le widget ;
2. Cliquez sur le bouton Icône "+" (+) dans le coin supérieur gauche pour ajouter un nouvel élément ;
3. Trouver le Embed & Social et tapez Code d'intégration;
4. Collez le code et appuyez sur Mise à jour.

Comment intégrer un contenu UGC dans Webflow ?

Voici comment intégrer des contenus UGC sur les sites Webflow :

1. Après avoir créé le widget dans EmbedSocial, connectez-vous à votre compte Webflow ;
2. Allez dans la vue d'édition de votre site web dans Webflow ;
3. Choisir de Ajouter un élément dans Webflow et sélectionnez l'option Élément "Embed;
4. Faites-le glisser et déposez-le à l'endroit où vous souhaitez que vos commentaires apparaissent ;
5. Dans le champ de saisie, collez le code EmbedSocial copié.

Comment intégrer un contenu UGC sur Pagecloud ?

Voici comment intégrer des contenus UGC sur les sites Pagecloud :

1. Après avoir copié le code EmbedSocial, connectez-vous à votre Pagecloud compte ;
2. Commencez à modifier la page web où vous souhaitez que les commentaires apparaissent ;
3. Tapez sur Apps dans le menu du ruban de gauche et sélectionnez Embed' (Intégrer);
4. Collez le code EmbedSocial dans le champ popup et cliquez sur Ok pour terminer le processus.

Comment intégrer des contenus UGC sur Google Sites ?

Voici comment intégrer des contenus UGC sur Google Sites :

1. Une fois que vous avez copié le code de votre widget intégrable dans EmbedSocial, connectez-vous à votre compte Google Sites ;
2. Naviguez jusqu'à la page où vous souhaitez intégrer le widget ;
3. Utiliser le Onglet "Insérer dans Google Sites et choisissez l'endroit où vous souhaitez placer le widget ;
4. Choisir 'Embarquer' dans le menu et collez le code copié dans la boîte de dialogue ;
5. Cliquez sur 'Suivantet ensuiteInsérer' pour finaliser l'intégration.

Comment intégrer des contenus UGC dans Elementor ?

Voici comment intégrer des contenus UGC dans Elementor :

1. Connectez-vous et accédez à la page où vous souhaitez ajouter les commentaires ;
2. Appuyez sur une section vide et choisissez l'option Bloc "HTML dans la section gauche du ruban ;
3. Faites-le glisser et déposez-le sur la page et collez le code du widget dans le champ vide ;
4. Mettez à jour et publiez la page pour voir le widget en direct.

Comment intégrer l'UGC dans Notion ?

Voici comment intégrer des contenus UGC dans Notion :

1. Après avoir copié le code du widget, se connecter à Notionet accéder à la page correspondante ;
2. Tapez le /embed et, dans le menu déroulant, choisissez la commande Option "Embed" (intégrer);
3. Collez l'URL et cliquez sur le lien "Embed link" (lien intégré) pour ajouter vos commentaires à Notion.

Comment intégrer des CGU sur des sites web HTML ?

Voici comment intégrer le CGU dans les sites HTML

1. Copiez la revue du widget EmbedSocial à partir de la section Onglet "Embed dans le coin supérieur gauche de l'éditeur ;
2. Ouvrez le fichier HTML de votre site web, qu'il s'agisse d'une nouvelle page ou d'une page existante ;
3. Collez le code d'intégration EmbedSocial copié à l'endroit où vous souhaitez que les commentaires s'affichent.

Why display Instagram Stories on your website?

When you add an Instagram wall to your website that includes Stories, posts, videos, etc., you boost your user engagement and reap additional benefits:

• Show real-time content updates—keep your website lively with automatic story syncs that display your latest events, launches, or behind-the-scenes moments;
• Increase user engagement—bring the familiar story format to your website to captivate visitors with interactive stickers, visuals, and short-form storytelling;
• Ensure a unified branding experience—extend your Instagram aesthetic and tone to your website, creating a seamless experience across both platforms;
• Reach more people and drive social media growth—turn website visitors into Instagram followers by promoting your active story feed on your site;
• Maximize return on content creation—give your stories a longer life by showcasing them beyond Instagram’s 24-hour limit and ensuring more people see them;
• Re-use your Instagram story—repurpose your best stories directly on your site using a professional widget that helps you manage and display them;
• Turn stories into a new ad format—use your embedded stories like digital banners to highlight campaigns or feature promotions across partner sites and web portals;
• Expand your story’s reach—display stories to audiences who may not follow you on Instagram, unlocking new exposure opportunities and driving engagement;

You showcase more than just your content when you embed Instagram posts or stories on your website. You connect your social storytelling with your brand’s digital presence, driving consistent engagement across every channel you own.

Remarque : You can display all story formats in one widget—photo stories, video stories, and even combine them with a Pinterest Pin stories feed into a single interactive widget.

Why use EmbedSocial to add Instagram story widgets to your website?

If you want to make embedding Instagram stories effortless, automated, and fully customizable, you need a platform like EmbedSocial that optimizes your workflow:

Here’s why it’s the preferred solution for brands and creators:

• Official Instagram API connection—EmbedSocial connects directly to Instagram’s official API, ensuring your stories are always fetched in real time;
• Automatic story updates—new stories sync automatically every 24 hours, keeping your website content fresh without manual uploads;
• Customizable widgets—adjust layout, size, colors, and fonts to perfectly match your website design and brand identity;
• Responsive design—widgets look great on all devices, automatically adapting to desktop, tablet, and mobile screens;
• Multiple display options—choose between popups, sliders, carousels, or grids to showcase your stories in different styles;
• All-in-one content hub—combine stories from multiple Instagram accounts or mix photo, video, and other story formats in a single Instagram feed;
• Cross-platform compatibility—works seamlessly with popular website builders like WordPress, Shopify, Wix, and Squarespace;
• Advanced analytics—track story views and engagement metrics directly from your EmbedSocial dashboard to measure performance.

As you can see, with EmbedSocial, embedding an Instagram stories feed is a one-time setup with several benefits: saving time, improving design, and increasing engagement.

Plus, you can create and add an Instagram wall to your website that contains more than your Stories. You can combine them with Reels and posts as well.

Instagram Story widget examples

EmbedSocial offers several ready-to-go Instagram Story widget templates that you can fully adapt for your needs. Or, you can even create a new template from scratch.

Here are some of the Instagram story embed widgets we offer:

Conclusion : Maximize your Instagram stories’ reach beyond 24 hours!

Embedding Instagram stories on your website helps you extend their visibility and keep your audience engaged even after they disappear from the app.

When you connect your social presence with your website in this manner, you give visitors fresh, dynamic content to explore that updates on its own.

That is, if you sign up for a platform like EmbedSocial that automatically syncs, customizes, and displays your stories anywhere online without any coding.

So, if you’re looking to save time and get more value from every story you create on your Instagram account, embed Instagram stories widget on your website.

Expand the reach of your Instagram stories today with EmbedSocial!

POUR INFO: Vous pouvez intégrer le widget Instagram stories automatiquement sur votre site web et afficher vos stories Instagram en quelques secondes. Essayez-le maintenant.

FAQs about embedding Instagram stories on a website

How to embed Instagram stories on a website?

You can embed Instagram stories on a website using tools like EmbedSocial. Simply connect your Instagram business account, start collecting your IG Stories, design your embeddable widget, generate an embed code, and paste it into your site’s HTML.

How do you embed Instagram Stories on a WordPress website?

You can embed Instagram stories on a WordPress page by copying the embed code from your EmbedSocial widget and pasting it into an HTML block. The widget will automatically display your latest stories and update whenever new ones are posted.

Can I embed multiple types of content in one social media feed?

Oui. Avec EmbedSocial, you can mix stories with Instagram photos, videos, and even Pinterest Pins in a single widget, creating one unified and interactive social media feed.

Can I embed Instagram Stories without a Business account?

No. To embed Instagram stories on a website, you need a Business or Creator account connected to a Facebook Page. This is required by Instagram’s API to authorize third-party apps like EmbedSocial to access and display your stories.

Can I embed Instagram Stories from other users?

No. Instagram’s API does not allow you to embed stories on Instagram from other users. You can only embed and display stories from your own connected account. However, you can manually upload public stories (with permission) and recreate them in your widget using EmbedSocial’s customization options.

How to embed Instagram story highlights?

Instagram’s API doesn’t currently allow third-party tools to collect or embed story highlights directly. However, with EmbedSocial, you can recreate your Instagram highlights by manually selecting and uploading your stories to display them via a custom Instagram widget. This has the same effect and keeps your best stories visible beyond the 24-hour limit.

Why can’t I embed older Instagram stories?

Instagram only allows embedding live stories from the last 24 hours. Archived stories can’t be synced automatically due to Instagram’s API restrictions, but you can manually upload and display them using a story embed tool like EmbedSocial.