Título, descripción y logo en una plantilla wordpress

Título, descripción y logo en una plantilla wordpress

A la hora de desarrollar un theme para wordpress nos interesará ubicar el título, la descripción y/o el logo en un determinado lugar, que podamos actualizarlo desde el apartado de personalización de nuestro panel de control y, por supuesto, conseguir que se visualice sólo el logo o sólo el título, a nuestra elección.

Lo primero que vamos a hacer es ver el código php que necesitamos para visualizar éstos tres elementos en nuestro theme y las funciones de wordpress que vamos a necesitar para completar la tarea. Después iremos profuncizando un poco más en éste tema.

<?php

the_custon_logo ();

if ( is_front_page () &amp;&amp; is_home () ) : ?>
   <h1><a href="<?php echo esc_url(home_url('/')) ?>"><?php bloginfo ('name'); ?></a></h1>
<?php else : ?>
   <p><a href="<?php echo esc_url(home_url('/')) ?>"><?php bloginfo ('name'); ?></a></p>
<?php endif; 

$descripcion = get_bloginfo ('description', 'display' );
if ( $descripcion || is_customize_preview () ) : ?>
   <p><?php echo $descripcion ; ?></p>

<?php endif; ?>

Es un fragmento de código bastante sencillo. Pero veamos algunas de las funciones de wordpress que se utilizan:

the_custom_logo (), hace una llamada a ésta función para visualizar el logo (si existe) de la web que estará enlazado a la página de inicio. Esto se verificará en la opción de personalización de nuestro theme.

Lo siguiente es una condicional en las que se comprueba con las funciones is_front_page () y is_home () que la consulta que estamos realizando  sea efectivamente para front-page o para la pagina de inicio del blog. En caso afirmativo escribimos con bloginfo ( ‘name’ ) el nombre de la página con un enlace usando la funcion home_url (‘//) para obtener el enlace completo de la página terminado en el carácter / como un título h1. En caso contrario, escribiremos como un párrafo ( tag <p> ) la misma información que en el caso anterior y usando las mismas funciones.

El siguiente bloque de código php será para visualizar la descripción. Para ello almacenaremos en una variable la cadena de texto correspondiente a la descripción que hemos introducido, obtenida a través de la función get_bloginfo (‘description’, ‘display’). Si hay una descripcion disponible ( no es una cadena vacía ) o estamos visualizando la página en la opción de personalización, entonces escribe en la web el contenido de la variable string descripción.

Ahora ocurre lo siguiente: si nos vamos al personalizador del theme y ponemos simultáneamente un título y un logo, estos se visualizarán a la vez, y eso es algo que queremos evitar: o uno y otro. ¿Cómo conseguimos ésto?. Haré una pequeña modificación en el código anterior, vamos a verlo:

if ( has_custom_logo () ) {
   the_custom_logo ();
} else {
   if ( is_front_page () &amp;&amp; is_home () ) : ?>
      <h1><a href="<?php echo esc_url(home_url('/')) ?>"><?php bloginfo ('name'); ?></a></h1>
   <?php else : ?>
      <p><a href="<?php echo esc_url(home_url('/')) ?>"><?php bloginfo ('name'); ?></a></p>
   <?php endif; 

   $descripcion = get_bloginfo ('description', 'display' );
   if ( $descripcion || is_customize_preview () ) : ?>
      <p><?php echo $descripcion ; ?></p>

   <?php endif; ?>
}

Simplemente he incluido una nueva condicional. En caso de que haya un logo, no mostrar en pantalla nada más. Si no lo hay entonces de ejecuta el código php que escribí en el fragmento anterior. ¡Bastante simple!.

Como siempre, dejo abierta la sección de comentarios del blog para que escribais vuestras opiniones, aportaciones o código alternativo.

No Comments

Post a Comment