Como colocar un video en artículos instantáneos de facebook


Hola, en esta ocasión vengo a compartirte un tutorial sobre como colocar un video en artículos instantáneos de facebook.

Como sabrás facebook te da la oportunidad de ganar dinero online por medio de los artículos instantáneos de facebook, si quieres saber como construir un artículo instantáneo de forma manual sigue este enlace, Como construir un artículo instantáneo de facebook de forma manual Este tutorial de como colocar un video en artículos instantáneos es aplicable para blogger, pero si estás en wordpress pueda que también te sirva.


¿Que dice facebook sobre colocar un video en artículos instantáneos?

Cuando uno ya está un tiempo usando artículos instantáneos de facebook comprende que hay muchas cosas que facebook usa son netamente lenguaje HTML para artículos instantáneos.. como que facebook cree que somos expertos programadores de lenguaje html y no solamente eso sino que el lenguaje htlm que facebook usa es un lenguaje particular de facebook.. ya que varias cosas del htlm común facebook lo desecha y solo aprueba los que son aplicables para artículos instantaneos.

Aquí no vamos a profundizar en entender el lenguaje html aunque si es necesario conocer las cosas básicas y el valor o significado que tienen algunas etiquetas.. ya que constantemente estaremos aplicando a nuestro artículos instantaneos las etiquetas de párrafo <p>, imagen <figure> y video <figure>. Además de saber que algunas de estas etiquetas pueden llevar agregadas más comandos o atributos que le dan una carácteristica especial a esa etiqueta.. Y hay que saber esto sobre todo cuando vamos a agregar un video a artículos instantáneos.

¿Pero que dice facebook sobre como agregar un video en artículos instantáneos?

To eso lo encuentras en facebook para desarrolladores en la parte de videos Ahí si te fijas en la parte de la izquierda también hay para imagen, autor, pie de página, leyenda, incerciones, encabezado, etc., etc Pero hoy solo vamos a tratar sobre el tema de video. Si yendo al sitio de facebook para desarrolladores lo encuentras como en chino la explicación que hace facebook.. puedes continuar leyendo este post que aquí explicaré algunas cosas..

Facebook dice que si es posible incluir videos en artículos instantáneos y se hace con la etiqueta <figure> osea la etiqueta <figure> y </figure> (con slash).. estos deben ir a los extremos y en medio deben ir otras etiquetas y el enlace de youtube donde está nuestro video... además dice que el video se traslada automáticamente con el rss de blogger (este tutorial es de blogger por eso menciono rss de blogger) cuando se traslada nuestro articulo o entrada del blog a artículos instantáneos sin que tengamos que hacer nada más. Además dice que el video no debe ir al inicio del artículo ni debe ser encerrado como un párrafo.. es decir con las etiquetas <p></p>. Luego dice que el video no se mostrará como vista previa cosa que no entendí.. pero con que el visitante clickee nuestro enlace de un artículo instantáneo.. sea en la fan page o en otro sitio que lo publiquemos y se vea correctamente con párrafo al inicio y luego un video con eso basta.

En mi caso particular tengo 2 artículos instantáneos con video que el rss mismo lo traslado de blogger a artículos instantáneos a la biblioteca artículos de producción y de desarrollo (en mi caso yo no uso el rss para artículos de producción, porque quiero que una vez que esté escrito ya no se cambie nada más). Estos 2 artículos uno si se veía el video y el otro no.. asi que tuve que hacer correcciones viendo el htlm (en articulos instantaneos.. en de producción) del artículo que si se ve el video y siguiendo las recomendaciones de facebook.

Cabe recalcar que colocando un parrafo en artículos instantáneos luego el video y luego más párrafos ya con eso conseguimos que el video se logre ver y sorteamos el primer obstáculo que dice "el video no debe ir al inicio del artículo"

Ahora, si a pesar de que nuestra entrada de blogger con el video se traslado con el rss pero usando el administrador de páginas (app que siempre debemos usar para comprobar) no logramos ver el video debemos hacer algunas correcciones..

Todas las correcciones se hace en el html de artículos instantáneos en la parte de "de producción" y terminado se lo guarda. Por otro lado si quieres que tu artículo instantáneo concuerde con tu entrada de blogger también ahí podrías modificarlo.. me refiero a poner un párrafo y luego el video.

Correcciones (todas) o Resúmen

1.- El video no debe ir al inicio.. entonces ponemos un párrafo primero y luego el video pero el video tampoco debe ir encerrado entre <p>y</p>

2.- Luego aplicamos este modelo para videos en artículos instantáneos..

Pero antes.. hay que saber que cuando insertamos un video de youtube en nuestra entrada.. en el html lleva esta forma:

código en blogger

<iframe width="700" height="425" src="https://www.youtube.com/embed/r4rYUUNqgrk?ecver=1" frameborder="0" allowfullscreen></iframe>

Ahora el video en artículo instantáneo lleva otra etiqueta más a sus costados <figure.......>  y </figure>  y dentro de esa etiqueta <figure..> la de la izquierda, lleva aumentado el atributo class="op-interactive" Este atributo hará que el usuario visitante tenga que pulsar para ver correr el video.

código terminado en artículo instantaneo..

<figure class="op-interactive"><iframe allowfullscreen="" frameborder="0" height="425" src="https://www.youtube.com/embed/r4rYUUNqgrk?ecver=1" width="700"></iframe></figure>

lo que cambió:

a) Se agregó la etiqueta <figure> para videos.. para imágenes también se usa <figure>
b) A la etiqueta figure se le agregó un atributo.. class=op-interactive
c) (Opcional) Si al final de la url del video.. donde termina su codigo ejem.. r4rYUUNqgrk no lleva ?ecver=1 se debe de agregarlo.. es opcional.. si tu enlace de youtube no tiene, no lo pongas..
d) La característica allowfullscreen que se ve en la inserción del video en la entrada de blogger.. en artículos instantaneo lleva ademas (="") que al no tener ningún valor o número dentro de las comillas podría ser lo mismo que como sale en html de blogger pero es mejor ponerlo como allowfullscreen=""
e) las medidas height="425" y width="700" se coloca manualmente que en caso tuyo serán otras.. obviamente.

Final.- En caso de videos trasladados a artículos instantáneos (de forma manual) no se ha hecho muchas pruebas (en caso mío).. como por ejemplo ¿que pasa si las medidas del video las dejo con cualquier medida.. como se vería en artículos instantáneos.. si afecta o no la forma visual y cosas así.. asi que eso lo comprobaré mas adelante..

Share on Google Plus

About Luis Torres

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.

1 comentarios:

  1. Ever wanted to get free Twitter Followers?
    Did you know you can get these AUTOMATICALLY & ABSOLUTELY FREE by registering on Like 4 Like?

    ResponderEliminar

Por favor sea cortés.. mensajes subidos de tono y fuera de lugar serán eliminados.