Compartir Amp WordPress

AMP para WordPress-Añadir Redes Sociales para Compartir tus entradas

Añadir Redes Sociales para compartir en AMP para WordPress

Hoy, a petición de un usuario del blog de empresa, vuelvo de nuevo a escribir en este olvidado mi blog y en relación a un artículo que escribí sobre AMP para WordPress, empezaré a enseñar como ir modificando nuestras entradas de AMP para WordPress, en este caso añadiremos los botones de redes sociales para compartir cada entrada de vuestro blog hacia la versión AMP, que es lo que nos interesa.

Como sabrás AMP para WordPress permite una carga rápida de la información en entorno móvil, también en pc y tablets, aunque se ha creado para ello, sin distracciones, es decir sin cargas de javascript y css externos, sin objetos dinámicos que nos distraigan del artículo en cuestión, que es lo que deseamos leer de una forma pausada y relajada.

AMP para WordPress solo esta disponible para artículos y noticias

Su defecto es que hay que añadir al final de la url /amp o bien /?amp=1 según si has modificado los enlaces permanentes (url amigable) o has dejado el que viene por defecto (url no amigable).

Vamos a lo que nos atañe, lo primero ir a descargar el plugin e instalarlo, ya sabemos como, que no lo sabes, vamos a plugins>añadir nuevo>buscamos AMP y descargamos e instalamos el que corresponde a Automattic.

Abre tu editor de texto o de código que prefieras (dreamweaver, sublime text, notepad, etc…) y en plugins>amp>templates dentro de wp-content crea un archivo llamado social-data.php, ahí vamos a incluir nuestras distintas redes sociales, podemos incluir las que deseemos, aunque en este caso solo te voy a mostrar las correspondientes a Facebook, Google+ y Twitter.

Copia y pega el código que te muestro ahora en el archivo que acabamos de crear llamado social-data.php

Como puedes observar, las imágenes son SVG que facilitan una carga mayor que en otro formato como puedan ser PNG, JPG, JPEG… y las url´s de cada red social finalizan en “amp”, de esa forma cuando se comparta en redes sociales visitaran dicha url.

Y ahora vamos a darles unos estilos de forma que queden alineados en horizontal y le daremos color a los iconos de nuestras redes sociales, vamos a ello, nos dirigimos a nuestro plugin de nuevo y en la misma carpeta templates buscamos el archivo style.php, al final de dicho archivo añadimos el siguiente código

Ahora ya nos queda un último paso y es el añadir el archivo social-data.php a nuestra plantilla, para ello vamos a la carpeta templates, de nuevo y abrimos el archivo single.php y después de la etiqueta

Añadimos el siguiente código php

De esta forma tan simple podemos permitir a nuestros seguidores compartir nuestras entradas en AMP para WordPress.

Si deseas añadirlo también a pie de página puedes añadirlo después del siguiente código

Recuerda guardar dichos datos, ya que con cada actualización de este plugin tendrás que volver a añadirlos, supongo que poco a poco irá mejorando y esperemos que en breve se puedan añadir ciertos datos desde el panel de administración.

Si te interesa indagar más sobre el tema puedes visitar

Proyecto Open Source Github: Proyecto AMP para WordPress

Blog Google Español: Accelerated Mobile Pages

Blog de Empresa Versión AMP: Acelerando la carga de noticias

cybmeta: Filtros y Action para WordPress

Si te ha interesado este artículo compártelo y si tienes alguna idea para mejorarlo déjanos tu aporte así como tus dudas en los comentarios

Samuel

Consultor SEO, diseñador web, 2D y 3D, CSS. Apasionado de los gestores de contenido como oscommerce y wordpress, así como de la accesibilidad y usabilidad web. Vivo en Madrid, España. Sigueme en Twitter

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

Pin It on Pinterest