Docs    Instagram

Cómo insertar el feed de Instagram en Elementor

Si tu sitio web utiliza Elementor como constructor de páginas, puedes insertar un feed de Instagram de Smash Balloon en cualquier página sin necesidad de modificar el código ni pegar códigos cortos. Instagram Feed Pro incluye un widget específico para Elementor que aparece en el panel de widgets junto al resto de elementos de Elementor. Solo tienes que arrastrarlo a una sección, seleccionar qué feed quieres mostrar en el menú desplegable y el panel de vista previa se llenará al instante con tus publicaciones reales de Instagram.

Esta guía explica cómo añadir el widget «Feed de Instagram» a una página de Elementor por primera vez.

Esta función está disponible tanto en el plugin gratuito Instagram Feed como en Instagram Feed Pro. El widget específico de Instagram Feed para Elementor se incluye en el plugin gratuito a partir de la versión 6.11.0, por lo que no necesitas la versión Pro para arrastrar tu feed a una página de Elementor. La versión Pro ofrece tipos de feed adicionales (por hashtag, publicaciones etiquetadas) y opciones de personalización que el widget integrado mostrará posteriormente.


Antes de empezar

Asegúrate de que tu sitio web cumpla dos requisitos:

  1. La aplicación Instagram Feed (gratuita o Pro) debe estar instalada y activada en la versión 6.11.0 o superior, que es cuando se añadió el widget de Elementor. La mayoría de las instalaciones ya cumplen este requisito.
  2. Tu cuenta de Instagram está conectada como fuente en «Feed de Instagram», «Configuración», «Fuentes».
  3. Ya existe al menos un feed en «Instagram Feed, All Feeds». El widget de Elementor selecciona los feeds que ya has creado en el panel de administración de Smash Balloon; no crea nuevos feeds. Si aún no has creado ninguno, sigue primero la guía paso a paso para crear un feed y luego vuelve aquí.

Si ambos están instalados, el widget «Feed de Instagram» aparecerá en el panel de widgets de Elementor en cuanto abras una página para editarla.


Paso 1. Abre tu página en Elementor

En la barra lateral del panel de administración de WordPress, ve a «Páginas», selecciona la página en la que quieres incluir el feed y haz clic en «Editar con Elementor». Se abrirá el editor de Elementor con el panel de widgets a la izquierda y una vista previa en tiempo real de tu página a la derecha. En la parte superior del panel de widgets hay un cuadro de búsqueda llamado «Buscar widget», donde encontrarás el widget de Smash Balloon.

Cómo integrar Instagram Feed Pro en Elementor — Paso 1
El editor de Elementor con el panel de widgets a la izquierda. El campo de búsqueda del widget situado en la parte superior es la forma más rápida de encontrar el widget «Feed de Instagram».

Paso 2. Busca el widget del feed de Instagram

Haz clic en el campo del widget de búsqueda y escribe «instagram». La lista de widgets se filtra a medida que escribes, y el widget «Instagram Feed» (con el pequeño icono de Instagram) aparece en la parte superior de los resultados. Se trata del widget específico de Smash Balloon, no de la función integrada de Elementor para insertar contenido de Instagram.

Cómo integrar Instagram Feed Pro en Elementor — Paso 2
El panel de widgets filtrado por Instagram. El widget «Feed de Instagram» es el de Smash Balloon con el icono de la cámara.

Arrastra el widget «Feed de Instagram» desde el panel hasta la sección de la página donde quieras que aparezca el feed. Elementor resalta las zonas de colocación a medida que arrastras el widget, por lo que puedes soltarlo dentro de un contenedor ya existente o como una nueva sección. El panel de configuración del widget se abre automáticamente una vez colocado.


Paso 3. Elige tu feed

El panel de configuración del widget se divide en dos pestañas: «Contenido » y «Avanzado». En la pestaña «Contenido» encontrarás el grupo «Configuración del feed de Instagram », con una única opción en la parte superior: «Seleccionar un feed». Haz clic en el menú desplegable y elige el feed que quieras mostrar. Todos los feeds que hayas creado en «Instagram Feed» y «Todos los feeds» aparecen aquí por su nombre.

Cómo integrar Instagram Feed Pro en Elementor — Paso 3
Configuración del widget «Feed de Instagram»: elige cuál de tus feeds guardados deseas insertar en el menú desplegable «Seleccionar un feed»

En cuanto elijas un feed, el panel de vista previa de la derecha se actualiza y muestra las publicaciones reales de Instagram que recoge ese feed. Se conservan el estilo, el diseño, el encabezado y cualquier personalización que hayas configurado en el personalizador de Smash Balloon; Elementor muestra el feed exactamente como aparecería en una página que no esté creada con Elementor.

Haz clic en «Publicar» (o en «Actualizar», si estás editando una página existente) en la parte inferior izquierda del panel de Elementor para guardar la página. El feed de Instagram ya está activo en cualquier lugar donde los visitantes puedan ver la página.


¿Puedo colocar el widget en una columna dentro de una sección?

Sí. Elementor te permite arrastrar el widget a cualquier columna, contenedor o sección de ancho completo. El feed se adapta al ancho que le asigne la columna principal.

¿Se mantendrá sincronizado el feed que he elegido si más adelante cambio la configuración en el personalizador de Smash Balloon?

Sí. El widget muestra el feed que hayas seleccionado, con todo el estilo definido en la configuración del personalizador de ese feed. Si más adelante actualizas el diseño, el encabezado o el recuento de publicaciones del feed en «Instagram Feed» o «All Feeds», la versión integrada en Elementor se actualizará automáticamente.

¿Puedo añadir varios feeds de Instagram a una página de Elementor?

Sí. Coloca el widget varias veces en diferentes secciones y elige un feed distinto para cada una. Esto resulta útil cuando quieres incluir una cuenta destacada en la parte superior de la página y un feed de hashtags más abajo.

¿Por qué no veo el widget del feed de Instagram en el panel?

La causa más habitual es que la versión del plugin Instagram Feed esté desactualizada. El widget de Elementor se añadió en la versión 6.2.9, por lo que las instalaciones más antiguas no lo tendrán. Actualizar Instagram Feed (gratuito o Pro) a la última versión soluciona el problema. Por supuesto, el plugin también debe estar activado.

¿Este widget funciona con Elementor Free o solo con Elementor Pro?

El widget «Feed de Instagram» funciona en ambos. No necesitas Elementor Pro para utilizarlo.

¿Puedo configurar el estilo del feed desde Elementor en lugar de desde el personalizador de Smash Balloon?

No. El diseño del feed (encabezado, maquetación, colores, número de entradas) se controla mediante el personalizador de Smash Balloon para cada feed guardado. La función de Elementor es la ubicación: en qué parte de la página aparece el feed.

soporte

¿No ha encontrado la respuesta en los documentos?

Contacto

¿Le ha resultado útil este artículo?