Crear un widget para mostrar las entradas de un CPT en la home del N Theme

Descubre cómo generar un widget que te permita visualizar las entradas de tu Custom Post Type (CPT) favorito en la home del N Theme.

A petición de uno de los suscriptores creé un tutorial para mostrar las entradas de un CPT personalizado en lugar de los artículos del blog.

Pero, ¿qué pasa si quieres que aparezcan ambas como te enseñé para el H Theme y el O Theme

Pues no pasa nada. 😉

Porque aprovechando que la página principal del N Theme está compuesta por widgets, en este tutorial vas a aprender a crear uno nuevo que muestre las entradas del Custom Post Type que te interese.

Vamos allá:

Pasos para generar un widget que introduzca CPTs en la home del N Theme

Voy a indicarte cómo utilizar el widget de Blog como base y realizar las modificaciones necesarias para que enseñe entradas de CPTs.

1. Crea el archivo class-asi-widget-cpt.php

Genera un fichero llamado class-asi-widget-cpt.php que contenga el siguiente código y colócalo en la carpeta /inc/widgets/inc/ del N Theme.

Con estos cambios consigues que el widget muestre las entradas del CPT «curso» .

Aunque ya sabes que puedes adecuar el tipo Custom Post Type sustituyendo «curso» por el que te más convenga.

        $items = get_posts(array(
            'posts_per_page' => $instance['num_entries'],
            'post_type' => 'curso'
        ));

A petición de Josep, uno de nuestros suscriptores, añado la modificación del snippet que necesitarías para mostrar solo los cursos y no las lecciones (post hijo).

        $items = get_posts(array(
            'posts_per_page' => $instance['num_entries'],
            'post_type' => 'curso',
            'post_parent' => 0
        ));

2. Cambia el widgets.php

Este archivo se encuentra en la carpeta /inc/widgets/ del N Theme.

En la línea 7, sustituye:

Con esto registras y cargas el nuevo widget, consiguiendo que aparezca en wp-admin y el personalizador de WordPress.

3. Modifica el style.css

Por último, otorga los estilos de CSS. Para ello añade el siguiente snippet al final del fichero style.css:

4. Añade el widget desde el personalizador

Ahora que tienes todas las piezas en su sitio puedes ir al personalizador de WordPress y añadir el widget en la home.

Cuando vayas a personalizar la portada del N Theme, te aparecerá un nuevo widget llamado «AsiTheme CPT» que podrás configurar igual que el del blog, solo que este mostrará las entradas de tu CPT elegido.

Este sería el resultado tras añadirlo bajo el de blog:

Conclusiones

Ya ves qué fácil es generar un widget que te permita mostrar las entradas de CPT en la home del N Theme.

Aunque está creado para una plantilla concreta, puedes usar este snippet de guía para modificar otros temas de AsiThemes que utilicen widgets en la página principal.

¿Quieres que cree este tutorial para un child theme de Genesis Framework que no use widgets en la home? Sólo tienes que decírmelo y prepararé uno a medida.

Ventajas de ser suscriptor. 😉