Barra de utilidades en Genesis Sample

Hoy añadiremos una barra de utilidades a la nueva versión del tema Genesis Sample 2.6.0 (Developer). Ha sido una mejora significativa lo que han hecho con el tema. Han dado un giro importante no sólo en diseño sino también en desarrollo. El tema pasa a ser Mobile First, que no es otra cosa que un tema diseñado para móvil y adaptado para pantallas mas grandes. 

Como ya vimos en otro artículo en el que veíamos como añadir una barra de utilidades en Business Pro, no es demasiado complejo crear una para nuestro tema. Pues bien, en el nuevo Genesis Sample Theme la cosa se complica un poco debido a que el menú que trae es fijo. Así que tendremos que hacer algunos ajustes en CSS mayormente para que esto no sea un problema. 

Barra de utilidades en Sample Theme Develop
Barra de utilidades en Sample Theme Develop

Y así se vería en una móvil.

Barra de utilidades en pantalla móvil en Sample Theme Develop
Barra de utilidades en pantalla móvil en Sample Theme Develop

Añadiremos este código al archivo functions.php de nuestro Genesis Sample Theme. Con ello declararemos el área de widgets para fácilmente más tarde agregar el contenido que queramos.

Este contenido está sólo disponible para los suscriptores.

Puedes identificarte aquí o bien registrate en este enlace.

No es complejo y dado que el tipo de contenido que queremos colocar en una barra de utilidades suele ser información importante o enlaces esenciales, como los de cambio de idioma, lo mostraremos en toda la web. 

Tras haber creado el área de widgets ahora toca añadir el contenido. He agregado un par de plugins de HTML personalizado. También servirían de widgets de texto. Te dejo captura. 

Widgets de la barra de utildades en Somple Theme Develop
Widgets de la barra de utildades en Somple Theme Develop

En el segundo widget tan solo añadí un enlace von HMTL.

Si por cualquier cosa esta barra la quieres mostrar sólo en algunas partes o páginas, deberás jugar con los condicionales. Por ejemplo para mostrarla sólo en la portada bastará que uses el condicional is_front_page().

Ahora llega la hora del estilo o diseño. Como quieras llamarlo. He comentado algunas partes para que sepas porque he creado el código. Le he dado un estilo gris porque así la vi una vez y cuadra con los colores sobrios del tema. Evidentemente puedes poner el color que quieras. 

Este contenido está sólo disponible para los suscriptores.

Puedes identificarte aquí o bien registrate en este enlace.

Tal y como está diseñado, es para dos widgets de texto o HTML personalizado o de texto. Si quieres puedes colocar uno sólo. Se alineará al izquierda en pantallas grandes y al centro en pantallas pequeñas. 

Para cualquier duda, aportación o pregunta podéis dejarme un comentario justo debajo. O también me podéis mandar un mensaje a través del formulario de contacto. Si sois suscriptores no os olvidéis de hacerlo a través de la Intranet, pues os daré preferencia a la hora de contestar emails.

El soporte en comentarios está sólo disponible para los suscriptores.

Puedes identificarte aquí o bien registrate en este enlace.

¿Olvidaste tu contraseña?