Me encontré con un gran problema al promocionar eventos en Facebook. La gente de mi página no tenía ni idea de que existían esos eventos. No consultaban mi página con regularidad y no quería enviarles a otro sitio para que confirmaran su asistencia.
Así que busqué una forma de integrar los eventos de Facebook en WordPress. De ese modo, los visitantes podían ver lo que estaba por venir, participar con un clic y permanecer en mi sitio todo el tiempo.
Si has estado intentando averiguar cómo hacerlo tú mismo, estás en el lugar adecuado. En esta guía, te mostraré tres formas de mostrar tus eventos de Facebook en un sitio de WordPress, ya sea con un simple widget, un calendario de eventos completo o un feed incrustado que se actualice solo.
¿Por qué integrar eventos de Facebook en WordPress?
La integración de eventos de Facebook en WordPress aumenta la visibilidad al mostrar tus eventos directamente en tu sitio web. Ahorra tiempo sincronizando las actualizaciones automáticamente, crea expectación con las opciones de confirmación de asistencia y aumenta la credibilidad mostrando pruebas sociales. Las opciones de personalización garantizan que la visualización se adapte al diseño de tu sitio web.
Cómo integrar eventos de Facebook en WordPress
En esta guía, compartiré tres formas de incluir eventos de Facebook en tu sitio web de WordPress:
- Crea una página de eventos especiales. Es como tener una sección VIP en tu sitio web sólo para eventos. Ayuda a la gente a encontrar y apuntarse fácilmente a los eventos.
- Utiliza una herramienta que extraiga tus eventos de Facebook. Esta herramienta actúa como un puente que lleva tus eventos a cualquier página de tu sitio web. Además, puedes cambiar el aspecto de los eventos para adaptarlos a tu estilo.
- Añade un fragmento de código (si te sientes cómodo con ello). Facebook te permite coger un trozo de código para poner eventos directamente en tu sitio. Es la forma más sencilla, pero no te da muchas opciones para que queden bien.
¿Cómo saber qué método de incrustación le conviene más?
¿No estás seguro de cuál es la mejor forma de mostrar un feed de eventos de Facebook en tu sitio web? Aquí tienes una tabla comparativa que te ayudará a elegir el método adecuado para incrustar un calendario de Facebook en WordPress.
| Método | Características | Facilidad de uso | Precios | Para móviles | ¿Versión gratuita? | Límites de la versión gratuita |
|---|---|---|---|---|---|---|
| SeedProd | Páginas de destino, integraciones de Facebook | Fácil | De pago/gratuito | Sí | Sí | Funciones limitadas, el bloqueo de página de Facebook requiere pago |
| Globo Smash | Feeds de Facebook personalizables | Moderado | De pago/gratuito | Sí | Sí | Funciones limitadas |
| Incrustación manual (código) | Visualización básica de eventos | Difícil | Gratis | Tal vez | Sí | Muy limitado, necesita conocimientos de codificación |
Ahora vamos a saltar.
Cómo mostrar eventos de Facebook en una página de destino de WordPress
SeedProd es un popular constructor de páginas de WordPress de arrastrar y soltar, con funcionalidad de próximamente y modo de mantenimiento. Puede utilizar este plugin para crear páginas de destino de alta conversión sin escribir código CSS y PHP o contratar a un desarrollador.
Si has oído hablar de Elementor, funciona igual pero con una interfaz de usuario más ágil y centrada en la simplicidad.
No sólo puede utilizar cientos de plantillas, sino que SeedProd también incluye bloques de contenido que le permiten incrustar contenido de redes sociales como su calendario de eventos de Facebook, alimentación de página en directo y herramientas de RSVP, todo ello sin necesidad de código.
Lo más destacable son los bloques de Facebook, que permiten incrustar contenidos de redes sociales, entre otros:
- Botón Me gusta de Facebook
- Comentarios en Facebook
- Página de Facebook
- Insertar en Facebook
Para este método utilizaremos el bloque de página de Facebook para añadir eventos directamente en tu página de destino. La mejor parte es que no hay tokens de acceso, shortcodes o IDs para copiar y pegar.
1. Instalar y activar SeedProd
Para empezar, instala y activa el plugin SeedProd. Para esta guía, usaremos SeedProd Pro porque tiene los bloques avanzados de Facebook que necesitamos.
2. Crear una página de destino en WordPress
Después de instalar SeedProd en su sitio web WordPress, tendrá que crear una nueva página de destino.
Por suerte, puedes seguir esta guía paso a paso sobre cómo crear una página de aterrizaje en WordPress para empezar rápidamente. O puedes seguir esta guía para crear específicamente una página de aterrizaje para eventos.
Una vez que el diseño de su página de destino está en su lugar, navegue a SeedProd " Páginas y haga clic en Editar en la página de destino que hizo siguiendo nuestro tutorial.
Se abrirá el editor visual de SeedProd, donde podrá añadir sus eventos.
3. Añadir el bloque de página de Facebook
A continuación, busca un espacio en tu página donde quieras mostrar tu calendario de eventos de Facebook. A continuación, ve a la sección Bloques avanzados de la derecha y busca el bloque Página de Facebook.
Para añadir este bloque a su página, arrástrelo desde la izquierda a la vista previa.
A continuación, en la configuración del contenido del bloque de la página de Facebook, pega la URL de tu página. Así es como SeedProd extrae tu feed de eventos públicos de Facebook y lo muestra dentro de tu diseño de WordPress.
Por defecto, SeedProd muestra automáticamente la línea de tiempo de su página de Facebook. Para mostrar sus eventos en su lugar, haga clic en la opción Eventos bajo el encabezado Pestañas.
En el mismo panel, también puedes cambiar el estilo de la cabecera, mostrar u ocultar tu foto de portada, ajustar la alineación, etc.
Y si quieres aumentar la participación en tu página de Facebook, puedes utilizar el bloque de incrustación de Facebook para incrustar una publicación, un vídeo de Facebook o un comentario junto a la programación de tus eventos.
4. Publique su página de destino
Sólo queda hacer clic en la flecha desplegable junto al botón Guardar en la esquina superior derecha y hacer clic en Publicar.
A continuación, cuando haga clic en Vista previa, verá su calendario de eventos en directo en su página de destino.
Ya está. Los visitantes de tu sitio web ya pueden ver tus eventos de Facebook en tu página de destino.
Pero si quieres mostrar un feed de eventos de Facebook completo, te sugerimos que pruebes el siguiente método.
Cómo sincronizar los eventos de Facebook con tu sitio WordPress
Necesitarás instalar y activar el plugin Smash Balloon Custom Facebook Feed Pro para este método. Si necesitas ayuda con este paso, consulta este tutorial paso a paso sobre cómo instalar un plugin de WordPress.
1. Crear un nuevo feed de Facebook
Después de instalar y activar el plugin, ve al menú Facebook Feed " All Feeds desde tu panel de control de WordPress. Desde allí, haz clic en el botón Añadir nuevo para empezar a crear tu feed de eventos.
En la página siguiente, verás 9 tipos diferentes de feeds de Facebook que puedes añadir a tu sitio web, entre los que se incluyen:
- Cronología
- Fotos
- Vídeos
- Álbumes
- Eventos
- Reseñas
- Y más
Elija la opción Eventos y pulse el botón Siguiente para continuar.
2. Seleccione una fuente de página de Facebook
Después de seleccionar un tipo de feed, es hora de elegir una fuente de página de Facebook. Puede ser un grupo de Facebook o una página en la que publiques los eventos de tu empresa.
Para añadir una fuente, pulse el botón Añadir nueva.
Se abrirá una ventana emergente en la que se te pedirá el ID de tu página de Facebook y el código de acceso al evento.
Si no estás seguro de cómo encontrar el ID de la aplicación y el token secreto de la aplicación para tu página, sigue estas instrucciones.
Tras introducir los datos de tu aplicación de Facebook, haz clic en el botón Añadir fuente.
En la siguiente pantalla, verás tu página de Facebook recién añadida. Selecciona esa página y haz clic en Siguiente para continuar.
3. Personaliza el diseño de tu calendario de eventos de Facebook
Ahora puedes empezar a personalizar tus eventos. Las opciones de personalización se encuentran a la izquierda, mientras que a la derecha aparece una vista previa de tu feed.
Las opciones de personalización te permiten cambiar el tipo de fuente, el diseño, el color, el diseño de la cabecera, el diseño de la entrada y mucho más.
En primer lugar, elija a la izquierda la opción Diseño de la fuente.
Esta opción ofrece 3 configuraciones diferentes: lista, albañilería y carrusel.
Para mostrar los eventos uno tras otro, elija la opción Diseño de lista.
También puede seleccionar la opción Mampostería si prefiere mostrar sus eventos en un diseño de varias columnas.
Por último, está la opción Carrusel, que te permite mostrar tus eventos en un impresionante deslizador de imágenes.
Seleccione el diseño que mejor se adapte a su sitio web. A continuación, haga clic en el botón Personalizar una vez más para volver a la configuración anterior.
4. Personaliza la combinación de colores de tu feed de eventos de Facebook
Si quieres cambiar el color de tu feed, haz clic en el encabezado Esquema de colores. En este panel, puedes elegir entre 4 opciones de color diferentes, como:
- Heredar del Tema: Copiar el esquema de color de su sitio web
- Claro: Tener un fondo claro con texto de color oscuro.
- Oscuro: oscurece el fondo con texto de color claro.
- Personalizados: Introduzca usted mismo todos los colores
Después, puedes personalizar otros ajustes, como el diseño de la cabecera, el tamaño de la fuente, los márgenes, etc.
Cuando estés satisfecho con el aspecto de todo, haz clic en el botón Guardar .
5. Mostrar eventos de Facebook en páginas de WordPress
Ahora, estás listo para integrar los eventos de Facebook en tu sitio web de WordPress, y Smash Balloon te permite hacerlo de 2 maneras.
En primer lugar, haga clic en el botón Incrustar de la esquina superior derecha. Se abrirá una ventana emergente con distintas opciones de publicación.
Haz clic en el botón Añadir a una página para incrustar tus eventos de Facebook en una página normal de WordPress.
A partir de ahí, puede elegir cualquier página de su sitio web de la lista y hacer clic en el botón Añadir.
Al hacer clic en esa opción, accederás a la pantalla de edición de la página elegida. Desde allí, haz clic en el icono de signo más (+) y selecciona el widget Custom Facebook Feed.
Cuando actualices o publiques la página, podrás previsualizarla para ver cómo quedan tus eventos.
6. Añadir eventos de Facebook a las barras laterales de WordPress
Si prefieres añadir tu feed a una zona de la barra lateral, sólo tienes que hacer clic en el botón Añadir a un widget de la ventana Incrustar.
Al hacer clic en esa opción, accederás a la página de widgets, donde podrás elegir una barra lateral para mostrar tus eventos.
Después de elegir una barra lateral, haz clic en el icono más (+) para añadir un nuevo widget y elige el widget personalizado de Facebook Feed.
Una vez hecho esto, podrás previsualizar tu sitio web y ver los eventos de Facebook en la barra lateral.
Añadir eventos de Facebook a WordPress sin un plugin
Si no te gusta utilizar demasiados plugins de WordPress en tu sitio web, puedes mostrar eventos de Facebook en WordPress sin necesidad de un plugin.
Sin embargo, este método requiere que añadas algo de código a tu sitio, por lo que no es algo que recomendemos a los principiantes. Tampoco ofrece mucho control sobre el aspecto de los eventos.
1. Visita el sitio web del plugin de la página de Facebook.
Para empezar con este método, necesitarás el plugin de página de Facebook. No se trata de un plugin de WordPress, sino de una herramienta independiente de Facebook para desarrolladores.
Así que dirígete a la herramienta Facebook Plugin y pega la URL de tu página de Facebook.
Después de introducir la URL de tu página de Facebook, la herramienta mostrará una vista previa de tu línea de tiempo. Como queremos mostrar tus eventos de Facebook, borra la palabra "timeline" en el campo Pestañas e introduce "eventos".
2. Generar el código de incrustación del evento de Facebook
El panel de vista previa muestra ahora una lista de los eventos de su página. Para obtener el código, haz clic en el botón Obtener código situado debajo de la vista previa.
Al hacer clic en el botón Obtener código, se abre una ventana emergente con dos pestañas: JavaScript SDK e IFrame. Haz clic en la pestaña IFrame y copia el código incrustado en el portapapeles.
3. Insertar el código de eventos de Facebook en WordPress
A continuación, dirígete a tu sitio web de WordPress y edita la entrada o página en la que quieres mostrar tus eventos de Facebook.
En la pantalla de edición de la entrada o página, haga clic en el icono más (+) y busque el bloque HTML personalizado de WordPress.
Ahora, haz clic dentro del bloque HTML y pega el código de incrustación de la herramienta del complemento de página de Facebook.
A continuación, puedes guardar o publicar la entrada y, al previsualizarla, tus eventos de Facebook aparecerán en directo en tu sitio web.
Si quieres cambiar cómo se muestra este feed, tendrás que volver al plugin de página de Facebook y generar de nuevo el código wp embed Facebook. Dicho esto, la configuración de Facebook que puedes cambiar es limitada.
Utilización de la URL de iCal para la sincronización de eventos
Si quieres integrar tus eventos de Facebook en el calendario de tu sitio web, utilizar una URL de iCal es un método eficaz.
A continuación te explicamos cómo obtener y utilizar la URL de iCal:
Accede a tu cuenta de Facebook, ve a la sección de eventos y selecciona el evento que quieras compartir.
En la parte superior derecha, verás un botón llamado Añadir al calendario.
Haga clic en este botón y, en la ventana emergente, haga clic con el botón derecho del ratón en el botón Exportar y seleccione "Copiar dirección de enlace".
Pega esta URL de iCal en tu plugin de calendario de WordPress o en cualquier herramienta que admita feeds externos. Así podrás sincronizar automáticamente tus eventos de Facebook con tu calendario de eventos de WordPress.
Esto sincronizará automáticamente tus eventos de Facebook con el calendario de tu sitio web.
Preguntas frecuentes sobre la incrustación de eventos de Facebook
¿Cómo puedo personalizar la apariencia de los eventos de Facebook en WordPress?
Para personalizar más allá de las opciones de esta guía, es posible que necesites CSS o JavaScript personalizados. Los usuarios con conocimientos de codificación pueden modificar directamente los estilos o scripts de su tema de WordPress o utilizar un tema hijo para aplicar estilos más personalizados a la fuente de eventos de Facebook.
¿Cómo puedo solucionar los problemas que surgen cuando no se muestran los eventos de Facebook?
Si los eventos de Facebook no se muestran en tu sitio de WordPress, busca problemas comunes como plugins obsoletos, conflictos con otros plugins o una configuración incorrecta de la API de Facebook. Asegúrate de que todos los plugins están actualizados y revisa la documentación del plugin para comprobar que la configuración es correcta.
¿Puede afectar al rendimiento de mi sitio la incrustación de eventos de Facebook?
Incrustar un calendario de eventos de Facebook en WordPress puede afectar al rendimiento si la incrustación carga demasiados recursos. Para reducir los tiempos de carga, utiliza herramientas como SeedProd o Smash Balloon, que están optimizadas para mostrar feeds sociales sin ralentizar tu sitio.
¿Puedo incrustar eventos de grupos de Facebook en WordPress?
La mayoría de las herramientas de incrustación de Facebook sólo admiten eventos de páginas públicas, no eventos privados o de grupo. Si gestionas un grupo de Facebook, prueba a utilizar el método de sincronización de iCal o a incluir manualmente tus eventos en una página de WordPress.
Ahora ya sabes cómo incrustar tus eventos de Facebook directamente en WordPress, tanto si quieres una fuente de eventos completa, una única pestaña o una sincronización con el calendario.
¿Quieres mejorar la conversión de tus eventos? Pruebe a crear una página de aterrizaje para eventos con SeedProd.
Puede que también te gusten las siguientes guías para tu sitio WordPress:
- Cómo añadir una página de Facebook a WordPress
- Cómo insertar vídeos de Facebook en WordPress
- Cómo añadir un botón "Me gusta" de Facebook a tu sitio WordPress
- Cómo crear fácilmente una página de destino de grupo en Facebook
Gracias por leernos. Nos encantaría conocer tu opinión, así que no dudes en unirte a la conversación en YouTube, X y Facebook para obtener más consejos y contenidos útiles para hacer crecer tu negocio.
