02 agosto 2014

Personalizar titulo dos gadgets!

Vi esse post no blog Jackie Dream, e resolvi re-postar( essa palavra existe? kkkk), porque me ajudou muito! Vamos lá! Creditos ao blog Jackie Dream.

Hello Guria and Guris   Hoje eu vou ensinar a vocês como personalizar o titulo dos gadgets tipo do JD. 
 Vá no seu HTML e procure por:  h2 {
Se você nunca editou esta parte do template vai estar mais ou menos assim:

 Substitua o trecho destacado por:
.sidebar h2 {
font-family: 'Sofia', cursive; /*Tipo de fonte*/
font-size: 26px; /*Tamanho da fonte*/
color: #FFAEB9; /*Cor da fonte*/
background: url(http://i.imgur.com/Rjdny.png) no-repeat center;
height: 36px;/*Altura da imagem*/
width: 287px; /*Largura da imagem*/ 
text-align: center; /*Alinhamento do texto*/
}

 Instalando a fonte:
- Acima de </head> cole o seguinte código:


<link href='http://fonts.googleapis.com/css?family=Sofia' rel='stylesheet' type='text/css'/>
Caso queiram mudar a fonte é só dar uma olhadinha neste tutorial www

 Últimos ajustes:
- No trecho:  http://i.imgur.com/Rjdny.png  vocês podem trocar por uma imagem personalizada ok? Não esquecendo de ajustar as medidas da sua imagem.

- Mais caso ao invés de uma imagem vocês queiram apenas uma cor é só substituir essa parte:




background: url(http://i.imgur.com/Rjdny.png) no-repeat center;

 Por esta:


background: #000000; /*Cor de fundo*/
Visualize se estiver tudo OK, salve!  

4 comentários:

  1. Adorei a dica <3
    Beijos.

    garotamodamh.blogspot.com

    ResponderExcluir
  2. é sempre bom esses tutoriais de html ^^
    beijos
    http://50tonsdealgumacoisa.blogspot.com.br

    ResponderExcluir

Oi!♥
Comente sempre! Seja um membro ativo!
Amo responder comentários!