Widgets y Plugins para Blogger


Integrar los Tweets de Twitter en Amp


De una forma segura aprenderán en este tutorial a integrar un widget de Twitter en Amp, el cual mostrara los Tweets que hayan compartido en su página de Twitter. Básicamente a este widget se lo conoce como Embedded Timeline.

La integración del código es muy simple, solo debe seguir las instrucciones de este tutorial y lo implementaran en su blog de Blogger en Amp.

- Les recuerdo que este tutorial es solo para los usuarios de Blogger que ya utilizan la Plantilla de Blogger en Amp.

¿Este widget de Twiiter en Amp sirve para otros sitios web?

El widget de Twitter en Amp, se lo puede visualizar en cualquier sitio web o blog, sea este de Blogger, Wordpress, Joomla, etc.


Integrar los Tweets de Twitter en Amp

A continuación pueden ver su demostración en el siguiente blog de demos en Amp

Video tutorial


Empezamos

1 Ir a Blogger

2 Un clic en Diseño

Integrar los Tweets de Twitter en Amp

3 Un clic en Añadir un gadget

Embedded Timeline Twitter en Amp

4 Busca el widget que dice HTML/Javascript, ábrelo

Embedded Timeline Twitter en Amp

5 Ingrese las siguientes líneas de código validado en Amp

<amp-iframe width='290'
      height='300'
      sandbox='allow-scripts allow-same-origin allow-popups'
      frameborder='0'
      scrolling='yes'
      src='https://cdn.rawgit.com/Luis-Chavez/Embed-Tweet/adad4db8/.html?user=ayudadeblogger'>
  </amp-iframe>

Realice un solo cambio:

Cambie el nombre que está marcado de color amarillo que dice ayudadeblogger y remplácelo por el perfil que utiliza en su cuenta de Twiiter.

Por ejemplo:

Embedded Timeline Twitter en Amp


Si quiere aumentar o disminuir el tamaño del widget, pude cambiar los números que se encuentran marcados de color verde

width='290'
height='300'

Eso es todo un clic en Guardar

Ubique su nuevo widget de Twiiter en Amp justo abajo del Popular post

Nota importante: ahora para que nos valide el widget generado por Blogger y no muestre un solo error, diríjase al siguiente enlace, en el apartado 14 y realice lo estipulado:


6 Ahora si nota que no le muestra el nuevo widget que ingreso, siga las siguientes instrucciones

- Un clic en Plantilla

Embedded Timeline Twitter en Amp

- Un clic en Editar HTML

Embedded Timeline Twitter en Amp

- Justo al principio del código de su plantilla encontrara un código similar al siguiente

<b:if cond='data:blog.pageType in {&quot;item&quot;}'>
<script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'/>
</b:if>

Elimine solo dos códigos, los que marque de color amarillo, luego de un clic en Guardar plantilla

Le quedara de la siguiente manera:

Embedded Timeline Twitter en Amp


Para más detalles específicos visite el video tutorial

Eso es todo, ahora si diríjase a su blog y disfrute de este nuevo widget de Twitter en Amp

¡Fácil verdad!

¿Necesitas ayuda?

Cualquier pregunta no duden en escribir


Enviar por correo

Publicar un comentario

Discusión: