Como personalizar o gadget postagens populares do Blogger

gadget postagens populares
Olá amigos Mult-focos, veremos neste tutorial como personalizar o gadget postagens populares do Blogger.
Primeiro vais adicionar o gadget (Postagens populares) se já o tens instalado ótimo, mas vai ter que configurá-lo como mostra a figura abaixo.


Configurar postagens populares

Vamos agora para a personalização no seu template, antes faremos um backup do mesmo.
Agora que fizemos o backup, estamos prontos para começar a personalização do gadget.

Painel do Blogger->Modelo->Editar HTML->Ctrl+F para localizar]]></b:skin>
Copie o código abaixo e cole acima de ]]></b:skin>
Visualize, se tudo esta ok salve e sua personalização já será visível.
 /*--- Mult-focos --- */ 
.popular-posts ul { 
padding-left: 0px; 
counter-reset: popcount; 
}
.popular-posts ul li:before { 
list-style-type: none; 
margin-right: 15px; 
padding: 0.3em 0.6em; 
counter-increment: popcount; 
content: counter(popcount); 
font-size: 16px; 
background: #1D76A4; 
color: #ffffff; 
position: relative; 
font-weight: bold; 
font-family: georgia; 
float: left; 
border: 2px solid #dddddd; 
box-shadow: 1px 2px 9px #666666;border-radius:15px; }
.popular-posts ul li { 
border-bottom: 1px dashed #dddddd; 
}
.popular-posts ul li:hover { 
border-bottom: 1px dashed #696969; 
}
.popular-posts ul li a { 
text-decoration:none; color:#5A5F63; 
}

.popular-posts ul li a:hover { 
text-decoration:none; 
} 
Algumas configurações possíveis
Alterar cor de fundo (background: #1D76A4;) é só mudar #1D76A4
Para alterar a cor do texto do circulo que esta #ffffff
Para mudar o circulo para quadrado elimine (border-radius:15px;)
Então pessoal isto é tudo.

4 comentários:

  1. O titulo dos posts populares não aparece não sei o motivo...o que faço?

    ResponderExcluir
  2. @Fernanda MariaOlá Fernanda!
    Adicionou e configurou antes o gadget (Postagens populares)? Pois não funcionará se antes não o fizer.
    Um abraço e sorte.

    ResponderExcluir
  3. Olá! Localizei ]]>, mas não consegui localizar o "ppppp". Que significa isso? Onde eu o encontro para finalmente colar o código que o senhor oferece?

    ResponderExcluir
  4. @Davilson SilvaOlá Davilson Silva desculpe o atraso da resposta, tenho focado em outro setor e o tempo esta escasso.
    Onde você lê ppppp leia: ]]> estarei corrigindo o post.
    Espero que perdoei a minha falha, obrigado.

    ResponderExcluir

Todos comentários são lidos e moderados previamente.
São publicados apenas aqueles que respeitarem as regras abaixo:
-Ter relação com o assunto do post.
-Não conter propagandas de outro site ou blog.
-Não incluir links no conteúdo do comentário.
-Se quiser deixar sua URL, comente usando a opção OpenID;
Obrigado(a) por comentar!

free website hit counter