Si está creando un sitio con algunas páginas de nivel superior al que desea atraer la atención de los visitantes y animarlos a que lo visiten, es útil que se muestren de manera destacada en el encabezado de su sitio..
Por supuesto, puede agregar páginas de nivel superior a su menú de navegación, pero en este tutorial le mostraré cómo agregar algunos enlaces adicionales a estas páginas usando la get_pages ()
función.
Nota: no tiene que usar este código en el encabezado de su sitio. Si funciona mejor para usted, siempre puede agregarlo a su barra lateral o pie de página editando el barra lateral.php
o footer.php
archivos en lugar de header.php
.
En este tutorial voy a crear un tema infantil del tema veintiséis y luego crearé un duplicado de veintiseis y dieciséis. header.php
archivo en mi tema hijo, que voy a editar. Nunca debe editar los archivos de un tema que haya descargado, ya que al actualizar el tema perderá su trabajo. Alternativamente, si está trabajando con su propio tema, siéntase libre de agregar este código a ese lugar..
Para seguir este tutorial, necesitarás lo siguiente:
Entonces empecemos.
Comience por crear un hijo de veintiséis años (a menos que esté trabajando con su propio tema).
Crea una nueva carpeta en tu wp-content / temas /
Carpeta y dale un nombre lógico: estoy llamando mía. tutsplus-page-link-buttons
.
Dentro de esa carpeta, crea un nuevo archivo y nómbrelo style.css
. Ahora abre ese archivo y agrégale esto:
/ * Nombre del tema: Tuts + Botones de enlace de página URI del tema: http: //.tutsplus.com/tutorials/using-get_pages-to-create-link-buttons-to-your-sites-top-level-pages-creating-the -código - cms-24967 Descripción: Tema para apoyar tuts + tutorial sobre cómo agregar botones a las páginas de nivel superior en el encabezado de su sitio (parte 1). Tema infantil para el tema Veintiséis. Autor: Rachel McCollin Autor URI: http://rachelmccollin.co.uk/ Plantilla: twentysixteen Versión: 1.0 * / @import url ("... /twentysixteen/style.css");
Edite el código anterior para indicar que este es su tema, no el mío.
Ahora guarda ese archivo y activa tu nuevo tema en tu sitio.
Como estaremos editando el header.php
archivo, necesitamos crear un duplicado de ese archivo del tema veintiséis en el tema hijo. Encuentra el header.php
Archivo en veintiséis dieciséis y cópielo (¡no lo mueva!) a la carpeta de su nuevo tema.
Ahora tu tema tendrá dos archivos: style.css
y header.php
. WordPress utilizará automáticamente el header.php
archivo de su tema infantil en lugar del uno en veintiseis dieciséis, ya que así es como funcionan los temas infantiles.
Abre el nuevo header.php
archivo para que pueda empezar a editarlo.
Voy a agregar mis enlaces a las páginas de nivel superior dentro de la encabezamiento
Elemento, inmediatamente antes del cierre. etiqueta. Así que encuentra esa línea en tu tema y comienza a agregar un nuevo código sobre el cierre
etiqueta.
Primero, crea los argumentos para get_pages ()
escribiendo lo siguiente:
$ args = array ('parent' => 0, 'sort_order' => ASC, 'sort_column' => 'menu_order');
Esto asegura que get_pages ()
solo obtiene esas páginas sin padre ('padre' => 0
) y ordena las páginas según el orden que especifique en las pantallas de edición de páginas. Si desea cambiar el orden, use uno o más de los argumentos que puede encontrar en la página de Codex para get_pages ()
.
Ahora, debajo de tus argumentos, agrega esto:
$ pages = get_pages ($ args);
Esto ejecutará el get_pages ()
funciona usando los argumentos que has especificado.
Antes de emitir más códigos, desea verificar que hay algunas páginas en el nivel superior, así que verifique que get_pages ()
ha devuelto algo.
Bajo la get_pages ()
función, agregue esto:
si ($ paginas)
A continuación, agregará el código de salida dentro de las llaves.
Ahora viene la parte divertida. Dentro de las llaves que acaba de agregar, escriba lo siguiente:
Esto abre un ul
Elemento, luego dentro de ese bucle a través de cada página buscada por get_pages ()
y saca su título dentro de un enlace a él.
Ahora guarda tu archivo.
He añadido algunas páginas ficticias a mi sitio. Como se puede ver en la captura de pantalla, hay tres páginas de nivel superior y una página de segundo nivel, que no deberían aparecer en mi encabezado:
Y así es como se ven los enlaces en mi sitio:
Como puede ver, solo se muestran las páginas de nivel superior. En este momento no se ven muy bien: están apareciendo en una lista simple con balas. Así que en el siguiente tutorial, te mostraré cómo diseñarlos para que parezcan botones.
Agregar enlaces a las páginas de nivel superior en el encabezado de su sitio puede ser una forma útil de dirigir el tráfico a esas páginas. En lugar de codificar esos enlaces, debería usar WordPress get_pages ()
Función para automatizar el proceso. Aquí aprendió cómo hacerlo y en la siguiente parte le mostraré cómo agregar un poco de estilo..