Baú da Dri um blog descontraído com receitas diversas , casa e astral , dicas e personalizações para blogs , brindes ,artesanato decorativas , porcelanas e muito mais!

7 de maio de 2019

Personalizando os Marcadores ou Categorias do Blog

Dicas de como organizar seus marcadores/categorias


Personalização dos marcadores/categorias do blog

Os marcadores ou categorias são extremamente importantes para o blog pois eles ajudam a organização dos assuntos , pois quando um leitor clica em cima do marcador/categoria ele é direcionado para a pagina contendo todos os assuntos identificados com aquele marcador .
Ficando assim :

https://www.baudadri.com/search/label/feminino

E aparecerá assim: 

exemplo de pagina

Então organize seus marcadores por assunto tente não colocar em excesso para não confundir o leitor , na configuração do seu gadget  marque para aparecer só os selecionados por você em cloud  e ordem alfabética o que facilita muito.


Então agora vamos personalizar os marcadores/categorias deixando eles combinando com o seu blog , eu separei três estilos de personalização diferentes e simples para vocês executarem , estarei disponibilizando uma tabela de cores para que vocês querendo possam fazer suas próprias combinações.
Vamos lá então.

Abra o blog em tema editar HTML e procure por ]]></b:skin> acima dele cole o código escolhido visualize estando correto salve. Pronto marcadores/categorias personalizado.

Primeiro  ( Modelo  gradiente  com borda quadradinho em hover  ) código

.Label a{
 background:linear-gradient(ivory,azure,floralwhite);
 padding:4px 8px;
 margin:4px;
 font-family:Pacifico;
 font-size:14pt;
 font-style:bold;
 color:#778899 !important;
 display:block !important;
 text-decoration:none;
border:groove;
border-color:mistyrose;
border-width:6px 6px 6px 8px;
float:left;
}
.Label a:hover{
 background:#fffff3 ;
 color:#dd2c72!important;
}


Abaixo dos códigos vou deixar um print para vocês terem uma ideia de como vai ficar:

Modelo 1




Segundo ( modelo arredondado gradiente em hover ) código

.Label a{
     background:linear-gradient(Pink,lightcyan, Peachpuff);
     padding:4px 8px;
     margin:4px;
     font-family:Pacifico;
     font-size:14pt;
     font-style:bold;
     color:#403c52 !important;
     display:block !important;
     text-decoration:none;
     border-radius:10px;
     border-width:12px 12px 12px 0;
     float:left;
     }
    .Label a:hover{
     background:#ccccff ;
     color:#b0c4de!important;
     }


Modelo 2
modelo arredondado de categorias

Terceiro ( modelo em caixinhas ) código



.Label a{
 background-color:#b37987 ; /*cor do fundo*/
 padding:4px 8px; /* distancia entre as caixas*/
 margin:4px;
font-family:pacifico;/*fonte*/
 font-size:14pt;
font-style:italic;
 color:#fffff3!important; /*cor do texto*/
 display:block !important;
 text-decoration:none;
 border:ridge;6px !important; /*estilo da borda*/
 float:left; }
 .Label a:hover{
 background:#faf0d4;/*cor do fundo ao passar o mousse*/
 color:#b37978!important;}/*cor do texto ao passar o mousse*/




Modelo 3
personalização do marcador do blog



Quarto  ( modelo etiqueta ) código :



.Label a{
 background-color:#ff00ff; /*cor do fundo*/
 padding:4px 8px; /*distancia entre as caixinhas*/
 margin:4px;
font-family:Altura;/*fonte*/
 font-size:14pt;
font-style:italic;
 color:#ffffff!important; /*cor do texto*/
 display:block !important;
 text-decoration:none;
 border:dotted;16px !important; /*estilo das borda*/
 float:left; }
 .Label a:hover{
 background:#fffafc;/*cor do fundo ao passar o mousse*/
 color:#b37978!important;}/* cor do texto ao passar o mousse*/


Modelo 4

personalização dos marcadores



  • Atualizado em 22/09/2019

Esse três modelos são simples de colocar testei em vários temas do blogger não tive problema em nenhum , todos ficam em hover ao passar o mousse , você pode trocar as cores se desejar , estou deixando um link com algumas combinações de cores.

Aqui tem uma
Paleta de Cores Do Baú da Dri  novas cores.

Por hoje é isso . Gostou do post ? Deixe seu comentário , pedido , querendo peça o tutorial que gostaria de ver , compartilhe espalhe o link do blog por ai isso ajuda o blog a crescer .😉





5 comentários:

  1. Olá, boa noite! Tenho acompanhado seu site e tem me ajudado muito! Obrigada por compartilhar e nos ajudar!!
    Mas preciso de uma ajuda específica que não achei: nas minhas postagens aparece a categoria que a postagem pertence, porém só aparece uma. Um exemplo: postei sobre um determinado assunto, mas antes de postar, coloquei ela em duas categorias, mas quando público aparece só uma e é primeira em ordem alfabética. Como posso colocar para aparecer todos as categorias que coloquei nas postagens? Por favor? Obrigada desde já!

    ResponderExcluir
    Respostas
    1. Você tem que configurar o gadget dos marcadores , configure marcadores selecionados , ordem alfabética ou por frequência , cloud , depois marque na caixinha de cada etiqueta que você deseja que apareça.

      Excluir
    2. Muito obrigada por responder, Adriana! Mas está marcado. Na página inicial, está aparecendo todos os marcadores da gadget. Nas minhas postagens é que não estão. Se uma postagem "x", coloco dois marcadores ou mais, só aparece um após a publicação. Sabe quando aparece a categoria da postagem para os leitores na postagem? No meu caso fica abaixo do título. Nesse local que só aparece um, mesmo eu colocando mais de um lá na edição da postagem.

      Excluir
    3. Boa tarde Dani dei uma olhada no seu site seu template não é nativo do blog , pode ser nas configurações dentro do HTML , eu não saberei te dizer sem conhecer mas dei umas pesquisadas em alguns modelos semelhantes ao seu , para poder te ajudar se você desejar entra em contato comigo pelo whats assim posso te orientar e tentarmos resolver , eu fico muito incomodada quando algo não funciona à contento , no que precisar estou a disposição.
      Obs: Amo plantas , #ameiminijardim e cia . Bjs

      Excluir
    4. Oiê! Perdão, pela demora em responder. Fico feliz que tenha gostado do blog! Obrigada!! Sou apaixonada por plantas também! rs
      Se não for te incomodar, eu aceito. Você quer me passar seu número ou te passo o meu? Qualquer coisa esse é o meu e-mail: minijardimecia@gmail.com
      Muito obrigada pela atenção e ajuda!!Bjs 😊

      Excluir

Gostou do Post , deixe seu comentário e sugestões .
Em breve responderei a todos.

Copyright © Blog de Variedades Baú da Dri Design by Adriana Bentim | Tecnologia do Blogger