Personalizar início, postagens mais antigas e próxima


Hello bb's, fiquei muito feliz com os pedidos na Cbox *u* vou atender todos por ordem de chegada, podem pedir ♥

Vou ensinar como deixar a navegação (postagens mais recentes, postagens mais antigas e início) igual ao do blog, mas antes quero dizer que aprendi no Go Imagine. Let's go?

No html do seu blog, procure por #blog-pager { , depois acima dessa tag cole o código abaixo:

/* Navegação com efeito hover degradê - http://goimagines.blogspot.com.br */
#blog-pager {
clear:both;
text-align: center;
margin:0px auto;
padding:10px;
}
#blog-pager a:link, #blog-pager a:visited{
color: #ffffff; /* cor da fonte */
font-size: 16px; /* tamanho da fonte */
padding:5px;
background-color: #8BC2C9; /* cor do fundo */
-moz-border-radius:10px; /* bordas arredondas, apague se não quiser */
-khtml-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}
#blog-pager a:hover{
color: #ffffff; /* cor da fonte hover*/
padding:5px;
background: #BFCED5; /* fundo hover, apague o código abaixo até } se não quiser degradê */
background: -webkit-gradient(linear, left top, left bottom, from(#BFCED5), to(#8BC2C9));/* webkit browsers */
background: -moz-linear-gradient(top, #BFCED5, #8BC2C9);/* firefox3.6+ */
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#BFCED5', EndColorStr=' #8BC2C9');/* IE */
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
Depois edite conforme quiser as cores, visualize e se estiver tudo certo salve (:
Beijos~

11 comentários:

  1. me ajudou bastante o tutorial (: bjs

    http://window-soul.blogspot.com.br/

    ResponderExcluir
  2. Uau é muito legal muito pratico tambem me ajudoou baastante

    ResponderExcluir
  3. OBRIGADO PELA DICA!MAIS ANTES SÓ UMA PERGUNTA COMO QUE VOCÊ PERSONALIZA O SEU MENU,SEGUIDORES E ETC?

    ResponderExcluir
  4. OBRIGADAA, estava louca para achar, MUIIITO obrigada!

    http://diariodeumfablog.blogspot.com.br/

    ResponderExcluir
  5. Muito obrigada pela ajuda! estava procurando isso a dias,
    http://mundodasmeninas1001.blogspot.com.br/

    ResponderExcluir
  6. Este comentário foi removido pelo autor.

    ResponderExcluir
  7. Não achei o código me ajuda eu uso o modelo viagem(trevel) do blog

    http://amorepalavrass.blogspot.com.br/

    ResponderExcluir