Cómo crear un feed de Facebook personalizado en WordPress

Cuando construimos sitios web, a veces nos gusta añadir el Facebook Feed de la marca a una de sus páginas. Esto permite a los visitantes ver las últimas actualizaciones, anuncios e interacciones de la comunidad sin salir del sitio.

Aunque existen métodos manuales, no son los más eficaces para mostrar contenidos de Facebook.

Muchos de nuestros lectores han preguntado por esta función y, tras explorar varias opciones, nos hemos decidido por Smash Balloon para nuestros feeds de Facebook personalizados. Es fácil de usar, está repleto de funciones y se adapta a usuarios de WordPress de todos los niveles.

En esta guía, te guiaremos a través de la creación de un Facebook Feed personalizado en WordPress utilizando nuestro método de eficacia probada.

¿Por qué crear un feed de Facebook personalizado en WordPress?

Según nuestro informe estadístico sobre redes sociales, Facebook tiene más de 3.000 millones de usuarios activos mensuales. Esto la convierte en la mayor red social del mundo. Como propietario de un sitio web, es posible que ya hayas creado una página o un grupo en Facebook para interactuar con tu audiencia.

Sin embargo, las personas que solo visiten tu sitio web no verán tus entradas de Facebook. Si añades un feed de Facebook personalizado, podrás mostrar a los visitantes lo que ocurre en tu grupo o página.

Esto puede hacer que tu sitio web sea más atractivo e interesante, especialmente si publicas contenido multimedia en Facebook, como vídeos e imágenes.

También es una forma estupenda de promocionar tu página o grupo de Facebook, lo que te ayudará a conseguir más “me gusta” en Facebook y a aumentar el número de seguidores.

Dicho esto, veamos cómo añadir un feed personalizado de Facebook a tu sitio WordPress.org. Puedes utilizar los enlaces rápidos que aparecen a continuación para navegar por esta guía paso a paso:

Paso 1: Instala el plugin Smash Balloon Custom Facebook Feed.

La mejor y más sencilla forma de añadir un feed personalizado de Facebook a tu sitio web WordPress es utilizando el plugin Smash Balloon Custom Facebook Feed.

Este plugin de Facebook te permite mostrar tus contenidos y comentarios directamente en tu sitio web e incluso combinar publicaciones de varias fuentes de Facebook. También facilita la visualización de pruebas sociales potentes mediante la incrustación de reseñas de Facebook y publicaciones de la comunidad en tu sitio web.

Lo primero que tienes que hacer es instalar y activar el plugin Smash Balloon Custom Facebook Feed Pro. Para más detalles, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

En esta entrada, vamos a utilizar la versión pro de Smash Balloon, ya que te permite mostrar vídeos y fotos en tu feed de Facebook, elegir diferentes disposiciones, filtrar tu feed en función del tipo de entradas y mucho más.

Sin embargo, también existe una versión gratuita que te permite crear un feed de Facebook personalizado para WordPress, independientemente de tu presupuesto.

Tras la activación, tendrás que ir a Facebook Feed ” Ajustes e introducir tu clave de licencia en el campo “Clave de licencia”.

Encontrará esta información en su cuenta del sitio web de Smash Balloon.

Tras introducir la clave, basta con hacer clic en el botón “Activar”.

Paso 2: Conecta tu página o grupo de Facebook a WordPress

Smash Balloon Custom Facebook Feed te permite crear múltiples feeds desde tus diferentes páginas y grupos de Facebook. Incluso puedes combinar feeds para crear un feed personalizado.

Para crear tu primera feed, ve a Facebook Feed ” Todas las feeds y, a continuación, haz clic en “Añadir nuevo”.

Smash Balloon te permite mostrar álbumes de Facebook, entradas de tu línea de tiempo, vídeos, eventos y mucho más. En esta guía, crearemos un feed de Facebook “Timeline”, pero puedes seleccionar el tipo de feed que desees.

Después de elegir un tipo de feed, haga clic en el botón “Siguiente”.

Ahora, tienes que seleccionar la página o el grupo de Facebook de donde obtendrás el contenido.

Para empezar, haz clic en “Añadir nuevo”.

En la siguiente pantalla, elige si quieres incrustar un feed de grupo de Facebook en WordPress o crear un feed de página de Facebook.

A continuación, basta con hacer clic en “Conectar con Facebook”.

Se abre una ventana emergente en la que puedes acceder a tu cuenta de Facebook y elegir las páginas o grupos que quieres utilizar en tu feed.

Después de hacer su selección, haga clic en el botón “Siguiente”.

Una vez hecho esto, Facebook mostrará toda la información a la que Smash Balloon tendrá acceso y las acciones que puede realizar.

Para restringir el acceso de Smash Balloon a tu cuenta de Facebook, simplemente haz clic en cualquiera de los interruptores para cambiarlos de “Sí” a “No”. Ten en cuenta que esto puede afectar al contenido que puedes mostrar en el feed de medios sociales.

Teniendo esto en cuenta, recomendamos dejar activados todos estos interruptores.

Cuando esté listo, haga clic en “Listo”.

Al cabo de unos instantes, aparecerá un mensaje que te indicará que has enlazado correctamente tu sitio web de WordPress con Facebook. Ahora puedes hacer clic en “Aceptar”.

Una vez hecho esto, Smash Balloon le devolverá automáticamente al escritorio de WordPress.

Paso 3: Crear un feed de Facebook personalizado en WordPress

Ahora verás un mensaje / ventana emergente con el grupo o página que acabas de enlazar a tu sitio web WordPress. Simplemente seleccione el botón de opción siguiente a su fuente y luego haga clic en el botón “Añadir”.

Si has cerrado accidentalmente el mensaje / ventana emergente, que no cunda el pánico. Sólo tienes que actualizar la pestaña para volver a abrir el mensaje / ventana emergente.

Una vez hecho esto, volverás a la página “Todos los feeds” de Facebook.

Al igual que antes, haz clic en el botón “Añadir nuevo” y, a continuación, elige el tipo de feed de Facebook personalizado que deseas crear, como Timeline, Fotos o Vídeos.

A continuación, haz clic en “Siguiente”. Ahora, en “Seleccionar una fuente”, verás tu grupo o página de Facebook como opción.

Seleccione la página o el grupo y, a continuación, haga clic en “Siguiente”.

Ahora puede elegir la plantilla que desea utilizar como punto de partida para su feed. Todas estas plantillas son totalmente personalizables, por lo que puedes ajustarlas para que se adapten perfectamente a tu blog o sitio web de WordPress.

Utilizaremos la plantilla ‘Por defecto’, pero puede utilizar cualquier plantilla que desee.

Tras elegir un diseño, haga clic en el botón “Siguiente”.

Smash Balloon creará ahora un feed de Facebook basado en tu fuente y en la plantilla elegida. Este es un gran comienzo, pero es posible que desee ajustar la forma en que este feed aparece en su sitio web.

Paso 4: Personaliza tu feed de Facebook

El plugin Smash Balloon Custom Facebook Feed te ofrece muchas opciones de personalización para editar tu feed. Con eso en mente, vale la pena ver qué cambios puedes hacer.

En la pantalla “Todos los feeds” de Facebook, busca el feed que acabas de crear y haz clic en su botón “Editar”, que parece un pequeño lápiz.

Se abre el editor de feeds, que muestra una vista previa del aspecto que tendrá el feed personalizado de Facebook en tu sitio web. Aquí puedes ver todos los vídeos de Facebook incrustados, las actualizaciones de estado y otros contenidos que aparecerán en tu sitio web de WordPress.

En la parte izquierda verás todos los ajustes que puedes utilizar para personalizar el feed. La mayoría de estos ajustes se explican por sí mismos, pero cubriremos rápidamente algunas áreas clave.

Para empezar, puedes cambiar cómo se muestran tus entradas al hacer clic en “Disposición del feed”.

En esta pantalla, puedes cambiar entre diferentes diseños y cambiar la altura del feed. Incluso puedes crear un slider responsivo seleccionando el diseño “Carrusel”.

A medida que realice cambios, la vista previa se actualizará automáticamente, de modo que podrá probar diferentes ajustes para ver qué funciona mejor para su sitio web.

Por defecto, el feed mostrará el mismo número de entradas en ordenadores de sobremesa y en dispositivos móviles como smartphones.

Sin embargo, los dispositivos móviles suelen tener pantallas más pequeñas y menos capacidad de procesamiento, por lo que es posible que quieras mostrar menos entradas en tablets y smartphones. Para ello, solo tienes que introducir un número diferente en el campo “Móvil”, debajo de “Número de entradas”.

Puede obtener una vista previa de cómo se verán sus cambios en ordenadores de sobremesa, tabletas y teléfonos inteligentes utilizando la fila de botones de la esquina superior derecha.

Al probar diferentes disposiciones, puede crear un feed personalizado que tenga un aspecto excelente, independientemente del dispositivo que utilice el visitante.

Por defecto, el feed de Facebook muestra menos columnas en smartphones y tabletas que en ordenadores de sobremesa. Esto ayuda a que todo tu contenido quepa cómodamente en pantallas más pequeñas.

Sin embargo, después de probar la versión móvil de tu sitio web en WordPress, es posible que no estés satisfecho con el aspecto de las columnas en smartphones y tabletas. Si es así, puedes ajustar las columnas cambiando los números de la sección “Columnas”.

Cuando esté satisfecho con los cambios realizados, haga clic en el enlace “Personalizar” situado en la parte superior del menú.

Esto te llevará de vuelta al editor principal de Smash Balloon.

A continuación, puedes hacer clic en “Combinación de colores” en el menú de la izquierda y echar un vistazo a los diferentes colores que puedes añadir al feed de Facebook.

Por defecto, Smash Balloon utiliza un esquema de color heredado de su tema de WordPress, pero también puede elegir ‘Claro’ u ‘Oscuro’ o incluso crear su propio esquema de color personalizado.

Por ejemplo, puede cambiar el color del texto para que destaque sobre el fondo del tema.

Por defecto, Smash Balloon añade una cabecera a tu feed, que es tu foto de perfil de Facebook y el nombre de tu página o grupo. Esto puede añadir algo de contexto adicional, en lugar de simplemente mostrar tu cronología de Facebook en WordPress.

Para cambiar el aspecto, haga clic en “Cabecera” en el menú de la izquierda.

En esta pantalla, puedes cambiar el tamaño y el color de la cabecera, ocultar o mostrar tu foto de perfil de Facebook, etc.

Si desea quitar la cabecera por completo, haga clic en el conmutador para pasar de azul (activado) a gris (desactivado).

La siguiente pantalla es la de “Entradas”. Aquí puedes cambiar el aspecto de las entradas individuales dentro del feed personalizado de Facebook.

Por ejemplo, puede alternar entre los estilos normal y recuadrado, cambiar el color de fondo, añadir una sombra de recuadro, etc.

Por defecto, Smash Balloon no incluye el botón “Me gusta” de Facebook en tu feed.

Para animar a más visitantes a seguir tu página de Facebook, puedes añadir este botón seleccionando “Me gusta” en el menú de la izquierda del editor.

Después, sólo tienes que hacer clic en el botón “Activar” para que se vuelva azul. Ahora, si te desplazas hasta la parte inferior de la vista previa, verás un botón de “Me gusta”.

Puedes configurar esta zona con distintos ajustes. Por ejemplo, puedes elegir si el botón aparece en la parte superior o inferior del feed y si quieres incluir la foto de portada de tu página de Facebook.

Cuando esté satisfecho con el aspecto del botón “Me gusta”, puede pasar a la pantalla “Cargar más botones”.

El botón “Cargar más” anima a los visitantes a desplazarse por más partes de tu feed de Facebook.

Por esta razón, es posible que desee hacer que el botón sea más llamativo cambiando el color de fondo, el color del texto y la etiqueta.

Otra opción es quitar completamente el botón “Cargar más” haciendo clic en el conmutador “Activar” para que se vuelva gris.

Desactivar el botón “Cargar más” es útil si tu feed de Facebook es sensible al tiempo. Por ejemplo, si publicas principalmente sobre tu calendario de eventos de Facebook, puede que los visitantes no necesiten desplazarse por tus entradas anteriores porque ya no son relevantes.

Cuando estés satisfecho con cómo se ha establecido el feed personalizado de Facebook, no olvides hacer clic en “Guardar” para guardar los cambios.

Ya puedes añadir el feed de Facebook a tu sitio web WordPress.

Paso 5: Añade tu feed personalizado de Facebook a WordPress

Para incrustar feeds de Facebook en WordPress, haz clic en el botón “Incrustar” situado junto a “Guardar”.

Ahora verás dos opciones para añadir tu feed de Facebook: shortcode o bloque.

Según nuestra experiencia, es más fácil insertar tu feed de Facebook utilizando un bloque. Para ello, puedes hacer clic en “Añadir a una página” o en “Añadir a un widget” si tu tema tiene un área preparada para widgets.

Nuestra guía utilizará el botón Añadir a una página a modo de ejemplo.

Ahora, tendrás que elegir una página en la que insertar el feed de Facebook.

Sólo tienes que seleccionar uno y hacer clic en “Añadir”.

Se te redirigirá al editor de bloques. A continuación, haz clic en el botón “+ Añadir bloque” y busca el bloque Facebook Feed.

En este punto, puedes arrastrar y soltarlo donde mejor te parezca.

Una vez hecho esto, sigue adelante y selecciona una fuente de feed de Facebook.

Así:

Ahora debería aparecer tu feed de Facebook.

Basta con hacer clic en “Actualizar” para hacer oficiales los cambios.

Si desea utilizar el método shortcode, puede copiar el shortcode de la ventana emergente “Incrustar feed”.

A continuación, sólo tienes que pegar el código corto en un bloque de código corto en el editor de contenido al editar una página, entrada o widget de WordPress. Una vez hecho esto, haz clic en “Actualizar”.

Para obtener más información sobre cómo colocar el shortcode, consulte nuestra guía sobre cómo añadir un shortcode en WordPress.

Sugerencia adicional: Cómo añadir más feeds de medios sociales a WordPress

Si quieres incrustar publicaciones de estado de Facebook en WordPress, mostrar tu cronología, mostrar álbumes de Facebook y mucho más, Custom Facebook Feed es el mejor plugin de WordPress para ello.

Sin embargo, muchos sitios web tienen varias cuentas en medios sociales, como un canal de YouTube, un perfil de Twitter y una cuenta de Instagram. Si creas contenido único para cada plataforma, entonces tiene sentido mostrar este contenido en tu sitio web WordPress.

Puedes mostrar los últimos vídeos de tu canal de YouTube en WordPress utilizando el plugin gratuito Smash Balloon Feeds for YouTube.

Con más de mil millones de usuarios activos al mes, Instagram es un lugar ideal para promocionar tus productos, servicios y entradas de blog.

Si tienes una cuenta de Instagram, puedes crear un feed de Instagram personalizado y añadirlo a cualquier página web, entrada o área preparada para widgets. Incluso puedes añadir imágenes de Instagram shoppable en WordPress.

Esperamos que este artículo te haya ayudado a añadir un Facebook Feed personalizado en WordPress. También puedes consultar nuestra guía definitiva sobre comercio social para usuarios de WordPress y nuestro artículo sobre cómo publicar automáticamente en Facebook a través de WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.