26 de out de 2012

Hey, angels :) What's up?

Trouxe hoje um tutorial bem simples sobre como personalizar o título dos gadgets. Querem aprender? Então vamos lá!

Primeiramente, vá em Design > Editar HTML. Apertando Ctrl+F, procure por:
]]></b:skin>
Agora, acima dessa tag cole o código da personalização do título do seu gadget. Você pode encontrar em vários sites ou usar um desses:

O título dos seus gadgets vão ficar assim quando personalizar.
.sidebar h2 {
text-align: center;
background-color: #ccc; ---/*cor de fundo */
width: 265px;
height: 15px;
font-size:13px; ---/* tamanho da fonte */
text-shadow:0 1px 1px #fff;
border-bottom: 3px solid #DEC4F4; ---/* cor da linha */
A, A:link: #000000;text-decoration:none;
-moz-border-radius: 10px; /* Para Firefox */-webkit-border-radius: 10px; /*Para Safari e Chrome */border-radius: 10px; /* Para Opera 10.5+*/ }
Observação: se não quiser o efeito redondo é só apagar as partes em itálico.

O título dos seus gadgets vão ficar assim quando personalizar. 
.sidebar h2 {
text-align: center;
background-color: #ffffff; ---/*cor de fundo */
width: 265px;
height: 15px;
font-size:12px; ---/* tamanho da fonte */
text-shadow:0 1px 1px #c9c9c9;
A, A:link: #000000;text-decoration:none;
border-bottom: 1px dashed #ff79c1;
border-top: 1px solid #ffffff; } 

O título dos seus gadgets vão ficar assim quando personalizar. 
.sidebar h2 {
text-align: left;
background-color: #F1F1F1; ---/*cor de fundo */
width: 265px;
height: 10px;
font-size:15px; ---/* tamanho da fonte */
font-color:#707070; ---/* cor da fonte */
text-shadow:0 1px 1px #c9c9c9;
A, A:link: #000000;
text-decoration:none;
border-top: 1px solid #ffffff;
border-bottom: 3px double #b779ff; }
Vocês podem editar as cores usando a Tabela de Cores. Bom, eu aprendi a fazer no blog Other Things Attitude Included, então créditos dados =D 

Espero que tenham gostado e que tenha sido útil.
Beijos,

Mrs. Nightshade.

2 comentários: