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

ChatGPT
o
Perplejidad

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 enlace adhesivo.

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.

Consejo: Puede incrustar widget de historias de Instagram automáticamente en tu sitio web y mostrar tus historias de Instagram en segundos. Pruébalo ahora.

Image

Muestra automáticamente las historias de Instagram en tu sitio web

Genera e incrusta automáticamente historias de Instagram para desbloquear el potencial de ventas de tu sitio web.

7 días de prueba gratuita

Guía rápida: 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. Inscríbete for an Instagram story widget and a full Una plataforma de gestión de contenido generado por el usuario (UGC).
  2. Ir a Fuentes‘Manage accounts’ and press Añadir nueva cuenta.
  3. Toque ‘Add Instagram account’ and approve EmbedSocial’s connection to your Instagram.
  4. Volver a 'Fuentes' → 'Añadir nueva fuente' y pulsar Instagram.
  5. Elija @Historias as your source and pick your IG account from the list.
  6. Toque Crear widget, select your widget template, and design your widget.
  7. Copy the widget code from the Pestaña "Incrustar 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 CGU comprable 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.

También, 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 en Instagram.

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

Guía completa: How to embed Instagram Stories on website step by step

Here are the detailed steps to create an immersive Widget de historias de Instagram, 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 7 días de prueba gratuita so you can check out all our features before you commit.

Step 2: Add your Instagram account

Next, you have to navigate to Fuentes y pulsar Añadir nueva cuenta:

navigating to the social accounts section in embedsocial

Step 3: Approve the EmbedSocial connection to your Instagram

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

adding an instagram account to embedsocial

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 'Fuentes' → 'Añadir nueva fuente' and pressing Instagram:

adding instagram as a source in embedsocial

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:

selecting instagram stories as a source in embedsocial

Step 6: Create and design your widget

Once you tap Crear 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:

editing your widget in the embedsocial editor

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 Incrustar tab (top-left corner. Once there, click Copiar código:

copying the embedsocial widget 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:

¿Cómo incrustar UGC en Shopify?
shopify logo

Aquí te explicamos cómo incrustar UGC en sitios de Shopify:

  1. Accede a tu cuenta de Shopify después de copiar el código del widget incrustable en EmbedSocial;
  2. Navegue hasta el Páginas y haz clic en Añadir página;
  3. En el Contenido el código incrustable;
  4. Seleccione la página en la que desea que aparezca el código y pulse Guardar.
Steps to embed social media feed in Shopify
¿Cómo incrustar UGC en Squarespace?
Squarespace icon

Aquí te explicamos cómo incrustar UGC en sitios Squarespace:

  1. Copia el código del widget EmbedSocial e inicia sesión en tu cuenta de Squarespace;
  2. Elija la página en la que desea que aparezcan las reseñas;
  3. Haz clic en Añadir nueva sección y luego Añadir bloque donde desea mostrar el widget;
  4. En la lista de bloques, seleccione 'Embed‘;
  5. Haga clic en el bloque, seleccione ‘Fragmento de código", y haz clic en ‘Incrustar datos";
  6. Por último, en el cuadro de código, pegue el código de revisión copiado;
  7. Asegúrate de guardar y publicar los cambios en Squarespace.
embed a code snippet in squarespace
¿Cómo incrustar UGC en Wix?
Wix Logo

Aquí te explicamos cómo incrustar UGC en sitios Wix:

  1. Accede a tu editor Wix y elige la página y la ubicación para añadir el widget;
  2. Haz clic en el botón Icono "+". en la esquina superior izquierda para añadir un nuevo elemento;
  3. Encuentra el Embed & Social y pulse Código de incrustación;
  4. Pegue el código y pulse Actualizar.
embedding a code snippet in wix
¿Cómo incrustar UGC en Webflow?
Webflow logo

He aquí cómo incrustar UGC en los sitios Webflow:

  1. Después de crear el widget en EmbedSocial, inicie sesión en su cuenta Webflow;
  2. Vaya a la vista de edición de su sitio web dentro de Webflow;
  3. Elija Añadir elemento en Webflow y seleccione la opción Elemento "Embed;
  4. Arrástrelo y suéltelo donde quiera que aparezcan sus reseñas;
  5. En el campo de entrada, pegue el código EmbedSocial copiado.

How to embed Twitter in Webflow

¿Cómo incrustar UGC en Pagecloud?

He aquí cómo incrustar UGC en sitios Pagecloud:

  1. Después de copiar el código de EmbedSocial, inicia sesión en tu cuenta de Pagecloud cuenta;
  2. Comience a editar la página web en la que desea que aparezcan las reseñas;
  3. Desde tu perfil, pulsa Aplicaciones en el menú de la cinta de la izquierda y seleccione Incrustar;
  4. Pega el código de EmbedSocial en el campo emergente y haz clic en Ok para completar el proceso.
Embed Google reviews in PageCloud
¿Cómo incrustar UGC en Google Sites?

A continuación te explicamos cómo incrustar contenido generado por los usuarios en Google Sites:

  1. Una vez que hayas copiado el código del widget incrustable en EmbedSocial, accede a tu cuenta de Google Sites;
  2. Navegue hasta la página en la que desea incrustar el widget;
  3. Utiliza el Pestaña "Insertar en Google Sites y elige dónde quieres colocar el widget;
  4. Elige 'Insertadel menú y pegue el código copiado en el cuadro de diálogo;
  5. Haz click enSiguientey despuésInserte' para finalizar la incrustación.
adding an embeddable widget in google sites
¿Cómo incrustar UGC en Elementor?

A continuación te explicamos cómo incrustar UGC en Elementor:

  1. Inicie sesión y navegue hasta la página en la que desea añadir las reseñas;
  2. Pulse una sección vacía y elija la opción Bloque "HTML de la sección izquierda de la cinta;
  3. Arrástrelo y suéltelo en la página y pegue el código del widget en el campo vacío;
  4. Actualice y publique la página para ver el widget en directo.
pasting the widget code in elementor
¿Cómo integrar UGC en Notion?

A continuación te explicamos cómo incrustar UGC en Notion:

  1. Después de copiar el código del widget, conectarse a Notiony vaya a la página correspondiente;
  2. Escriba el /embed y, en la lista desplegable, elija el comando Opción "incrustar;
  3. Pegue la URL y haga clic en "Incrustar enlace para añadir sus opiniones a Notion.
embed Google reviews in Notion embed link
¿Cómo incrustar CGU en sitios web HTML?

Cómo incrustar CGU en sitios HTML

  1. Copie la reseña del widget EmbedSocial de la sección Pestaña "Incrustar en la esquina superior izquierda del Editor;
  2. Abra el archivo HTML de su sitio web, que puede ser una página nueva o una ya existente;
  3. Pega el código EmbedSocial copiado donde quieras que se muestren las opiniones.
Steps to embed Google reviews in a HTML website

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:

mind map showcasing the benefits of embedding instagram stories on website
  • 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.

Nota: You can display all story formats in one widget—reportajes fotográficos, historias en vídeo, 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:

embedsocial instagram stories widget landing page

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:

Conclusión: 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!

Consejo: Puede incrustar widget de historias de Instagram automáticamente en tu sitio web y mostrar tus historias de Instagram en segundos. Pruébalo ahora.

Image

Muestra automáticamente las historias de Instagram en tu sitio web

Genera e incrusta automáticamente historias de Instagram para desbloquear el potencial de ventas de tu sitio web.

7 días de prueba gratuita

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?

Sí. Con 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.


Autor

SEO y editor de contenidos @EmbedSocial 

¡SEO & Content Editor con amplia experiencia en ayudar a las PYMES a entender cómo establecer y nutrir su presencia en línea, escribir y editar entradas de blog útiles sobre sus productos y servicios, y construir, gestionar y optimizar sus sitios web para el éxito!