Recientemente, uno de nuestros lectores nos preguntó cómo ver las páginas secundarias de una página de WordPress.
Si organiza su sitio web de WordPress con páginas principales y secundarias, es posible que desee mostrar sus páginas secundarias o subpáginas en la página principal. También puede mostrar la página principal en cada subpágina para facilitar la navegación.
En este artículo, le mostraremos cómo mostrar fácilmente una lista de páginas secundarias para una página principal en WordPress.
¿Cuándo es necesario mostrar una lista de páginas secundarias?
WordPress viene con dos tipos de publicaciones predefinidas llamadas publicaciones y páginas. Las publicaciones son contenido de blog y generalmente se organizan con categorías y etiquetas.
Las páginas son contenido único o independiente que es siempre verde, como la página «Acerca de nosotros» o la página «Contáctenos».
En WordPress, las páginas pueden ser jerárquicas, lo que significa que puede organizarlas con páginas principales y secundarias.
Por ejemplo, es posible que desee crear una página de producto con páginas secundarias para funciones, precios y soporte.
Para crear una página secundaria, siga nuestra guía sobre cómo crear una página secundaria en WordPress.
Después de crear las páginas principal y secundaria, es posible que desee enumerar las páginas secundarias en la página principal principal.
Ahora, una forma fácil de hacer esto es editar manualmente la página principal y agregar una lista de enlaces individualmente.
Sin embargo, deberá editar manualmente la página principal cada vez que agregue o elimine una página secundaria. ¿No sería mejor si pudiera crear una página secundaria y aparecería automáticamente como un enlace en la página principal?
Dicho esto, echemos un vistazo a otras formas dinámicas de mostrar rápidamente una lista de páginas secundarias en la página principal de WordPress.
Método 1. Mostrar páginas secundarias en la página principal mediante un plugin
Este método es más sencillo y recomendado para todos los usuarios.
Primero, necesitas instalar y activar el archivo. Lista de paginas conectar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Tras la activación, debe editar la página principal y simplemente agregar el siguiente código abreviado donde desea ver la lista de páginas secundarias.
[subpages]
Ahora puede guardar su página y obtener una vista previa en una nueva pestaña del navegador. Notará que muestra una lista simple con viñetas de todas las páginas secundarias.
Si lo desea, puede agregar CSS personalizado para cambiar la apariencia de la lista. A continuación, se muestran algunos ejemplos de CSS que puede utilizar como punto de partida.
ul.page-list.subpages-page-list {
list-style: none;
list-style-type: none;
background-color: #eee;
border: 1px solid #CCC;
padding: 20px;
}
Después de aplicar su CSS personalizado, puede obtener una vista previa de la página principal. Así es como se veía en nuestro sitio web de prueba de WordPress.
El plugin proporciona una serie de parámetros de código corto que le permiten establecer la profundidad, excluir páginas, número de elementos y más. Para más detalles, por favor ver la página del plugin para obtener documentación detallada.
Método 2. Enumere las subpáginas de una página principal mediante el código
Este método es un poco avanzado y requiere agregar código a su sitio web de WordPress. Si nunca ha hecho esto antes, consulte nuestra guía sobre cómo copiar y pegar código en WordPress.
Para enumerar las páginas secundarias en una página principal, debe agregar el siguiente código en un plugin específico del sitio o en el archivo functions.php de su tema:
function wpb_list_child_pages() {
global $post;
if ( is_page() && $post->post_parent )
$childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=" . $post->post_parent . "&echo=0' );
else
$childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=" . $post->ID . "&echo=0' );
if ( $childpages ) {
$string = '<ul class="wpb_page_list">' . $childpages . '</ul>';
}
return $string;
}
add_shortcode('wpb_childpages', 'wpb_list_child_pages');
El código anterior comprueba primero si una página tiene un padre o si la página en sí es un padre.
Si es una página principal, muestra las páginas secundarias asociadas a ella. Si es una página secundaria, muestra todas las demás páginas secundarias de su página principal.
Finalmente, si esta es solo una página sin una página secundaria o principal, el código simplemente no hará nada. En la última línea del código, hemos agregado un código corto, para que pueda ver fácilmente las páginas secundarias sin cambiar las plantillas de página.
Para ver páginas secundarias, simplemente agregue el siguiente código abreviado a una página o widget de texto en la barra lateral:
[wpb_childpages]
No olvide guardar los cambios y obtener una vista previa de ellos en una pestaña del navegador. Así es como se ve en nuestro sitio de prueba.
Ahora puede diseñar esta lista de páginas usando CSS personalizado. A continuación, se muestran algunos ejemplos de código CSS que puede utilizar como punto de partida.
ul.wpb_page_list {
list-style: none;
list-style-type: none;
background-color: #eee;
border: 1px solid #CCC;
padding: 20px;
}
Método 3. Ver páginas secundarias dinámicamente sin códigos cortos
El uso de códigos cortos es conveniente, pero el problema con ellos es que deberá agregar códigos cortos en todas las páginas que tienen páginas principales o secundarias.
Puede terminar teniendo códigos cortos en muchas páginas y, a veces, incluso puede olvidarse de agregarlos.
Un mejor enfoque sería editar el archivo de plantilla de página en el tema, para que pueda mostrar automáticamente las páginas secundarias.
Para hacer esto, necesita editar la page.php o cree una plantilla de página personalizada en su tema.
Puede cambiar su tema principal, pero estos cambios desaparecerán si cambia o actualiza el tema. Por eso sería mejor si crea un tema hijo y luego realiza los cambios en el tema hijo.
En el archivo de plantilla de página, debe agregar esta línea de código donde desea que aparezcan las páginas secundarias.
<?php wpb_list_child_pages(); ?>
Eso es todo. Su tema ahora detectará automáticamente las páginas secundarias y las mostrará en una lista simple.
Puede personalizar los estilos con CSS y formato. He aquí un ejemplo de cómo Sitio web de OptinMonster mostrar la página principal y las subpáginas:
Esperamos que este artículo le haya ayudado a enumerar las páginas secundarias de una página principal en WordPress. También puede consultar nuestra guía sobre las páginas más importantes para crear en un nuevo sitio web de WordPress y nuestra comparación de los mejores creadores de páginas de arrastrar y soltar de WordPress para crear diseños personalizados sin ningún código.
¿Te ha resultado útil??
0 / 0