Publicar reproductores de Brightcove en artículos instantáneos de Facebook

Los artículos instantáneos de Facebook son una experiencia rápida e interactiva para leer artículos en una sección de noticias de Facebook. Los artículos instantáneos se pueden publicar directamente desde un sistema de gestión de contenido (utilizando la API de artículos instantáneos) o proporcionando una fuente RSS. Los artículos instantáneos se muestran hasta diez veces más rápido que los artículos web móviles estándar. Cuando un amigo o una página a la que sigues comparte un enlace en tu News Feed, Facebook verificará si hay un artículo instantáneo asociado con esa URL. Si es así, Facebook lo mostrará como un artículo instantáneo. De lo contrario, se abrirá en el navegador web.

Los reproductores de Brightcove que están integrados en Instant Article continúan admitiendo:

• Publicidad pre-roll y mid-roll
• Análisis de Brightcove
• Complementos de terceros

Tenga en cuenta que aunque Brightcove recopilará los análisis, el dominio de visualización registrado en los análisis será un brightcove.com dominio, no un facebook.com dominio.

Si bien se pueden compartir diferentes tipos de contenido mediante los artículos instantáneos, este tema trata sobre cómo compartir reproductores de Brightcove en páginas de artículos instantáneos. Para obtener información completa sobre los artículos instantáneos, consulte el Documentación de Facebook.

Generando código de inserción del reproductor

No se necesitan cambios en las propiedades del reproductor para usarlo en un artículo instantáneo. Siga estos pasos para generar el código de inserción del reproductor para un artículo instantáneo:

1. Tome el código de incrustación de iframe estándar de Video Cloud Studio y colóquelo dentro de un HTML5 <figure> elemento.

   	<figure>
   	<iframe src="//players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001"
   	 allowfullscreen webkitallowfullscreen mozallowfullscreen width = "640" height = "360"> </iframe>
   	</figure>
   	        

2. Añade el op-interactive clase a la figure etiqueta.

   	<figura class = "op-interactive">
   	<iframe src = "// players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001"
   	 allowfullscreen webkitallowfullscreen mozallowfullscreen width = "640" height = "360"> </iframe>
   	</figure>
   	        

3. Dale al iframe un width y height. La width y height establezca la relación de aspecto en lugar del tamaño absoluto del reproductor. El código terminado se verá así:

   	<figure class = "op-interactive">
   	<iframe src = "// players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001"
   	 allowfullscreen webkitallowfullscreen mozallowfullscreen ancho = "16" alto = "9"> </iframe>
   	</figure>