NorfiPC
WordPress

Agregar Entradas recientes y Mapa del sitio a páginas AMP de WordPress

Crear páginas con las lista de las ultimas entradas publicadas y con el contenido de todo el blog, con sus enlaces a las versiones en formato AMP, para facilitar la navegación.
Agregar Entradas recientes y Mapa del sitio a páginas AMP de WordPress
El plugin “AMP for WordPress” automáticamente crea versiones de todas las publicaciones en formato AMP, lo que nos ayuda a mejorar el alcance de nuestro blog, principalmente en móviles.
No obstante debemos personalizar y mejorar este formato sumamente simple y agregarle funciones básicas, como explico en otras publicaciones.
Dos de ellas las comparto en esta entrada.
Se trata de crear una página de Entradas recientes, cuyos enlaces conducen a las versiones AMP y la otra un Mapa del sitio, cuyos enlaces poseen funciones similares, en el que se listan todas las publicaciones.
Las dos opciones las agradecerán quienes desean navegar por nuestro sitio, solo usando AMP, para ahorrar datos móviles.



Páginas del blog con enlaces a las versiones AMP

Para implementar las dos funciones es necesario agregar el código al archivo “functions.php” o a un plugin personal.
Se supone que los interesados ya conocen como crear un Tema Child o un plugin personal.
Después debemos de crear dos páginas mediante el panel de administración (Escritorio), con el título apropiado y en el contenido de cada una solo agregar el Shortcode correspondiente.



Código para agregar las Entradas recientes a las páginas AMP

//Agregar entradas recientes en paginas AMP
 function amp_sitem_function($atts) {
   extract(shortcode_atts(array(
    	  'append' => 'amp',
	      'heading' => null,
		  'max' => 15,
), $atts));
   $return_string = '<ul>';
   query_posts(array('post_type' => array('post'), 'orderby' => 'ASCE', 'showposts' => $max, 'append' => $append, 'heading' => $heading));
 if (have_posts()) :
      while (have_posts()) : the_post();
        $return_string .= '<li><a href="'.get_permalink().''.$append.'/">'.get_the_title().'</a></li>';		 
      endwhile;
   endif;
   $return_string .= '</ul>';
   wp_reset_query();
   return $return_string;
}
function register_shortcode_amp_sitemap(){
   add_shortcode('amp-sitemap', 'amp_sitem_function');
}
add_action( 'init', 'register_shortcode_amp_sitemap');    
En la línea 6 del código se puede especificar el número de entradas recientes que se mostrarán.
En este ejemplo es de 10.

Shortcode

Agrega el siguiente shortcode en la página donde deseas mostrar las entradas recientes:
[amp-sitemap]



Código para agregar un Mapa del sitio a las páginas AMP

// Agregar Mapa del sitio a paginas AMP
    function sitemap_html_amp( $atts ){
            $return = '';
            $args = array('public'=>1);
            $ignoreposttypes = array('page','attachment');
            $post_types = get_post_types( $args, 'objects' );
            foreach ( $post_types as $post_type ) {
                if( !in_array($post_type->name,$ignoreposttypes)){                   
                    $args = array(
                        'posts_per_page'   => -1,
                        'post_type'        => $post_type->name,
                        'post_status'      => 'publish'
                    );
                    $posts_array = get_posts( $args ); 
                    $return .=  '<ul>';
                    foreach($posts_array as $pst){
                        $return .=  '<li><a href="'.get_permalink($pst->ID).'amp/">'.$pst->post_title.'</a></li>';
                    }
                    $return .=  '</ul>';
                }
            }
        return $return;
    }
    add_shortcode( 'mapasitioamp', 'sitemap_html_amp' );    

Shortcode

[mapasitioamp]



Mostrar los enlaces a la página principal del sitio

Después de implementar las dos funciones anteriores, necesitamos agregar sus enlaces a una o varias páginas AMP, para que los lectores puedan usarlos.
Quienes usan una página estática como principal o Home del blog, pueden hacerlo creado una copia del archivo “page.php” dentro de la carpeta del plugin a una carpeta de nombre amp en nuestro tema Child.
A continuación debemos editarlo y agregarle las siguientes líneas, justo antes de la etiqueta de cierre (</div>) del contenedor con la clase “amp-wp-article-content”
<div>
<h3>Mas informacion</h3>
<a href="https://norfipc.com/blog/ultimas-publicaciones-formato-amp/?amp">Entradas recientes</a><br>
<a href="https://norfipc.com/blog/mapa-del-sitio-paginas-amp/?amp">Mapa del sitio</a><br>
</div>
Estos enlaces solo se verán en la versión AMP de la Pagina Home, por lo que también deberemos agregarlo en la página normal, mediante el panel de administración.

Otras páginas relacionadas

Como modificar y personalizar mi tema de WordPress
Como usar y configurar WordPress sin plugins
Convertir los enlaces externos en NoFollow en WordPress


Comparte