Cómo incrustar un feed de grupo de Facebook en WordPress
Publicado: 2022-12-07¿Quieres incrustar publicaciones de un grupo de Facebook en tu sitio web de WordPress?
Promocionar su grupo de Facebook en su sitio de WordPress es una excelente manera de obtener más participación y aumentar sus seguidores. El contenido de su grupo también puede ayudar a mantener su sitio actualizado, incluso para los visitantes regulares.
En este artículo, le mostraremos cómo agregar fácilmente un feed de grupo de Facebook en WordPress.

¿Por qué agregar contenido de grupo de Facebook a su sitio de WordPress?
Los grupos de Facebook pueden ayudarlo a construir una comunidad, crear un sentido de lealtad y construir una relación positiva con sus usuarios. Después de que se unan a su grupo, puede promocionar publicaciones de blog, actualizaciones de la empresa o incluso productos de WooCommerce para estas personas sin tener que gastar dinero en anuncios en línea.
Nuestro grupo de Facebook WPBeginner Engage tiene más de 89 mil usuarios activos y está creciendo a un ritmo increíble.

Después de crear su grupo de Facebook, querrá promocionar ese grupo y llevar a la gente a él. La mejor manera de hacer crecer su grupo de Facebook es incrustando el feed del grupo en su sitio web de WordPress.
De esta manera, las personas que visitan tu sitio pueden ver todo el excelente contenido que publicas en Facebook. Esto los alentará a ver su grupo, interactuar con su contenido y tal vez incluso hacer clic en el botón 'Unirse'.
Después de incrustar el feed del grupo en su sitio, las nuevas publicaciones aparecerán en su sitio web automáticamente. Esto lo convierte en una manera fácil de mantener su sitio actualizado, incluso para los visitantes habituales.
Con eso en mente, veamos cómo incrustar un feed de grupo de Facebook en WordPress.
Cómo instalar un complemento de feed de Facebook personalizado
La mejor manera de incrustar un feed de grupo de Facebook en WordPress es usando el complemento Smash Balloon Custom Facebook Feed.
Este complemento le permite incrustar álbumes de Facebook, comentarios, reseñas, publicaciones de la comunidad y más en su sitio web de WordPress.

Si incrusta videos en WordPress, Smash Balloon les permite a los usuarios ver esos medios sin tener que visitar Facebook, al abrir una ventana emergente de caja de luz directamente en su sitio web.
En esta guía, usaremos la versión pro de Smash Balloon, ya que le permite mostrar álbumes, videos y fotos de Facebook en su sitio web de WordPress. Sin embargo, también hay una versión gratuita que te permite incrustar fácilmente publicaciones de estado de Facebook en WordPress, sin importar tu presupuesto.
Lo primero que debe hacer es instalar y activar el complemento Feed de Facebook personalizado de Smash Balloon. Para obtener más detalles, consulte nuestra guía sobre cómo instalar un complemento de WordPress.
Tras la activación, deberá ir a Facebook Feed » Configuración e ingresar su clave de licencia en el campo 'Clave de licencia'.

Encontrarás esta información debajo de tu cuenta en el sitio web de Smash Balloon.
Después de ingresar la clave, haga clic en el botón 'Activar'.
Cómo agregar la aplicación Smash Balloon a tu grupo de Facebook
Después de eso, deberá agregar la aplicación de Facebook de Smash Balloon al grupo de Facebook que desea mostrar en su sitio web de WordPress.
Nota: Debido a cómo está configurada la API de Facebook, Smash Balloon solo puede mostrar las publicaciones que se realizaron después de agregar la aplicación a su grupo de Facebook.
Con eso en mente, sigamos adelante e instalemos la aplicación antes de hacer cualquier otra cosa. En una nueva pestaña, inicie sesión en Facebook y vaya a su grupo de Facebook.
Luego, en el menú de la izquierda, haga clic en 'Configuración de grupo'.

Después de eso, desplácese a la sección 'Administrar configuraciones avanzadas'.
Aquí, haga clic en el icono del lápiz junto a 'Aplicaciones'.

Esto abre una ventana emergente que muestra todas las aplicaciones que ya ha agregado a este grupo.
Ya que queremos instalar la aplicación Smash Balloon, haga clic en 'Agregar aplicaciones'.

En la barra de búsqueda, escribe 'Smash Balloon WordPress'.
Cuando aparezca la aplicación correcta, dale un clic.

Ahora aparecerá una ventana emergente que muestra toda la información a la que puede acceder la aplicación y las acciones que puede realizar.
Si está feliz de continuar e instalar la aplicación, haga clic en 'Agregar'.

Después de unos momentos, debería ver un mensaje que dice que agregó con éxito la aplicación Smash Balloon a su grupo de Facebook.
Conecta Smash Balloon a tu grupo de Facebook
Ahora es el momento de conectar su página de Facebook con WordPress, yendo a Facebook Feed » All Feeds y haciendo clic en 'Add New'.

Smash Balloon te permite mostrar fotos, eventos, videos, álbumes y más.
Ya que queremos incrustar nuestro feed de grupo de Facebook, haga clic en 'Cronología' y luego seleccione 'Siguiente'.

Después de eso, deberá seleccionar el grupo de Facebook de donde obtendrá la línea de tiempo.
Para comenzar, haga clic en 'Agregar nuevo'.

En la siguiente pantalla, seleccione el botón de opción junto a 'Grupo'.
Después de eso, simplemente haga clic en 'Conectarse a Facebook'.

Esto abre una ventana emergente donde puede iniciar sesión en su cuenta de Facebook y elegir el grupo que desea usar.
Después de marcar la casilla junto a uno o más grupos, simplemente haga clic en 'Siguiente'.

Ahora debería ver una ventana emergente que le pide que instale la aplicación Smash Balloon WordPress.
Como ya instalamos esta aplicación, puede continuar y hacer clic en 'Listo'.

Cómo crear un feed de grupo de Facebook en WordPress
Ahora que ha agregado su grupo de Facebook a Smash Balloon, aparecerá como una opción. Simplemente haga clic para seleccionar el grupo y luego haga clic en 'Siguiente'.

En esta pantalla, puede elegir la plantilla que usará como punto de partida para el feed de su grupo de Facebook.
Todas estas plantillas son totalmente personalizables, por lo que puede ajustar el diseño según cómo desee mostrar las actualizaciones de estado, los videos y las fotos de su grupo de Facebook.
Estamos usando la plantilla 'Albañilería simple', pero puede elegir cualquier plantilla que desee.

Smash Balloon ahora seguirá adelante y creará el feed basado en tu grupo de Facebook y la plantilla que hayas elegido.
Este es un buen comienzo, pero Smash Balloon tiene muchas configuraciones que puede usar para personalizar la apariencia de este feed de grupo en su blog de WordPress.
Cómo personalizar el feed de tu grupo de Facebook
El complemento Smash Balloon le brinda muchas formas de personalizar cómo aparece el feed en su sitio web. Con eso en mente, vale la pena ver qué cambios puede hacer.
En la pantalla Feed de Facebook » All Feeds , busca el feed de tu grupo y luego haz clic en el botón 'Editar', que parece un lápiz pequeño.

Esto abre el editor de feeds de Smash Balloon, que muestra una vista previa del feed de tu grupo de Facebook a la derecha.
En el lado izquierdo, verá todas las diferentes configuraciones que puede usar para personalizar cómo aparecen las publicaciones en su sitio. La mayoría de estas configuraciones se explican por sí mismas, pero cubriremos rápidamente algunas áreas clave.

Si desea cambiar la plantilla que está utilizando, simplemente haga clic en 'Plantilla'.
Luego, seleccione el botón 'Cambiar'.

Para comenzar, puede cambiar la forma en que se muestran las publicaciones de su grupo haciendo clic en 'Diseño de fuente'.
En esta pantalla, puede cambiar entre diseños de mampostería y de lista, y cambiar la altura de alimentación. A medida que realice cambios, la vista previa se actualizará automáticamente para que pueda probar diferentes configuraciones para ver cuál se ve mejor para su grupo de Facebook.

De manera predeterminada, el feed del grupo de Facebook mostrará una cantidad diferente de publicaciones en computadoras de escritorio y dispositivos móviles.
Puede obtener una vista previa de cómo se verá su feed en computadoras de escritorio, tabletas y teléfonos inteligentes usando la fila de botones en la esquina superior derecha.

Después de probar la versión móvil de su sitio web de WordPress, es posible que desee cambiar la cantidad de publicaciones que muestra en teléfonos inteligentes y tabletas.
Para realizar este cambio, simplemente busque la sección 'Número de publicaciones' y escriba un número diferente en el campo 'Móvil'.

También puede mostrar menos columnas en teléfonos inteligentes y tabletas cambiando la configuración de 'Columnas'.
Por ejemplo, en la siguiente imagen, estamos dividiendo el contenido en 3 columnas en computadoras de escritorio, 2 columnas en tabletas y 1 columna en dispositivos móviles.

Cuando esté satisfecho con el diseño, haga clic en el enlace 'Personalizar'.
Esto lo llevará de vuelta al editor principal de Smash Balloon, listo para pasar a la siguiente pantalla de configuración, que es 'Esquema de colores'.


De forma predeterminada, Smash Balloon usa el mismo esquema de color que su tema de WordPress, pero en esta pantalla, puede cambiar a un esquema de color 'Claro' u 'Oscuro'.
Otra opción es diseñar su propio esquema de color seleccionando 'Personalizado' y luego usando los controles para cambiar el color de fondo, cambiar el color del texto en WordPress y más.

Puede agregar un encabezado sobre el feed de su grupo, que puede incluir contenido como la imagen de perfil y el nombre de su grupo. Esto puede ayudar a los visitantes a comprender el contenido que están viendo y cómo pueden encontrar su grupo en Facebook.
Para agregar una sección de encabezado, haga clic en 'Encabezado' en el menú de la izquierda.

En esta pantalla, haga clic en el control deslizante 'Habilitar' para cambiarlo de gris a azul.
Después de agregar una sección de encabezado, puede usar los controles para cambiar el tamaño del encabezado y su color, ocultar o mostrar su foto de perfil de Facebook y más.

Si desea eliminar el encabezado en cualquier momento, simplemente haga clic para desactivar la opción 'Habilitar'.
Después de eso, puede cambiar la apariencia de las publicaciones individuales dentro de su feed de grupo seleccionando 'Estilo de publicación' en el menú de la izquierda.
Después de eso, haga clic en 'Estilo de publicación' nuevamente.

En esta pantalla, puede elegir entre un diseño normal y en caja.
Si selecciona 'Encuadrado', puede crear un fondo de color para cada publicación. También puede aumentar el radio del borde para crear esquinas curvas y agregar una sombra de borde.

Si elige 'Normal', puede cambiar el grosor y el color de la línea que separa sus diferentes publicaciones en las redes sociales.
En la siguiente imagen, agregamos una línea más gruesa al feed de grupo y cambiamos su color.

También puede personalizar las partes individuales dentro de cada publicación volviendo a la pantalla de configuración principal.
Una vez más, seleccione 'Estilo de publicación', pero esta vez elija 'Editar elementos individuales'.

Ahora verá todo el contenido diferente que Smash Balloon incluye en cada publicación, como el autor de la publicación, la fecha, el cuadro de enlace compartido y más.
Para eliminar una parte del contenido de sus publicaciones, simplemente haga clic para desmarcar su casilla.

También puede personalizar cómo se ve cada tipo de contenido haciendo clic en él.
Por ejemplo, en la siguiente imagen, puede ver la configuración para cambiar el tamaño y el color de los enlaces de 'acción posterior', como me gusta, compartir y comentar.

También puede cambiar el texto 'Ver en Facebook' escribiendo en el campo 'Personalizar texto'.
De forma predeterminada, Smash Balloon no agrega un botón de "me gusta" de Facebook a su feed. Este botón facilita que los visitantes se unan a su grupo, por lo que es posible que desee agregarlo a su fuente seleccionando la configuración de 'Me gusta'.

Luego, simplemente haga clic en 'Habilitar' para que la palanca se vuelva azul.
Ahora puede usar el menú desplegable 'Posición' para agregar el cuadro Me gusta debajo o arriba del feed del grupo.

También puede usar esta configuración para cambiar el ancho del cuadro o agregar la foto de portada del grupo.
Para alentar a más personas a unirse a su grupo, es posible que desee mostrar el número total de seguidores haciendo clic en el interruptor 'Mostrar seguidores'.
Cuando esté satisfecho con la configuración del botón "Me gusta", puede pasar a la configuración del botón "Cargar más".

El botón "Cargar más" brinda a los visitantes una manera fácil de desplazarse por más de su feed. Si disfrutan de este contenido, es posible que decidan unirse a su grupo de Facebook.
Con eso en mente, es posible que desee hacer que este botón se destaque cambiando el color de fondo, el estado de desplazamiento y el color del texto.

Este botón muestra 'Cargar más' de forma predeterminada, pero puede agregar un mensaje personalizado escribiendo en el campo 'Texto'.
Smash Balloon tiene una función de caja de luz que permite a los visitantes ver los videos de su grupo y observar sus fotos más de cerca sin salir de WordPress.
Los visitantes pueden simplemente hacer clic en cualquier miniatura de video o foto para abrir la ventana emergente de lightbox.

Luego pueden desplazarse por el resto de las imágenes y videos en el feed usando las flechas.
Para personalizar la caja de luz predeterminada, simplemente seleccione 'Caja de luz' en el menú de la izquierda.

Aquí puede cambiar el color del texto, los enlaces y los colores de fondo de la caja de luz.
La ventana emergente de la caja de luz facilita que los visitantes exploren su feed, pero también permite que las personas se desplacen por sus fotos y videos sin visitar su grupo de Facebook.
Si desea obtener más visitantes a su grupo de Facebook, puede desactivar la función de caja de luz. Para hacer esto, simplemente haga clic en el interruptor 'Habilitar' para que cambie de azul a gris.

Ahora, si un visitante hace clic en cualquier foto o video en el feed del grupo, será llevado a su grupo de Facebook en una nueva pestaña.
Cuando esté satisfecho con el aspecto del feed del grupo de Facebook, no olvide hacer clic en 'Guardar' para guardar los cambios.
Ahora está listo para agregar este feed a su sitio web de WordPress.
Cómo incrustar el feed de tu grupo de Facebook en WordPress
Puede agregar su feed de grupo de Facebook a WordPress usando un bloque, un widget o un código abreviado.
Si ha creado más de una fuente con Smash Balloon, necesitará saber el código de la fuente si va a usar un bloque o un widget.
Para obtener esta información, vaya a Facebook Feed » All Feeds y luego mire la parte feed=""
del shortcode. Deberá agregar este código al bloque o widget, así que anótelo.
En la siguiente imagen, necesitaremos usar feed="1"
.

Si desea incrustar el feed de su grupo de Facebook en una página o publicación, puede usar el bloque 'Feed de Facebook personalizado'.
Simplemente abra la página o publicación en la que desea incrustar el feed de Facebook. Luego, haga clic en el ícono '+' para agregar un nuevo bloque y comience a escribir 'Feed personalizado de Facebook'.
Cuando aparezca el bloque de Facebook, haz clic para agregarlo a tu página o publicación.

El bloque mostrará uno de tus feeds de Smash Balloon de forma predeterminada. Si este no es el feed de su grupo de Facebook, busque la sección 'Configuración de código corto' en el menú de la derecha.
Ahora puede continuar y agregar el código feed=""
, luego hacer clic en 'Aplicar cambios'.

Después de eso, simplemente publique o actualice la página para que el feed del grupo esté activo en su sitio web.
Otra opción es agregar el feed a cualquier área lista para widgets, como la barra lateral o una sección similar. Esto permite a los visitantes ver el feed de su grupo sin importar dónde se encuentren en su sitio web.
Para comenzar, simplemente vaya a Apariencia » Widgets en el tablero de WordPress y luego haga clic en el botón azul '+'.

Una vez que haya hecho eso, comience a escribir 'Feed personalizado de Facebook' en la barra de búsqueda.
Cuando aparezca el widget correcto, arrástrelo hasta donde desee mostrar el feed.

El widget mostrará uno de los feeds que creaste con Smash Balloon.
Si este no es el feed de tu grupo de Facebook, escribe el código del feed en el cuadro "Configuración de código corto". Luego, haga clic en 'Aplicar cambios'.

Ahora puede hacer clic en el botón 'Actualizar' para activar el widget. Para obtener más información, consulte nuestra guía completa sobre cómo agregar y usar widgets en WordPress.
Finalmente, puede incrustar el feed del grupo de Facebook en cualquier página, publicación o área lista para widgets usando shortcode.
Simplemente vaya a Facebook Feed » All Feeds y copie todo el código en la columna 'Shortcode'. Ahora puede agregar este código a cualquier bloque de shortcode.
Para obtener más información, consulte nuestra guía detallada sobre cómo agregar un código abreviado en WordPress.
Nota: si está utilizando un tema habilitado para bloques, puede usar el editor de sitio completo para agregar el bloque 'Feed personalizado de Facebook' en cualquier parte de su sitio.
Esperamos que este artículo le haya ayudado a aprender cómo agregar un grupo de Facebook en su sitio web de WordPress. También puede consultar nuestra guía sobre cómo crear un formulario de contacto en WordPress, o ver nuestra selección experta de los mejores complementos de Facebook para su blog.
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para videos tutoriales de WordPress. También puede encontrarnos en Twitter y Facebook.
La publicación Cómo incrustar un feed de grupo de Facebook en WordPress apareció por primera vez en AprenderWP.