• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

7 de março de 2013

Personalizando os Marcadores


Olá lindos lunáticos! Sumi de novo não é? Bem, mas hoje estou aqui e vim ensinar um tutorial muito fofo que vi lá no KW, então créditos!É muito fácil e os "previews" estão juntos com os códigos. Querem ver? 



1. Primeiro você precisa adicionar no seu blog o gadget marcadores. Muita gente não usa, é esse aqui:


2. Após adicionar, vá até editar html e procure pela tag ]]></b:skin>. Acima dela, cole o código de acordo com o modelo que deseja. Escolha seu código de acordo com as imagens, lembrando que vai ficar com os  marcadores que escolher, para lista não ficar muito grande. 


Código:
.widget ul, .widget #ArchiveList ul.flat {
list-style: none;
padding: 5px;
}
.widget ul li, .widget #ArchiveList ul.flat li {
text-align: center;
border-bottom: dotted 1px #d5d5d5;
-webkit-transition-duration: .50s;
}
.widget ul li:hover {
background: #f4f2f4;
-webkit-transition-duration: .50s;
}




Código: 
.widget ul, .widget #ArchiveList ul.flat {
list-style: none;
padding: 5px;
}
.widget ul li, .widget #ArchiveList ul.flat li {
background-color: #f4f4f4;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 5px;
margin: 2px;
border-bottom: solid 1px #e3e1e2;
text-align: center;
-webkit-transition-duration: .50s;
}
.widget ul li:hover {
background: #ffcad4;
border-bottom: solid 1px #fcb0be;
-webkit-transition-duration: .50s;
}

Gostaram? Beijos!

13 comentários:

  1. Realmente fica muito Kawaii...Eu vi esse tutorial no Kawaii World, só que eu já tinha editado meus marcadores com um tutorial que vi no Go Imagines...Kisus, é os marcadores ficam lindos...

    ResponderExcluir
    Respostas
    1. Verdade, esse tuto é super fácil e fofo!

      Excluir
    2. Querida, o tutorial do primeiro exemplo de marcador já temos há muito tempo aqui no blog, mais amei o fato de você postar o segundo modelo, eu também amei X)

      Excluir
  2. Muito lindo! Quero usar um :)

    Beijos, http://pequena-julieta.blogspot.com.br/
    Blog Atualizado :]

    ResponderExcluir
    Respostas
    1. Recomendo o segundo
      .
      .
      .
      .
      .
      .
      .
      .
      .
      .
      .
      .
      .
      e o primeiro também...

      Excluir
    2. -qqq
      IUSHAIUHAIUHSIAUHSAIUH ~
      lindo o result, já tinha visto no kw! kISSU~
      cherry Pimenta - perfil

      Excluir
  3. Esse tutorial é muito bom ,
    eu não uso mas quem sabe em breve.

    Beijos.

    http://meucupcakedemorango.blogspot.com.br/

    ResponderExcluir
  4. Muito fofo o resultado *-* Desculpe for mais você nao acertou no mini game, mas obrigada por participar, o vencedor ja foi anunciado .
    Beijos.

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

    ResponderExcluir
  5. Quando eu coloco esse código em qualquer html meu, o menu também fica com o efeito dos marcadores :X , Como resolver?

    ResponderExcluir