26 julho 2013

0

Personalize os títulos dos gadgets

Olá Cerejinhas. Tudo bem?Hoje você vai aprender como personalizar os títulos dos gadgets.

Eu vou mostrar onde você deve mexer, e passar um código básico, mas você pode usar sua criatividade para fazer outras alterações e criar diferentes estilos.

Vá em Modelo, E clique em Editar HTML, aperte Ctrl+F e procure por--->
h2 {



Logo abaixo do trecho que você procurou, vai ter algo parecido com isso:

h2 {
  font: $(widget.title.font);
  color: $(widget.title.text.color);
}
Apague toda essa parte e no lugar coloque esse código:
.sidebar h2 {
font-family: Century Gothic; /*Tipo de fonte*/
font-size: 16px; /*Tamanho da fonte*/
color: #000000; /*Cor da fonte*/
border-bottom: 2px solid #fff; /*Borda de baixo, apague se não quiser*/
background: #fbfbfb; /*Cor de fundo*/
text-align: center; /*Alinhamento do texto*/
}
Agora é só modificar as cores e a fonte como quiser. Se em vez de cor, você quiser colocar uma imagem de fundo, substitua essa parte:
background: #fbfbfb; /*Cor de fundo*/
Por isso:
background: url(link_da_imagem) no-repeat center;
height: 30px;/*Altura da imagem*/
width: 200px; /*Largura da imagem*/ 
Visualize se está tudo certo e salve. A partir desse código você pode aplicar outros efeitos, como sombrabordas arredondadas e outros estilos de bordas. Espero que tenha sido útil. Se usarem, não esqueçam dos créditos ok ;D Beijinhos Tropicais..

Fonte: www

Algumas imagens que pesquisei pra vcs::

.



15




                 



Nenhum comentário:

Postar um comentário

-Antes de falar sobre qualquer outra coisa, comente sobre o post.
- Alguma dúvida ou algum pedido? Comente!
- Sim, visito o seu blog, mande o link! =)
-Favor não ofender ninguém, elogios e criticas são bem vindos, mas mantenha o respeito!
- Obrigada, GR!