Header en WordPress: Elementos link y la función bloginfo

Este post hablará del uso de los elementos link y explicar un poco la función bloginfo que he estado usando en el post anterior.

Elementos link

En el head se víncula recursos externos como CSS y JavaScript. El tema necesita la hoja de estilos styles.css en la raíz de tu directorio. Para llamarla tendrías que inlcuir el siguiente código dentro del head

La función bloginfo con el parámetro stylesheet_url devolverá la URL exacta de la localización de styles.css.

En caso de usar un archivo con jQuery es preciso hacer la siguiente llamada en el inicio del functions.php

WordPress viene con una copia de jQuery así este comando es suficiente para llamar a la librería.

Ahora para cargar tu script, deberías escribir dentro del <head> del header.php o antes de cerrar la etiqueta </body> del footer.php (Recomendable)

La función bloginfo usa un parámetro que le permite obtener la ruta del tema. Normalmente los scripts que uses deberían estar en una carpeta dentro del tema, en este caso es la carpeta js.

Pero el header.php se usa en todas las páginas del sitio, ¿cómo hacer que sólo use ciertos CSS o scripts en determinadas páginas? Para ello podemos usar la lógica de WordPress que detecta qué página está siendo vista y cargar sólo los archivos en esa situación.

Este código lo que hace es si la página que está viéndose usa la plantillapage-archives.php se carga el archive.css y el archives.js

Si en vez de basarse en la plantilla que usa la página, quieres saber qué página está viéndose por su ID

La función bloginfo

Está función permite obtener una gran variedad de información sobre la web. Esta información es muy útil cuando se crean temas. Se pueden obtener varios tipos de datos según el parámetro, pero me centraré en los más relevantes

Parámetro Descripción Ejemplo dato obtenido
charset Devuelve el conjunto de caracteres que usa la web UTF-8
description Muestra la “Descripción corta” de la web rellenada en la Ajustes > Generales Esta página es ideal para aprender WordPress!
url Devuelve la “Dirección de WordPress” usado en la Ajustes > Generales https://ejemplo.com/home
html_type Muestra el tipo de contenido HTML de la página text/html
language Muestra el lenguaje de WordPress Es-es
name Devuelve el “Título del Sitio” usado en Ajustes > Generales Guidacode
rss_url Devuelve la url del RSS https://ejemplo.com/home/feed/rss
stylesheet_directory Muestra la URL del directorio del tema activo https://ejemplo.com/home/wp/wp-content/themes/twentyfifteen
stylesheet_url Muestra la URL del styles.css del tema activo https://ejemplo.com/home/wp/wp-content/themes/twentyfifteen/style.css
template_directory/template_url URL del tema activo pero si es una tema hijo, mostrará la URL del tema padre cosa que no sucede con los 2 anteriores. https://digwp.com/home/wp/wp-content/themes/twentyfifteen
text_direction Devuelve la dirección del texto ltr

Y hasta aquí el tutorial de hoy. Espero que os haya servido. A seguir picando 🙂