21.9.12

{Tutorial} Titulo del gadget y las entradas con un fondo de rayas y una barra doble de color

Bien hola el día de hoy les traje un tutorial de como personalizar el titulo de los gadget y el titulo de las entradas con un bonito diseño de un fondo de rayas y una linea doble de color.

EN LOS TÍTULOS DE GADGETS
Abrimos-->Plantilla--> Edición HTML 
Y Buscamos 
h2 { 
para buscar mas rapido utiliza CTRL + F

Una vez encontrado h2 { eliminamos todo lo que esta abajito asta el {
Todas las plantillas pueden variar pero tienes que eliminar desde h2 { asta un poco abajito de el encontraras una llave así { eliminalo

Después de eliminarlo coloca abajo de h2 { este codigo

background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1MxxrZG-YoqIKncrdUWmc9jkLYMnw5U-U2xBnmHZOyLfroKR5aORSDLwNfS3E9ktsjP77qwaOzGIzTF1pHKR58iDkget3D5qo68kLwToe4qhN5HFG51LAsaLhMVuAWOOuuNNIOdn3KVM/s1600/linepattern.png);
font:19px Arial;
color: #000000;
padding:2px;
border-bottom:4px double #faafd5;
-moz-border-radius: 10 10 0 0;
-webkit-border-radius: 10 10 0 0;
}

Bien para editar la letra y el tamaño cambia lo de color morado
Para cambiar el color de la letra cambia lo de color rojo
Para cambiar el color de la linea doble cambia lo de color azul

En los títulos de las entradas

Abrimos-->Plantilla--> Edición HTML 

Y Buscamos 

h3.post-title {


 para buscar mas rapido utiliza CTRL + F


Una vez encontrado h3.post-title { eliminamos todo lo que esta abajito asta el {

Después de eliminarlo coloca abajo de h3.post-title { este código

color:  #6E6E6E;
margin: 2px;
padding: 3px;
font-size: 22px;
font-family: Arial;
line-height:19px;
border-bottom:6px double #a3a3a3;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1MxxrZG-YoqIKncrdUWmc9jkLYMnw5U-U2xBnmHZOyLfroKR5aORSDLwNfS3E9ktsjP77qwaOzGIzTF1pHKR58iDkget3D5qo68kLwToe4qhN5HFG51LAsaLhMVuAWOOuuNNIOdn3KVM/s1600/linepattern.png);
-moz-border-radius: 10 10 0 0;
-webkit-border-radius: 10 10 0 0;
-webkit-transition: .1s;
}


Bien para editar la letra y el tamaño cambia lo de color morado
Para cambiar el color de la letra cambia lo de color rojo
Para cambiar el color de la linea doble cambia lo de color azul

7 comentarios:

yaoisaotaku dijo...

Kyaa onee >////< ya lo hice >3
Esta super hermoso el efectoooooo!!
Me encantoooo~ eres increiblee~
Muy bn explicado todo O//O
Me di cuenta de que usamos la misma plantilla xD
Muchas grasias por tu esfuezooo!!
TKMMMMMM demasiaaaaaadoooo >^<
Byeee

Barman dijo...

jiji lo he trobado! Ya verás, si te pasas por mi blog, lo verás!^^
Graxias, eres la mejor!

Kristalle dijo...

eres buenisima en esto!

♥auralovely chan♥ dijo...

sugoiiiiiiiiiiiiiiiiiiiiiiiiii
que trucao *ooooo*
tal vez lo huse :p
jejejeje
que maravillas tu blog
sigue sigue asi forever
by
aura saluditos ^u^

Vinyet dijo...

k guay!!!!!!!!! alomejor algun dia lo intento ;)
besos
http://ponunasonrisaatodo.blogspot.com.es/

Junior dijo...

Esta genial el tutorial, sigue asi.

Hasu✿Loto dijo...

*O* Gracias, me he puesto el título en los gadget.!!!