tutorial
E para trocar as cores é fácil né? Use a tabela de cores (www)
Espero ter ajudado, alguma duvida pergunte no comentários.
Tutorial: Personalizando titulo da Sidebar
Oi Zaynte, bom pediram no ask por muitas e muitas vezes acho que realmente a pessoa que mandou estava muito desesperada para personalizar o titulo da sidebar dela rs'
Bom, então eu trouxe três estilos de sidebar que eu vi no KW e gostei muito, lembrando todos os créditos desse post vai para Kawaii World.
Clique em leia mais para saber como personalizar.
Bom como eu sei que muito de vocês usam aquele design que o blog já vem tipo parecido com o meu design de imagines (www) E então eu fiz um pequeno teste no meu blog pra saber se o titulo dá certo, e adivinha? Deu certo, ficou até bonitinho mas eu não troco nada no meu blog, não por enquanto ele tá bonito do jeito que tá, ta ai uma amostra:
Dá pra ver? Então pode perceber que o titulo da Sidebar da diferente, mas o resto está normal como sempre foi, então eu vou ensinar como fazer, é bem simples... Pelo menos quando eu fiz foi bem simples.
Bom, primeiro você vai em Modelo > Editar HTML e procura pela tag:
.sidebar h2 {
Se não achar ótimo, mas se você achar apague todo o conteúdo que estiver entre ele até o fechamento de chaves (}) Bom depois de você ter apagado ou não. Você procura por:
Bom em baixo dessa tag que você procurou você vai colar o código do modelo abaixo que você mais gostar, trocando as cores e o tamanho da letra.
E aqui estão os modelos.
/* Widgets
Bom em baixo dessa tag que você procurou você vai colar o código do modelo abaixo que você mais gostar, trocando as cores e o tamanho da letra.
E aqui estão os modelos.
.sidebar h2 {
font-family: Tahoma;
text-transform: uppercase;
letter-spacing: 3px;
color: #ccac90;
border-bottom: 1px dotted #c8bcb2;
font-size: 11px;
text-align: center;
word-spacing:.4em;
-webkit-transition-duration: .50s;
}
.sidebar h2:hover {
letter-spacing: 6px;
color: #b39478;
-webkit-transition-duration: .50s;
}
@font-face {font-family: "beat"; src: url('http://static.tumblr.com/0xqvkot/qoCmj9gu6/altehaasgroteskregular.ttf');}.sidebar h2 {font-family: beat;text-transform: uppercase;letter-spacing: 3px;color: #f38a97;text-shadow:0 1px #cccccc;border-bottom: 1px solid #e5e5e5;font-size: 13px;text-align: center;word-spacing:.4em;-webkit-transition-duration: .50s;}.sidebar h2:hover {letter-spacing: 1px;color: #d0d0d0;-webkit-transition-duration: .50s;}
.sidebar h2 {font-family: Tahoma;font-size: 14px;color: #aeaeae;text-transform: uppercase;text-shadow:0 1px #dbdbdb;background-color: #f4f4f4;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;padding: 5px;margin: 2px;border-bottom: solid 1px #e3e1e2;text-align: center;-webkit-transition-duration: .50s;}.sidebar h2:hover {color: #d9d8d9;-webkit-transition-duration: .50s;}
E para trocar as cores é fácil né? Use a tabela de cores (www)
Espero ter ajudado, alguma duvida pergunte no comentários.
Adoei o tutorial irei usar .. Queria fazer afiliação,aceita,comenta lá no blog sua resposta. bjs
ResponderExcluirlittl-things.blogspot.com
Eu amei vou usar queria saber se o 2º modelo dá para usar como tÃtulo do post? e o que eu faço para usar? Obrigada!
ResponderExcluirSSonhos De Uma Belictioner
Obrigado Liamda! Usei o segundo!
ResponderExcluirOie *u* vemk como faz pra o background subir mesmo? porque eu to aplicando padding e o titulo que sobe . obrigado e.e
ResponderExcluirgeekegirlie.blogspot.com
Eu usei :3
ResponderExcluirusei
ResponderExcluirObrigada pelo tuto. Amei *-*
ResponderExcluirmythings2.blogspot.com.br/