Quantcast
Channel: Facebook | Ayuda WordPress
Viewing all articles
Browse latest Browse all 34

Cómo insertar vídeos de Facebook en WordPress

$
0
0

Es innegable que Facebook es la red social más visitada en todo el mundo, y entre todo lo que se publica lo que más éxito tiene siempre son los vídeos, así que puede tener sentido compartir este tipo de contenidos también en tu WordPress ¿no?

Además, que es muy fácil.

Insertar un vídeo de Facebook en WordPress

El primer paso es identificar el vídeo, y para obtener el código de inserción debes desplegar la flechita en la parte superior derecha de la actualización donde esté publicado.

abrir-video-fb-para-insertar

A continuación se abre una ventana emergente donde tienes el código para insertar el vídeo, simplemente cópialo.

codigo-insertar-video-facebook-en-wordpress

Ahora ve a tu editor de WordPress y en la pestaña HTML pega el código copiado.

insertando-video-fb-en-wordpress

Y ya podrás pasar a la pestaña Visual para comprobar que el vídeo se ve y se puede reproducir.

video-facebook-insertado-en-entrada-wordpress

Solo te quedaría publicar la entrada para que el vídeo esté visible y se pueda reproducir.

video-facebook-en-entrada-wordpress

Y lo verías como aquí abajo…

Si quieres puedes personalizar el aspecto del vídeo simplemente modificando parámetros del código iframe que te ofrece Facebook, estos:

  • Ancho del reproductor: cambia el número de píxeles del width.
  • Altura del reproductor: cambia el número de píxeles del height.
  • Permitir o no pantalla completa: puedes cambiar el valor allowfullscreen entre true (permitir) o false (no permitir).
  • Mostrar también el texto de la publicación o solo el vídeo: simplemente pon el valor showtext en true (mostrar) o false (no mostrar)
  • Marco del vídeo: puedes decidir si se mostrará un marco como borde del vídeo poniendo el parámetro frameborder en 0 (no mostrar) o eligiendo un número mayor (1, 2, etc) para mostrarlo más o menos ancho.
  • Transparencia: el vídeo puede tener un fondo a su alrededor o que sea transparente, simplemente elige si el parámetro allowTransparency estará en true (transparente, lo que mejor se adapta a todo diseño) o false.

Cómo hacer que se reproduzca automáticamente un vídeo de Facebook en WordPress

Ahora bien, una de las mejores cosas de los vídeos en Facebook es que se reproducen automáticamente, y si quieres que también sea así en tu WordPress se insertan de otro modo bastante diferente.

Lo primero es insertar la llamada al JavaScript de Facebook para reproducir vídeos automáticamente, esta:

<!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

Siempre comprueba antes en esta página el código, porque a veces lo cambian.

Copia el código y sitúalo en la cabecera de tu tema antes del cierre </body>, al principio del archivo header.php o casi al final del archivo footer.php. Por supuesto, mejor hazlo en el tema hijo, copiando antes el archivo.

insertar-sdk-facebook-body-wordpress

Guarda los cambios y ya tienes el primer paso hecho. Ahora toca insertar el código del vídeo, que no se hace igual que como hemos visto antes.

Ve al vídeo de Facebook y localiza la URL del vídeo que quieres insertar haciendo clic derecho sobre el vídeo y eligiendo la opción de Show video URL.

Ahora que ya tienes la URL lo insertarás en tu entrada de WordPress con un código así:

<div class="fb-video"
  data-href="URL_DEL_VIDEO_AQUI"
  data-width="500"
  data-allowfullscreen="true"></div>

Sustituyendo la URL del vídeo en la línea data-href, por supuesto, por ejemplo:

<div class="fb-video"
  data-href="https://www.facebook.com/david.blancosanchez.965/videos/687382688105966/"
  data-width="500"
  data-allowfullscreen="true"></div>

Como verás, aquí también hay otros parámetros, los que puedes usar son los siguientes:

  • data-href: simplemente la URL del vídeo.
  • data-widht: el ancho del reproductor.
  • data-allowfullscreen: si permitirás el vídeo a pantalla completa (true) o no (false)
  • data-autoplay: si el vídeo se reproducirá automáticamente (true) o no (false).
  • data-show-text: si se mostrará el texto de la publicación del vídeo (true) o no (false)
  • data-show-caption: si se mostrará el pié de vídeo (true), que solo se ve en ordenador, no en móviles, o no (false).

Como ves hay dos maneras de insertar vídeos en las publicaciones de tu web WordPress, el rápido (arriba) y el modo con reproducción automática, que requiere modificar la cabecera de tu tema. La decisión es tuya.

Esto que lees es un contenido original de Ayuda WordPress - Recursos, themes, plugins y tutoriales en español y lo publicó Fernando primero aquí: Cómo insertar vídeos de Facebook en WordPress


Viewing all articles
Browse latest Browse all 34