6 de mar de 2013

Tutorial - bordas coloridas na sidebar do Blogger

Olá amigos do Mundo Informal! O tutorial que disponibilizo hoje, tem sido utilizado por muitos blogs pois fica muito bonito em qualquer modelo. O efeito é bem discreto e passa ao leitor um ar de profissionalismo.
Bom, não é preciso seguir muitos passos, mas siga com atenção para que não ocorram erros.

Alerta! Antes de fazer qualquer modificação, faça um backup do seu modelo.
Acesse modelo 
 Fazer backup/Restaurar  Fazer download do modelo completo.


1° passo: Acesse o painel do Blogger, escolha o blog que você deseja instalar, selecione a opção "Modelo" e clique em "Editar HTML".

2°passo: Agora usando o Ctrl + F, procure por:

]]></b:skin>

3° passo: Acima da tag encontrada, cole o código abaixo:




Caso queira alterar a cor das bordas, altere #d4bfb1 com a cor desejada. Veja a paleta com os código das cores aqui.

4° passo: Caso você queira inserir esse estilo para apenas um widget, como exemplo o último, procure por:
.sidebar .widget:last-child {

Deverá aparecer desse jeito → .
sidebar .widget:last-child {border-bottom: none;margin-bottom: 0;padding-bottom: 0;


Cole o seguinte código abaixo de:


 padding-bottom: 0;

5° passo: Salve e veja a mudança! 

Pronto! Salve e veja como ficou!
Compartilhe essa postagem!
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

Recomendamos para você »

2 comentários

  1. Cadê um exemplo? Quer que eu coloque isto em meu blog sem ter ao menos ideia de como pode ser? kkkk E tira a captcha desses comentário pq muita gente desiste!

    ResponderExcluir
  2. cade a demostração coloca pelo menos uma foto ai pó ^^ kkk

    ResponderExcluir

Seja livre para expor seu pensamento!

Se preferir, antes, leia nossas regras para comentários...
(Atenção: Comentários "Anônimo" não serão publicados. Escolha "Nome/URL". Obrigado!)
Bom comentário!

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
Pré-Designed by BlogThietKe Designed by @Mundo_Informal
© 2012-2014 .::Mundo Informal::. Todos os direitos Reservados
Licença Creative Commons
...See you!
Voltar ao topo