Una de las primeras cosas que solemos hacer al instalar un tema de WordPress es personalizar su diseño y estructura para adaptarla a nuestra imagen corporativa, empezando por la cabecera: el logo y descripción de nuestra web
En Genesis, como muchas otras cosas, no es de lo más fácil ni intuitivo. Es cierto que a través del personalizador te deja escoger una imagen y poner un título a tu blog, pero te da unas dimensiones fijas y la opción de poner una cosa u otra, no las dos.
Para cambiar estas opciones y definir las dimensiones personalizadas de tu logo, puedes hacerlo fácilmente desde el archivo functions.php del tema child que utilices. Sólo debes buscar el siguiente trozo de código y personalizar si quieres texto o no y las dimensiones de la imagen:
//* Add support for custom header add_theme_support( 'custom-header', array( 'header-selector' => '.site-title a', 'header-text' => true, 'height' => 93, 'width' => 655, ) );
Una vez cambiado esto, puedes personalizar los estilos del título y descripción con css mediante los siguientes selectores:
.site-title a: para el titulo principal
h2.site-description: para el subtitulo
¿Eres implementador o desarrollador WordPress?
En la Zona DPW encontrarás más recursos, tutoriales, plantillas, y una biblioteca de snippets para poder utilizar en tu día a día y ganar tiempo en tu trabajo:
ACCEDER AHORA
Comentarios
3 respuestas a «Cambiar imagen y texto de cabecera en Genesis»
|
Hola Ester he seguido estos pasos y también me he apoyado en un poco más de información que encontré por Google, pero no consigo que se vea tanto el logo, como el título y subtitulo del sitio, ¿sabes donde podría encontrar la forma de hacerlo? gracias
|
Hola Gaby,
Dependerá un poco del child theme que estés utilizado, pero normalmente si se activa un logotipo de imagen, Genesis oculta el título y descripción del sitio, pero siguen estando, sólo que le aplica CSS para que no se vean en la web.
Prueba a buscar en archivo de estilos del tema algo parecido a:
.site-description,
.wp-custom-logo .site-title {
border-width: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
overflow: hidden;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
Lo que hace el CSS es que aunque estén el título y la descripción, importantes para el tema de SEO, no se muestren si hay un logo de imagen.
Puedes modificar ese CSS para mostrarlo junto con el logo, ajustando un poco los estilos para que quede según lo que necesites.
Saludos!
|
Muchas gracias por tu ayuda Esther, lo probaré