Ayuda: poner imagen personalizada en titulo de widget

alex3770

Gamma
Desde
16 Feb 2013
Mensajes
343
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Saludos amigos betas, pues como lo dice el titulo estoy editando una plantilla en wordpress y me gustaria poner una imagen con el titulo en lugar de que salga el titulo normal en los widgets, osea cambiar esto:


por esto:



Ojala puedan ayudarme
 

jonay

Kappa
Verificación en dos pasos activada
Desde
7 May 2010
Mensajes
2.669
Hazlo con CSS, cada widget tiene su class personalizada, utiliza eso para ponerla como background y listo. :encouragement:
 

alex3770

Gamma
Desde
16 Feb 2013
Mensajes
343
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Hazlo con CSS, cada widget tiene su class personalizada, utiliza eso para ponerla como background y listo. :encouragement:

Muchas gracias amigo jonay por la respuesta, si estoy pensando hacerlo con CSS pero tengo algunas dudas. ¿es el archivo style el que tengo que editar? y otra cuestion es que no sabría cual es el código que usaría para ponerla, nuevamente muchas gracias amigo.

este es el código que tengo que editar segun lo que me dice Firebug.

h3.widgettitle{color:#FFFFFF; font-size:1.5em !important;}
.description{color:#444;font-family: 'PT+Sans&subset=latin', Helvetica,Verdana,Arial,Sans-Serif;font-size:1.3em;margin:0.5em 0 0 0px;padding: 0px 10px;}
 
Última edición:

jonay

Kappa
Verificación en dos pasos activada
Desde
7 May 2010
Mensajes
2.669
Si editas eso, se editará en todos los widgets y tu quieres ponerle un titulo a cada widget... cada widget tiene un class para diferenciarlo, por ejemplo el de categorias es widget_categories ve mirando uno a uno y haciendo lo mismo que te voy a decir a continuación poniendole la imagen a cada uno.

El archivo donde tienes que poner esto es el style.css al final del todo

Insertar CODE, HTML o PHP:
.widget_categories h3{width:331px;height:38px;background:url(img/imagen.png) no-repeat;text-indent:-9999em /* text-indent no es necesario, es simplemente para quitar el titulo que tenga en caso de tener y así no tener que editar uno a uno los widgets y quitarle el titulo, ya que quieres poner el titulo a mano */}

Asegurate de que el tamaño de la imagen es el adecuado para el tamaño de la barra lateral de tu theme, si no tendrás que hacerla mas grande o mas pequeña dependiendo...

También asegurate de que la carpeta img o images de tu theme tenga la imagen.png o como quieras llamarlo, si la carpeta o el nombre de la imagen cambia, tendrás que cambiarlo en el background url del código que te dí antes.

Esto es la manera mas fácil de hacerlo, yo lo hago de otra forma más dificil pero mejor... :encouragement:
 

alex3770

Gamma
Desde
16 Feb 2013
Mensajes
343
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Muchisimas gracias amigo [MENTION=2243]jonay[/MENTION], me sirvio bastante y no habia visto que me habias contestado, saludos cordiales.