Tutorial - Personalizar cada gadget da sidebar


Olá ,Tudo bem?

Então como alguns não sabem eu voltei para o Birthday Cake, eu fiquei desde agosto sem internet,foi uma tristeza que só, e ainda tive coragem de deixar o meu blog aberto, com todos visitando e etc...Mas finalmente voltou, era oquê eu mais desejava pra mim, porquê eu já queria trocar o layout do meu blog, o Little-world, como alguns conhecem já, e eu resolvi postar agora para deixar as coisas livre do jeito que eu queria. Mas tomara que não corte de novo, fiquei sem porquê meu pai tá muito atrapalhado por causa de contas.

Bom, posso dizer pra vocês que eu podia ter postado um utilitário ou coisa assim,Mas resolvi postar de uma vez o tutorial de como mudar os gadgets, fica lindo com um layout exclusivo, dá um toque muito diferente no blog, fica com uma aparência muito diferente. Eu não vejo muitos usando isso não sei porquê disso,mas... O tutorial é meio que complicadinho, mas com certeza vocês conseguem, basta fazer com atenção, e com bastante calma, eu nunca fiz isso no meu blog, mas eu acho lindo. Só acho que tem que combinar as cores! 

:
 
Viram como o fundo está de cor diferente? Então vamos ao tutorial.

Primeiro você deve saber o nome do gadget que deseja mudar. No exemplo eu irei mudar o gadget de nome "Menu".

Abra o modelo HTML do seu blog e marque a caixinha "Expandir modelos de widgets"
Dê um clique dentro da janela com o código HTML, aperte Ctrl+F e procure pelo nome do gadget:


(Clique para ampliar)


Onde está em laranja é o nome do gadget que eu pesquisei. Onde está contornado de rosa é a Id do gadget, é desse nome que iremos precisar. Neste caso a Id do gadget éHTML1, anote ela que iremos usar no próximo passo.

Cole o código abaixo antes de ]]></b:skin>

#ID-DO-GADGET {
background: #fff; /*Cor de fundo do gadget*/
}
#ID-DO-GADGET h2 {
/*Estilos para o título do gadget*/
Font-family: Verdana;
color: #000;
font-size: 14px;
}
Você só tem que substituir a parte em negrito pela Id que pegamos no passo anterior e aplicar os estilos desejados. Eu coloquei apenas o básico do básico neste código, mas você pode adicionar todas as personalizações que quiser. Você fazer isso com vários gadgets do blog, é só pegar a ID e colar o código.

Espero que tenham gostado!Lembrando que peguei no CB <3

7 comentários

  1. Como eu expando modelos de widgued no novo modelo do blogger??

    ResponderExcluir
  2. Não tem menu mais no novo modelo do blogger

    ResponderExcluir
  3. Adorei o tutorial, estava precisando. Seja bem vinda de volta ;***

    ResponderExcluir
  4. Ótimo tuto, gostei muito :3
    cr4zy-world.blogspot.com

    ResponderExcluir
  5. Amei o tutorial, é bem legal *------*

    http://blog-patriciamachado.blogspot.com.br/

    ResponderExcluir

- Se quiser um post, peça na ask !

- Se não gostou, não use palavras ofensivas. Ninguém precisa rebaixar-se a tanto para expressar a opinião.

- Leio todos os comentários, respondo e retribuo sempre que o tempo deixa.