Tlfs: 91 494 45 24 - 608 408 159 - Creando paginas web desde 2001 - Diseño web, Diseño gráfico, SEO y SEM info@ideaweb.es

Facebook Live en WordPress

En cualquier blog o sitio web en general cada día está más de moda añadir videos y si pueden ser los de nuestras propias redes sociales mejor que mejor.

Actualmente la novedad son los Facebook Live, que son una característica muy atractiva para añadir a nuestras publicaciones o páginas de WordPress.

Facebook también se ha apuntado a la moda de producir contenido en video, pero para enganchar al público con esta novedad hay que facilitar su producción simplificando el proceso y haciéndolo más asequible para todo el mundo.

Y claro, una vez que ya nos hemos lanzado a producir nuestros videos con Facebook Live seguro que queremos dar un paso más y como no puede ser de otra forma, integrarlos en nuestro blog o páginas de WordPress para que estos contenidos lleguen a más público. Será una buena idea integrar Facebook Live en WordPress.

El problema es que integrar estos contenidos no es todavía tan sencillo como hacerlo con un vídeo de YouTube, por ejemplo. Esto sucede porque por un lado WordPress todavía no lo ha integrado pero Facebook tampoco lo pone fácil, posiblemente porque prefiere que los usuarios se queden más tiempo en su plataforma y no accedan a su contenido desde cualquier otro lugar o puedan irse a ellos.

Actualmente lo que Facebook nos recomienda para añadir sus videos a nuestro WordPress es que utilicemos su Configurador de Video para generar el código necesario y ponerlo en nuestro sitio web. Aunque esto es lo que recomienda, también nos proporciona un código para cada vídeo que podemos copiar y pegar en nuestra publicación o página.

En este tutorial vamos a intentar dar diferentes opciones o caminos para poder incrustar estos videos de Facebook Live en WordPress, más exactamente en una entrada o página de nuestro propio WordPress, a pesar de que Facebook no ha facilitado todavía este proceso.

 

Distintas formas de integrar un Facebook Live

  1. Mediante plugins de reproductor de videos
  2. Mediante la herramienta de reproductor de video incorporada
  3. Mediante el código de incrustación de video

 

1. Mediante plugins de reproductor de videos

Una vez más los plugins vienen a facilitarnos la vida y a ayudarnos a conseguir lo que queremos. Veamos algunos:

a) Facebook Live Video Auto Embed para WordPress

Es un plugin muy fácil de usar que hace exactamente lo que necesitamos: incrustar nuestros videos de Facebook Live en WordPress automáticamente. Este plugin detecta automáticamente tu cuenta de Facebook (si está activa) y te ayuda a mostrarla en el lugar de tu WordPress que quieras.

Entre sus opciones, podrás también elegir videos grabados con anterioridad y publicados en tu cuenta y mostrarlos ahora en tu sitio web.

Integracion Facebooklive 1

Descargar

 

b) Constructor Elementor

También podemos ayudarnos de uno de los bloques del constructor Elementor, Facebook Embed block, o bloque de incrustación de Facebook. Para poder utilizarlo y que funcione, tienes que añadir o configurar la ID de la APP de Facebook, para la integración de Facebook y WordPress.

Integracion Facebooklive 2

Descargar

 

c) Plugin WP Live Stream para WordPress

Este plugin sirve justo para lo que estamos buscando: embebe videos en directo en nuestro sitio web. Además ofrece múltiples opciones para hacerlo y personalizarlo.

Integracion Facebooklive 3

Descargar

 

2. Mediante la herramienta de reproductor de video incorporada

Aunque Facebook no nos lo pone tan fácil como pudiéramos pensar, sí ha creado una herramienta de desarrollo para que cualquier usuario pueda obtener un código que al meterlo en su publicación, permita mostrar Facebook Live en WordPress, tal y como estamos buscando. Esta herramienta nos permite configurar los ajustes principales del video para así adaptarlo mejor a nuestras necesidades.

Lo primero que necesitamos es conseguir la URL del video en cuestión. Para ello, nos colocamos sobre el video y hacemos click en el botón derecho del ratón. Elegimos la opción “Mostrar la URL del video”. Una vez mostrada la podemos copiar.

A continuación tendremos que ir a la herramienta de reproductor de videos de Facebook (en el sitio web de los desarrolladores de Facebook) y pegar la URL de nuestro video.

En ese mismo cuadro podrás definir el ancho de pixel del video y marcar o no la opción de incluir la publicación completa.

Integracion Facebooklive 4

La última opción que nos ofrece es la de «Obtener el código». Pincha ahí y ya lo tienes.

Una vez que hemos obtenido el código hay dos formas diferentes de incrustarlo:

  • Mediante Javascript SDK
  • Mediante IFrame

La más sencilla es sin duda la opción del IFrame. Tan sólo tienes que colocar el código donde quieres que aparezca el video y listo.

Integracion Facebooklive 5

Pero si quiere utilizar la otra opción hay que trabajar un poquito más. El código que te proporciona JavaScript SDK tendrá dos partes; la primera parte la tendrás que pegar justo debajo de la etiqueta de apertura del cuerpo y una segunda parte que deberás pegar en el lugar exacto que quieres que aparezca el video.

Integracion Facebooklive 6

 

3. Mediante el código de incrustación de video

Si no necesitas nada demasiado específico en cuestión de diseño y quieres hacerlo de una forma muy sencilla, te bastará con copiar y pegar el código para embeberlo en cada post que queramos. Así también podremos conseguir mostrar nuestro Facebook Live en WordPress

Lo más complicado de esta opción es encontrar dónde está ese código que necesitamos para embeber o incrustar el video. Lo primero que debemos encontrar es el icono que hay en la parte superior derecha cuando reproduces el video.

Al hacer click en el icono aparecerá un menú desplegable con varias opciones, elegiremos “Embed”. Al seleccionarla aparecerá el código que debes copiar y pegar en tu editor de WordPress, en la publicación que quieras que se muestre.

Esta ventana también te dará la opción de mostrar una vista previa y podrás incluir el post completo junto al video.

Si decides ir un poco más allá, puedes elegir la configuración avanzada, la dirección URL se copiará automáticamente en la herramienta  y ya podrás cambiar el resto de las configuraciones si lo necesitas.

Integracion Facebooklive 7

A continuación vamos a ver cuál es al menos el aspecto de la página que Facebook ha creado para ayudarnos en esta tarea:  Facebook for developers page

Integracion Facebooklive 8

 

Tan sólo hay que seguir los pasos que nos pide y configurarlo como lo queramos. Al final tenemos un botón para Obtener el Código.

Integracion Facebooklive 9

Recuerda que este código no sólo lo podremos poner en post o páginas de nuestro sitio web, también lo podremos añadir a una barra lateral o un pie de página mediante un widget.

Para hacerlo nos podemos ayudar de plugins como JetPack y mostrar el widget Facebook like box. También podemos encontrar opciones similares en otros widgets de Facebook de diferentes plugins de WordPress.

Y después de esto, seguro que ya tienes lo que querías y has conseguido que tus videos de Facebook o tu Facebook Live aparezcan en tu sitio web.

Si aun así no se ven los videos deberías revisar otras cosas como por ejemplo:

  • El video que quieres mostrar es público. Si el video no es público mostrará un mensaje de que no está disponible.
  • Si el video es de un perfil personal debes revisar la configuración de privacidad.
  • También hay que asegurarse de que no haya ninguna restricción de edad o por el contenido porque en ese caso Facebook no permite que se incrusten en otros sitios.

 

Esperamos que este tutorial te haya sido útil mientras esperamos que Facebook siga trabajando, como ya lo están haciendo, en facilitarnos un poquito más este proceso de integrar Facebook Live en WordPress y hacerlo accesible para cualquier usuario. Seguro que pronto tenemos opciones más sencillas.

Pero si hasta entonces necesitas ayuda o tienes cualquier problema con tu sitio WordPress no dudes en contactar con nosotros y te ayudaremos.