27.4.14

Como personalizar os Gadgets do seu blog?

yummy! <3 | via Tumblr

Olá pessoal, uma leitora MB pediu ajuda para personalizar os Gadgets, e bom nesse tutorial vim com a ajuda para quem quer mudar o visual do seu Gadgets, busquei por 2 tutorias, espero que gostem e comentem...
PRIMEIRO TUTORIAL


 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*/

fonte: www

SEGUNDO TUTORIAL

1°. Vá no HTML do seu blog
2°. Dê um Ctrl + F e procure por .footer-inner .widget h2,. Abaixo dessa tag terá algo mais ou menos assim:

.sidebar .widget h2 {  padding-bottom: .5em;

4°. Apague todo esse código e substitua por:

/* Efeito Faixinha na sidebar by: www.tutoriar.com */.footer-inner .widget h2,.sidebar .widget h2 {padding-bottom: 1.1em;  background:url(' ')no-repeat;
margin-left:-30px;  text-align:center;}

5° Substitua tudo que estiver em negrito até ficar bom! Não esqueça de visualizar antes de salvar. Em background:url(‘’) cole entre as ‘’ o código de alguma faixinha. É claro que eu trouxe algumas pra vocês né:


















                                                    Essas são mais grossas, as ribbons:















Fonte: www

11 comentários:

  1. Adoreeeii !! Muito obrigada mesmo me ajudou muito !! =3

    ResponderExcluir
  2. E se não for muito abuso...Também pode fazer um tutorial de como personalizar os comentarios?? Obrigada s2 !

    ResponderExcluir
  3. Oi,comentei em um post antigo seu, por isso estou avisando aqui. Poderia responder ele?

    O post é esse: http://misteriodobrilho.blogspot.com.br/2012/11/veja-como-colocar-leia-mais-no-seu-blog.html

    Obrigada.

    oficialsonhosdegarota.blogspot.com.br

    ResponderExcluir
  4. ta aceitando afiliação?
    http://lovaticswarrio.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Sim, aceito. Siga o que se pede no link abaixo, copie e cole:

      http://misteriodobrilho.blogspot.com.br/2014/04/aviso-vagas-para-afiliados.html

      Excluir
  5. To apaixonada pelo layout do seu blog! Amei o tutorial, voce explica super certinho, mas o meu nunca da certo. Ja vi centenas de tutos e nao consigo achar meu erro :(
    Como voce mesma disse, deve ser porque meu template esta todo modificado ja.
    Obrigada mesmo assim!! ♥♥♥
    http://natalibispo.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada, obrigada e obrigada sua linda ♡☆
      Sinto muito por não ter conseguido fazer o tutorial ><

      Beijos gata :*

      Excluir

- Se tive alguma dica, diga! =)
- Alguma dúvida ou algum pedido? Comente!
- Sim, visito o seu blog, mande o link! =D
-Favor não ofender ninguém, elogios e criticas são bem vindos, mas mantem o respeito!
Obrigada, MB!

Copyright © 2016 | Design e Código: Mistério do Brilho e Sanyt Design | Tema: Viagem - Blogger | Uso pessoal • voltar ao topo