Skip to content

WordPress y AMP HTML: Soporte para páginas, categorías y tags. Y diseño personalizable.

Search Console - Accelerated Mobile Pages
Search Console - Accelerated Mobile Pages

Hace poco tiempo he tenido la oportunidad de trabajar en el plugin oficial de WordPress con soporte para AMP, se llama AMP-WP.

La estructura general del plugin está bien, pero solo tiene soporte para posts. No funciona con páginas, archivos, tags, etc..

Hice un fork del plugin AMP-WP para añadirle soporte para todo. Lo podéis encontrar aquí. Y aquí está el primer pull request. Los autores han pasado y no han ni comentado.

Con este fork tendrás un sitio 100% navegable en AMP. Incluyendo páginas, links del menú, archivo, tags, author,… y es compatible con cualquier formato de fecha. Cosa que el plugin original no lo es.

La página por la que realicé este fork ya está en google, que ha indexado la mayoría del sitio en versión AMP.

Es posible que tengas problemas para que google indexe tu página en AMP. Ya sea con mi fork o con el plugin original. Porque muchos plugins incluyen cosas en el content de los posts, código JS, CSS, iframes, etc… y mucho de ese código no es compatible con AMP HTML.

Para estar seguro de que funciona todo, hay que hacer filtros en el functions.php que elimine todo lo incompatible en la versión AMP, por ejemplo:

1
2
3
4
5
6
7
8
9
10
11
12
add_action( 'template_redirect', 'mh_template_redirect', 10);
function mh_template_redirect() {
    if (!is_amp_endpoint()) return;

    global $wpssossb;
    if (isset($wpssossb->p))
        $wpssossb->p->ssb->remove_buttons_filter();

    remove_filter('the_content', 'mh_advertising');
    remove_filter('the_content', 'ai_content_hook', 99999);
    remove_filter('the_excerpt', 'ai_excerpt_hook', 99999);
}

Este código es para eliminar información del propio theme y de un plugin de social media que también metía cosas dentro del the_content().

Una vez limpies el contenido, ya validará en google.

Search Console - Accelerated Mobile Pages

La linea roja es cuando se instaló el plugin AMP-WP oficial. La azul es ya con mi fork y con los filtros para limpiar el “the_content” y algunas chorradas del pié de página.

Y para personalizar el diseño, que se puede, debes crear una carpeta en tu theme con el nombre “amp”. Y puedes cambiar los siguientes archivos:

  • style.php
  • archive.php (este NO existe en el plugin original)
  • single.php
  • meta-full.php

Y todo los que veas aquí: https://github.com/gabrielperezs/amp-wp/tree/master/templates

Cualquier idea/bug, directo a github.


Comments (4)

  1. Olá, primeiro gostaria de agradecer pelo trabalho que fez, acho que nem usaria a versão original por não ter suporte a páginas e arquivos. Nas configurações do wordpress eu tenho definida uma página estática para a HOME e outra para os posts. Eu instalei sua versão do plugin quando acesso meudominio/amp/ ele está exibindo a página de posts em vez da página estática. Você saberia dizer como alterar este comportamento? Eu não encontrei no github o botão para criar uma “issue” em seu projeto

    **Google translate**
    Hola, en primer lugar me gustaría darle las gracias por el trabajo que hizo, creo que ni utilizaría la versión original al no tener páginas y archivos de soporte. En las configuraciones de WordPress fijo una página estática para el HOME y otra para los posts. Con su plugin, cuando acceso midominio.com/amp/ estoy a ver los post en lugar de la página estática. Se podría saber cómo cambiar este comportamiento?No he encontrado en github el botón para crear una “issue” en su proyecto.

    Hello, first I would like to thank you for the work you did, I think that neither would use the original version by not having support pages and archives. In the wordpress settings I’ve a static page set for HOME and other page for the posts. I installed your plugin and, when I access mydomain/amp/ it is showing the posts page instead of the static page. Would you know how to change this behavior?
    I have not found on github the button to create an issue in your project.

Leave a Reply

Your email address will not be published.