Cómo usar AMP con WordPress

AMP es un esfuerzo comunitario que promete una Mejor rendimiento de carga de página para sitios web en el entorno móvil.. Pero, como puede encontrar en nuestro tutorial anterior, tendrá que sacrificar cosas extravagantes de su sitio web, seguir estrictamente las reglas, cumplir con las pautas y obtener las páginas validadas. Suena como mucho que hacer, ¿no es así??

Afortunadamente, si ha creado su sitio web con WordPress, puede aplicar AMP a su sitio web en un instante usando un complemento llamado AMP-WP. Se envía con más características que lo que se ve a simple vista. Entonces, veamos cómo funciona..

Activación

Para empezar, ingrese a su sitio web, vaya a Plugins> Añadir Nuevo pantalla. Buscar “AMPERIO; Instala y activa el de Automattic..

Una vez activado, puede ver la publicación convertida en AMP agregando el /amperio/ rastro al final de la URL de la publicación (por ejemplo,. http://wp.com/post/amp/), o con ?amp = 1 (p.ej. http://wp.com/post/?amp=1) si no está utilizando la función Pretty Permalinks en su sitio web.

Y como puede ver arriba, a la publicación se le han dado estilos básicos, que puede personalizar aún más..

Notar

Hay algunas cosas que debe saber sobre el estado del complemento en este momento:

• Archivo - Categoría, Etiqueta y Taxonomia personalizada - Actualmente no son compatibles. No se convertirán en un formato compatible con AMP. Sin embargo, los tipos de publicación personalizados pueden iniciarse en AMP a través de un filtro.
• No se agrega en una nueva pantalla de configuración en el Panel de control. La personalización se realiza a nivel de código. con acciones, filtros, clase.
• El complemento no abarca actualmente todos los elementos personalizados de AMP, como analítica de amplificación y amp-anuncio fuera de la caja. Si necesita estos elementos, deberá incluirlos enganchándolos a las Acciones o Filtros del complemento..

Personalización

El complemento proporciona numerosas acciones y filtros que brindan flexibilidad en la personalización de los estilos, el contenido de la página e incluso el marcado HTML de la página AMP en su totalidad..

Estilos

Estoy seguro de que esto es algo que desea cambiar inmediatamente después de activar el complemento, como cambiar el color de fondo del encabezado, la familia de fuentes y el tamaño de la fuente para que coincida mejor con la marca y personalidad de su sitio web..

Para ello, podemos emplear la amp_post_template_css Acción en el funciones.php archivo de nuestro tema.

function theme_amp_custom_styles () ?> nav.amp-wp-title-bar background-color: orange;   
Si examinamos Chrome DevTools, estos estilos se anexan dentro de