dicas blog
Home » , , » Como personalizar os marcadores nas postagens do blogger

Como personalizar os marcadores nas postagens do blogger

6
Nesse tutorial  vou  ensinar a personalizar no blog os  marcadores  se  quiser  chamar  assim, dar  uma  personalização nesses links  com  css pode  deixá-los  mais  visíveis  aos  visitantes  do seu  blog,  e melhorar a visualização  das   suas  paginas  e  organizar  as  coisas.  colocando    marcadores   personalizados   você  tuna    seu  blog  e   deixa  mais  chamativo  para  o  visitante  você  vai   usar   esse  código  dentro  do HTML do  blog , e ele vai gerar  o  efeito  nos  marcadores  que ficam  em  cada  uma  das  suas  postagens como  na foto  abaixo  você  vai  poder   alterar   as  cores   de tudo  para  combinar  com  seu  blog  da  melhor  forma possível siga  o  tutorial  abaixo  e  vamos  lá.

Tutorial  para blogspot  e blogger:



Primeiro    em  modelo editar HTML  expandir  modelos  de  widgets

Copie   o  código  abaixo  e   cole  acima  de ]]></b:skin>

.post-labels a {
    display: inline-block;
    padding: 4px; /*distancia um do outro */
    outline: 0;
    color: #FFF; /*cor texto  normal*/
    background : #069; /*cor do botão principal*/
    margin: 2px;
    font-family: 'Open Sans', sans-serif;
    text-decoration: none;
   
    height: 20px;

}
.post-labels a:hover {
 background: #F33;/*cor do botão hover*/
 text-decoration: none;
 color: #000; /*cor texto hover*/
 -webkit-border-radius: px;
 -moz-border-radius: px;
 -o-border-radius: px;
 border-radius: px;

}

Tutorial  atualizado:código na caixinha abaixo. 

Faça  alterações  de  acordo com  as  explicações  dentro  do  código.

Depões de  feito  tudo  visualize se estiver  tudo  a  seu  agrado  salve.

6 comentários:

  1. Como faço para retirar as vírgulas que separam os labels?

    ResponderExcluir
    Respostas
    1. Ola Mar quando você cria uma labe nova o próprio blog gera vírgulas, você pode tentar deixar sem mas não sei se isso é possível. vou tentar ver se da para ocultar elas se conseguir faço um tutorial obrigado pela visita.

      Excluir
  2. Obrigada,me ajudou bastante (:


    http://princesadopanico.blogspot.com.br/

    ResponderExcluir
  3. Aqui foi o único blog que consegui esse tutorial com o resultado esperado, obrigada! :D

    ResponderExcluir