Como construir un artículo instantáneo de facebook de forma manual




Facebook te brinda la oportunidad de generar ingresos con tu blog por medio de Artículos Instantáneos de Facebook. Es un sistema parecido al de adsense pero el tráfico para artículos instantáneos proviene de facebook. Se llama artículos instantáneos porque los artículos son visualizados de una forma casi inmediata. Se crea una entrada (artículo) similar a nuestra entrada de nuestro blog y es transformada en código html en el apartado de artículos de producción en la fan page de facebook. El usuario que visita esa entrada por medio de su móvil tendrá la facilidad de ver el artículo de una forma rápida y bien diseñada.. el usuario no saldrá de facebook puesto que los artículos instantáneos son visualizados dentro del mismo facebook si se los ve desde un móvil.

El sistema trabaja desde el 2015 y muchos lo han aprovechado ya.. la mayoría de wordpress porque cuentan con un plugin que creará automáticamente los artículos instantáneos que el usuario publique en su blog o web.. y en facebook simplemente tendrá que activarlo y publicar esa entrada como si publicara cualquier articulo de su blog de manera normal. El problema radica ahora en que los usuarios de blogger, que si bien tienen una fuente de alimentación rss que también genera los artículos instantaneos de manera automática, por alguna razón, algunos artículos no los crea bien y facebook los observa y le dice que el artículo adolece del tal error y que debe corregirlo para que este 100% bien.

Muchos se detienen en esta parte (me incluyo) y para cuando facebook observa el artículo y lo corregimos desde el htlm de los artículos de producción en ocasiones no se puede corregir. Al principio se debe mandar 5 artículos hechos en nuestro biblioteca de artículos de producción para comenzar a publicar y comenzar a ganar por la visitas o los clicks que den en los anuncios y muchos no pueden pasar esta parte..

Desde aquí construiremos un artículo completamente manual

Si usas wordpress y tu plugin para crear artículos instantaneos no funciona también te puede servir

Si te has detenido en esta parte y no encuentras una solución modificando el html desde artículos de producción que te generó el rss de blogger esta podría ser una opción.. hasta encontrar otra mas sencilla. Tendrá que redactar todo el artículo instantáneo bajo una plantilla que el mismo facebook te otorga y se encuentra en la siguiente dirección https://developers.facebook.com/docs/instant-articles/reference Llegado al sitio solo bajas hasta "artículo de ejemplo". Puedes copìarlo todo y pegarlo en un block de notas (abajo aconsejo guardarlo en una hoja de word) y guardarlo en tu pc, pero en la plantilla que te muestro abajo tiene algunas modificaciones y también podrían servirte como modelo si haces todo lo que se indica y borrando conforme avanzas todas las anotaciones en rojo que he puesto en esa plantilla.

Luego de tener tu plantilla y haber hecho las modificaciones correctas en otro block de notas (o en word para seguir viendo las anotaciones en rojo).. solo lo copias y lo pegas en el artículo que es observado (antes debes borrar todo lo que generó el rss de blogger y dejarlo en blanco). Después de pegar tu artículo instantáneo correctamente hecho guardas ese artículo con "Save" y ya no te aparecerá ninguna observación y si estás para mandar tus 5 artículos se te habilitará el botón de mandar otra vez cuando corrijas los errores y guardes el artículo (Save).

Plantilla modificada.. en especial el <meta> (se agregó otro meta) que permite que coloquemos el anuncio en el lugar que deseemos.. pero leer en la plantilla sobre las distancias entre los anuncios:

Observación.- mejor copiar toda la plantilla y pegarlo en word en modo conservar formato de origen.. y luego conforme se avanza vas borrando lo rojo.. y al final solo copias todo (de word) y lo pegas en el artículo que van a reemplazar (previamente habría que borrar el articulo que nos formó el rss de blogger.. pero no hay problema, queda una copia todavía en artículos de desarrollo). IMPORTANTE: Si el rss que pusiste para artículos de "producción" te va actualizando constantemente lo que hay en tu blog y lo va colocando en artículos de producción.. mejor borras ese rss y solo te quedas con el rss que va en artículos de desarrollo.
NOTA IMPORTANTE: Buscando la simplicidad y sabiendo que al principio buscamos que solo facebook audienbce network nos aptuebe con nuestraos 5 artículos he elimibnado la parte donde iría el código de ggogle Analityc para una entrada o artículo

<!doctype html>
<html lang="en" prefix="op: http://media.facebook.com/op#">
  <head>
    <meta charset="utf-8">
    <link rel="canonical" href="http://example.com/article.html (Es La Url de la entrada)">
    <meta property="op:markup_version" content="v1.0">
<meta property="fb:use_automatic_ad_placement" content="false"> Otro meta (agregado) para ubicar el anuncio donde uno quiere… 100 palabras de distancia el primero aconseja facebook y el Segundo a 200 del primer anuncio (una imagen cuenta como 70 palabras)
  </head>
  <body>
    <article>
<header>
        <!-- The title and subtitle shown in your Instant Article --> Aquí abajo entre <h1> y >/h1> va el título de la entrada
        <h1>Faucetbox cierra sus actividades online el 19 de diciembre del 2016</h1>

        <!-- The date and time when your article was originally published --> las fechas de abajo se coloca el día en que nació “la entrada en el blog” mas no la fecha de la última modificación (las 2 fechas son iguales)
        <time class="op-published" datetime="2016-12-19">diciembre 19, 2016</time> fecha 1

        <!-- The date and time when your article was last updated -->
        <time class="op-modified" dateTime="2016-12-19">diciembre 19, 2016</time> fecha 2

        <!-- The authors of your article -->
        <address>
          <a rel="facebook" href="https://www.facebook.com/shoper.vilca">Luis Torres</a> Aquí se pone una url de un perfil, sea facebook, linkedin etc.. yo puse mi perfil de facebook y mi nombre Luis Torres
          Practicante en posicionamiento en buscadores u optimización de motores de búsqueda SEO.
        </address> Y aquí arriba puse mi cargo o lo que creo que es mi area en que me desempeño
     

        <!-- The cover image shown inside your article --> Lo de abajo es la imagen ancla o imagen principal de mi entrada, la etiqueta <figure> también las otorga Facebook.. o copiar este modelo y poner la url de su imagen ancla o principal
        <figure>
          <img src="https://3.bp.blogspot.com/-hSBx2PdwVIk/WLl0sOl5jUI/AAAAAAAABMk/uy6QgiI8m3FrKgblDC2qCYcp-ACLcB/s1600/recoger%2Bsatoshis%2Bvirtualpub.jpg" />
        </figure>  

      </header>

      <!-- Article body goes here -->  El cuerpo del articulo empieza aquí

      <!-- Body text for your article -->

      <p> Primer párrafo de tu artículo aquí </p>
      <p> Un párrafo de tu artículo </p>
      <p> Un párrafo de tu artículo </p>

Ejemplo de CODIGO de anuncio que debes pegar..
<figure class="op-ad">
  <iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=62XXXXXXXX00717_6260XXX075716&adtype=banner300x250"></iframe>
</figure>


  <p> Un párrafo de tu artículo </p>
      <p> Un párrafo de tu artículo </p>


      <p> Un párrafo de tu artículo </p>

      <p> Un párrafo de tu artículo </p>
otra imagen...
        <figure>
          <img src="https://3.bp.blogspot.com/-hSBx2PdwVIk/WLl0sOl5jUI/AAAAAAAooooogiI8m3FrKgblDC2qCYcp-ACLcB/s1600/recoger%2Bsatoshis%2Bvirtualpub.jpg" />
        </figure>  

      <p> Un párrafo de tu artículo </p>
      <p> Un párrafo de tu artículo </p>
      <p> Un párrafo de tu artículo </p>

Ejemplo de CODIGO de anuncio que debes pegar..
<figure class="op-ad">
  <iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=6262XXXXX0717_626XXX075716&adtype=banner300x250"></iframe>
</figure>

  <p> Un párrafo de tu artículo </p>
      <p> Un párrafo de tu artículo </p>


      <p> Un párrafo de tu artículo </p>


      <!-- A video within your article --> tag o etiqueta si tu articulo tiene video
      <figure>
        <video>
          <source src="http://mydomain.com/path/to/video.mp4" type="video/mp4" />
Los Videos son creados automáticamente con el rss de blogger.. pero como aquí estamos de forma manual.. buscamos en el HTML de la entrada el video.. y pegamos ese código.. entre etiquetas <figure...>, </figure>
        </video>
      </figure>

      <footer>
        <!-- Credits for your article --> Créditos, osea autor.. (borrar Luis Torres y colocar el autor del post o artículo, o entrada)
        <aside>Luis Torres</aside>

        <!-- Copyright details for your article --> Derechos de autor, si queréIs copiar y pegar lo de abajo
        <small>Derechos reservados © 2017</small>Si da error esta parte es porque no has puesto derechos de autor en tu blog.. osea la palabra Derechos reservados © 2017
      </footer>
    </article>
  </body>

</html>

Detalles importantes para completar de saber como se hace este tipo de artículo

1.- El tag o etiqueta para formar enlaces dentro del artículo.. por ejemplo si pones.. toda la información Aquí (y el Aquí es un enlace que has hecho en blogger) se hace con las etiquetas <a href=...> Texto <a> ejemplo abajo. Ademas este no abre otra pestaña.. (quitar lo rojo y poner la url a donde irá la persona)

<a href="http://ganadineroconbitcoin.blogspot.pe/2017/05/gana-bitcoins-de-forma-gratis.html">Texto por ejem Aquí, o pegar el enlace otra vez</a>

2.- Todas las tags o etiquetas que usará facebook para construir artículos instantaneos y el modelo de artículo instantaneo se encuentra aquí https://developers.facebook.com/docs/instant-articles/reference Los tags para imagenes, videos, y otras cosas más se encuentran en el menú de la izquierda de ese sitio

3.- Es necesario que conozcas la url de tu imagen ancla para colocarlo arriba.. si tienes más imágenes también es necesario conocer esa url y reemplazar esa dirección para ponerlo en nueva etiqueta <figure> </figure>

4.- Para copiar la url de las imágenes como sabrás se hace con el clik derecho del mouse y seleccionar Url... En mi caso mi ratón anda mal y lo hago por otro metodo más largo. Para ver como se hace desde una pc y dispositivo móvil aquí lo puedes ver https://support.google.com/websearch/answer/118238?hl=es-419

5.- Tu blog debe tener un código de seguimiento de google analitics.. aunque algunos dicen que se puede obviar colocarlo.. yo tengo ese código en mi blog y no se como sería si no lo pusiera.

¿Como consigo mi código de anuncio que irá en mi artículo instantáneo?

Pues primero debes crear una ubicación... hay tutoriales.. hay que crear entonces una ubicación. Una vez creado entonces simplemente lo ubicas, desde audience network >> en Ubicaciones y das click al botón Obtener código


Luego de dar click en obtener código te saldrá articulos instantaneos y seleccionas el que dice rectángulo (ojo, es importante que salga artículos instantáneos y rectángulo, si no tienes eso quizás hayas hecho algo mal o te faltan pasos aún)


acto seguido ya solo copias todo desde <figure> hasta </figure> para pegarlo en tu artículo que estás construyendo




Como construir un artículo instantáneo de facebook de forma manual Como construir un artículo instantáneo de facebook de forma manual Reviewed by Luis Torres on mayo 18, 2017 Rating: 5

No hay comentarios:

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

Con la tecnología de Blogger.