DIY :: Como Personalizar os Gadgets do Blog

by - 11:58

Olá Pessoas , Tudo bem ?  hoje vou ensinar a como personalizar seus gadgets , assim como eu fiz o meu ou até melhor haha ^^ , quer aprender , siga o tutorial , passo a passo e com cuidado !





Primeiro vá em  MODELO > HTML , em seu teclado coloque Ctrl + F  , vai aparecer uma caixinha , dentro dela você vai colocar isto e clicar Enter :

h2 {

Se você nunca personalizou esta parte estará assim:

 h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}

Centralizando o título :

Antes de fechar a } insira este código:


text-align: center;

Colocar uma cor de fundo:

Antes de fechar a } insira este código:


background: #000;  /*color de fundo*/

Onde está de rosa modifique o código pela cor que deseja.

Arredondando as bordas do fundo:

Antes de fechar } insira este código:

background: #000;
 -moz-border-radius: 3px;
-webkit-border-radius:3px;
-goog-ms-border-radius: 3px;
border-radius:3px;

O 3px é o angulo de arredondamento. Quanto maior fica mais arredondado fica. Se for deixar mais redondo terá que modificar os quatro 3px, para dar certo.

Colocando imagem ao invés de cor:

Antes de fechar } insira este código:

background: transparent url(ENDEREÇO DE SUA IMAGEM) center no-repeat
height: 50px; /*altura da imagem*/
width: 200px;  /*largura da imagem*/

Você pode colocar faixas, basta saber o tamanho dela e hospeda-la para obter o url da imagem , ok ? haha


Aqui alguns Modelos que vocês podem pegar o url ! 






Share
Tweet
Pin
Share
Tags : ,

You May Also Like

22 comentários

  1. Ótimo tutorial, vai ajudar muita gente!

    http://www.bilhetedagarrafa.com.br

    ResponderExcluir

  2. Adorei o post flor....muito útil Amei beijinhos :*

    http://www.vamospapear.com/

    ResponderExcluir

  3. Amore,tu faz parceria de divulgação ?
    Ta rolando campanha de criação de looks carnaval na ALLANI!
    PopDay -
    @thaisrr

    Beijos!

    www.allani.com.br
    ALLANI - Rede social de moda

    ResponderExcluir

  4. Olá Natali *-*
    Adorei a sua explicação, isso vai ajudar muitas pessoas. Está de parabéns *-*
    Muito obrigada pela sua visita em meu blog e obrigada pelo carinho *-*
    Um super beijo e sucesso sempre

    BLOG: http://gabiivinholi.blogspot.com.br/

    ResponderExcluir
    Respostas

    1. Obrigada *-* e imagina , prazer foi meu de ver seu blog , adoro ver o blog das leitoras !

      Excluir

  5. Legal o método, não sei se o modelo fica parecido com o meu!

    http://heytutty.blogspot.com.br

    ResponderExcluir

  6. Adorei o seu tutorial lá no meu blog também tem tutoriais sobre blogs venha ver http://crochebycroche.blogspot.com.br/2015/02/serie-como-colocar-menu-acimado.html

    ResponderExcluir

  7. Sou apaixonada por imagem no titulo do gadget... conheci seu blog atravez do link que voce deixou em outro blog e vim cinhecer...
    Gostaria de te convidar para conhecer meu cantinho, la tambem disponibilizo varios tutoriais, packs em png para blog, layouts free exclusivos personalizados por mim mesma...
    Sera um imenso prazer te receber por la --> www.renatamassa.com
    Bjus linda, sucesso!!!

    ResponderExcluir

  8. Não consigo fazer essas configurações já tentei varias vezes.
    Essa configuração dá certo com qualquer layout?

    ResponderExcluir
    Respostas

    1. não , não pode estar muito modificado , porque ai vai ser bem mais dificil achar os nomes corretos .

      Excluir

  9. Flor, quando digito a tag h2 { eu não consigo achar.... Só consigo acha o h2, só que em baixo nao tem nada escrito color;text etc... Me ajuda please ?

    ResponderExcluir
    Respostas

    1. mesmo que não apareça assim , pode colar o código depois vizualiza pra veer se deu certo , mas faça um backup do blog antes !

      Excluir

  10. Oi Natali, estes códigos ainda funcionam? Nao consegui encontrar nada no HTML

    ResponderExcluir

  11. OI NATALI, VIM LHE PARABENIZAR POR ESTA POSTAGEM. EU ESTAVA MESMO QUERENDO PERSONALIZAR O TITULO DOS GADGETS DO MEU BLOG, MAS GRAÇAS A SUA POSTAGEM, CONSEGUI E AMEI O RESULTADO. ESTOU COMEÇANDO O MEU BLOG AGORA E ESTÁ AINDA EM PROCESSO DE PERSONALIZAÇÃO, OBRIGADA POR COMPARTILHAR SEUS CONHECIMENTOS. CASO QUEIRA VER COMO FICOU O MEU BLOG, ME FAÇA UMA VISITINHA. www.andreiapaula.com.br

    ResponderExcluir

  12. Oie Adorei o post mais o meu n esta dando certo

    ResponderExcluir