Insertar videos de Facebook

Si simplemente embebemos los vídeos de Facebook, aparecen cortados en pantallas pequeñas. Queremos embeberlos de manera “responsive”.

Configuración inicial

Esto ya se ha hecho y no hace falta hacerlo de nuevo.

1. Instalar plugin “Simple Custom CSS and JS“
2. Activar e ir a settings.
3. Crear un nuevo código CSS y copiar y pegar:

.iframe-container {
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
}
.iframe-container iframe {
  border: 0;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

Cada vez que quieras incluir un video

1. Ir al video de Facebook y en la esquina superior derecha, hacer clic en los tres puntitos y buscar opción de copiar enlace.
2. Generar iframe en https://developers.facebook.com/docs/plugins/embedded-video-player
3. Copiar iframe y pegar en editor de texto plano ej "https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Ffb.watch%2F8JyprN1Qw9%2F&width=500&show_text=false&height=281&appId"
4. Incluir al principio y al final una etiqueta div: https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Ffb.watch%2F8JyprN1Qw9%2F&width=500&show_text=false&height=281&appId
5. En la página o post, agregar un bloque de HTML y pegar el código.