miércoles, 17 de agosto de 2016

Personalizar los títulos de los gadgets / Parte I | Tutoriales



Hola, el día de hoy les traigo una nueva sección llamada "Entre Bloggeros", en ella haré pequeños tutoriales de lo que he aprendido para decorar el blog, espero les guste, estaré subiendo contenido cada dos semanas o en ocasiones cada semana (Según el tiempo disponible).

Personalizar los títulos de los gadgets / parte I



Es muy fácil solo debemos ir a Plantilla Personalizar Opciones avanzadas Agregar Css
y agregamos el siguiente código:

/*Adornar el título del gadget*/
.sidebar h2{ 
padding:10px; /*Tamaño*/
background-color: #ADD8E6; /* color de fondo*/
border:2px dashed #FFC0CB; /*color ,tamaño y tipo de contorno*/
border-radius: 5px; /*para redondear las esquinas */
text-align: center;}  /*Para centrar el texto*/

Pueden buscar los colores dando clic aquí

El resultado sería este:

Pueden cambiar dashed por otro estilo, por ejemplo estos: 

Dotted
solid


Estos son otros estilos ,pero deberán cambiar los px del border , ya que si los dejan del mismo tamaño se verá como estilo "solid ", pueden cambiarlo por 4 o 5px.

/*Adornar el título del gadget*/
.sidebar h2{ 
padding:10px; /*Tamaño*/
background-color: #ADD8E6; /* color de fondo*/
border:4px double #FFC0CB; /*color ,tamaño y tipo de contorno*/
border-radius: 5px; /*para redondear las esquinas */
text-align: center;}  /*Para centrar el texto*/


double 

groove 
inset

outset
ridge



Si quieren que el redondeado de las esquinas sea diferente,pueden cambiar el border-radius 

/*Adornar el título del gadget*/
.sidebar h2{ 
padding:10px; /*Tamaño*/
background-color: #ADD8E6; /* color de fondo*/
border:2px dashed #FFC0CB; /*color ,tamaño y tipo de contorno*/
border-radius: 15px; /*para redondear las esquinas */
text-align: center;}  /*Para centrar el texto*/

15px 


25px














12 comentarios:

  1. Hola..
    Muchas gracias *-*
    Tenia la curiosidad..
    Luego me animo a intentarlo..
    Muchas gracias ♥

    ResponderBorrar
  2. Lo acabo de intentar y déjame darte las gracias.<3
    Estaba como loca buscando alguien que hiciera tutoriales fáciles para poder adornar el blog, y te encontré a ti y ya siento que te quiero KJNDJKNKJDNSKDJNJKSNJK. Estaré más que pendiente de alguna nueva actualización de esta sección y del blog entero. c:

    ¡Saludos!

    ResponderBorrar
  3. Muchísimas gracias, me viene perfecto porque estoy tratando de tunear un poco el blog. Besos

    ResponderBorrar
  4. Oh vaya, que genial n.n voy a intentarlo a ver que tal

    Gracias y un abrazo!

    ResponderBorrar
  5. ¡Hola! Me encantan estos tutoriales, muchas gracias por traernos esta sección ^^
    Un beso.

    ResponderBorrar
  6. Hola!!!
    No sabes como te agradezco lo que enseñaste, he pasado muchos días intentando cambiarlo y no he podido, eres un sol, explicas muy bien, mil graciaaaas :)

    ResponderBorrar
  7. Hola!!!
    No sabes como te agradezco lo que enseñaste, he pasado muchos días intentando cambiarlo y no he podido, eres un sol, explicas muy bien, mil graciaaaas :)

    ResponderBorrar

El blog se alimenta de los comentarios,estaré muy agradecida de leer tu opinión, pero recuerda:"Siempre hay que ser respetuoso con los demás".