Dominio: mundoblogger.com.br
Chave: 6750f38d68212cb9ffc85aee2a0ef61d0ebf4f04
Hora do cache: 1484305732
Vida do cache: 1485601729
Status: 1
Mensagem: Licença válida
Chave do Pedido: 11808bbc6205bade68f0b70c302eaa74d4305945
Chave do Produto: PROKEY
Scroll Top

Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Criação de Blogs Profissionais e Redes Sociais.

Hospedagem - 728 x 90

Tutoriais Blogger

Alterar Link Postagens Mais Antigas e Recentes

Se você quiser, pode modificar o link Postagens Mais antigas e Postagens Mais Recentes, que se encontram no final de cada postagem, podendo alterar apenas o texto ou incluir uma imagem no lugar do texto.

Quer ver ‘comofaz’?

[becape]Antes de mais nada, você já deve saber que é sempre bom fazer um backup do seu Template para evitar transtornos.[/becape]

feito isso, entre na edição HTML do seu template, clique em “Expandir modelos de widgets” e procure pelo seguinte código:(você pode usar ctrl+f colando a 1ª linha do código para facilitar sua busca)

<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>

 

Para substituir apenas o texto:

<data:olderPageTitle/> Se refere ao link para postagens mais antigas. Se quiser alterar o texto padrão do blogger por um seu, basta SUBSTITUIR este trecho pelo seu texto.(Sugestão:Página Anterior);

<data:newerPageTitle/> Se refere ao link para postagens mais recentes, faça o mesmo procedimento explicado acima substituindo este trecho pelo seu texto. (Sugestão:Próxima Página);

<data:homeMsg/> Se refere ao link para página inicial do blog (Inicio), siga o mesmo procedimento explicado acima, substituindo este trecho pelo seu texto. Esse trecho aparece duas vezes, portanto você deve modificar 2 vezes da mesma maneira.

Substituir texto por imagem:

Se quiser substituir por imagens de seta esquerda, direita e home,Procure pelo código:


<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable> 

 

e SUBSTITUA tudo por:


<b:includable id='nextprev'>
 <div id='blog-pager'>
 <b:if cond='data:newerPageUrl'>
 <a expr:href='data:newerPageUrl' expr:title='data:newerPageTitle' id='blog-pager-newer-link'>
 <img src='ENDERECO-DA-IMAGEM-ESQUERDA'/></a>
</b:if>
<b:if cond='data:olderPageUrl'>
<a expr:href='data:olderPageUrl' expr:title='data:olderPageTitle' id='blog-pager-older-link'>
<img src='ENDERECO-DA-IMAGEM-DIREITA'/></a>
</b:if>
<a title='página inicial' class='home-link' expr:href='data:blog.homepageUrl'>
<img src='ENDERECO-DA-IMAGEM-HOME'/></a>
</div>
<div class='clear'/>
</b:includable>

 

Coloque o endereço da sua imagem no local indicado.
Pronto, agora é só salvar e conferir o efeito!

Se quiser, confira também o artigo: Customizar os Links de Navegação do Blogger.



De um play no vídeo abaixo e aprenda a Criar blogs Profissionais




Gostou deste artigo? Ajude nosso projeto.
Compartilhe em suas redes sociais nos botões abaixo:

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Sobre o autor | Website

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

35 Comentários

  1. Carolina disse:

    Como colocar esta seta lateral que tem neste blog, não achei na pesquisa. obrigada

  2. Ahh ameii, funcionou direitinho.
    Muito obrigado ?

  3. Bia disse:

    yay, funcionou direitinho no meu!!!! ^^
    adoro seu blog *-*

  4. Vládia disse:

    Oi Vanessa,

    Recoloquei o html e os links retornaram. Agora não sei como usar o comando “display:none”. Onde e de que forma coloco? Eu até procurei pelo código do seu outro artigo #blog-pager-older-link, e o encontrei mas sem o símbolo #, encontrei apenas blog-pager-older-link, aparece 3 vezes em dois blocos de span, ao todo 6 vezes. E fiquei sem saber depois do que usar “display:none”. Tem algum tutorial sobre isso?

    • Vanessa disse:

      Vc tem que localizar no CSS:
      blog-pager
      blog-pager-older-link
      blog-pager-newer-link

      • Vládia disse:

        ah! eu tava perdida no HTML. Achei blog-pager no CSS e coloquei display:none e sumiu a barra branca. Yes! Mas no CSS só achei mesmo o blog-pager. Os outros só aparecem já depois , pela primeira vez numa correção do IE6. Mas acho que não tem problema, será? vou testar inserir mais postagens (até agora só fiz uma de teste). De qualquer forma o objetivo era sumir com o background dos links e ele sumiu. Valeu mesmo!!!

  5. Vládia disse:

    Blz! só não sei o que fazer com o espaço em branco que fica no template após retirado os links. Tem como sumir com esse espaço?

    • Vanessa disse:

      Vládia,não sei te informar ao certo, pq para cada caso é um caso..tudo pode variar de template para template..mas posso te recomendar que dê uma olhada neste artigo:
      http://www.mundoblogger.com.br/2010/09/corrigir-bug-nos-links-de-navegacao.html
      Pode ser que te ajude.

      • Vládia disse:

        Obrigada Vanessa, mas o link que você passou ensina como colocar de volta os links e não é isso que quero. acabei de retirar. o que quero é fazer sumir o background dos links que apaguei, pois depois de retirados fica só uma faixa branca no lugar que eles estavam, entre a área de postagem e o rodapé. se souber de algo que possa ajudar com isso. pensei em apagar todo o código que se refere a esses links (postagens e início), mas fiquei com receio de danificar o template e não saber como consertar. você saberia qual código define o background deles?

        • Vanessa disse:

          Vc retirou os links como? Apagou as linhas html ou apenas acrescentou o “display:none” no CSS?
          Se acaso apagou as linhas html, tente coloca-las novamente e oculte os links de navegação pelo CSS, usando o “display:none”.

  6. Lina disse:

    Ameeeeeeeeeeiiii!!!!

    Eu já modifiquei no meu template, eu particularmente gostei muito do resultado! Suas dicas são ótimas! Jamais nos abandone, nós blogueiros precisamos de você!

    Beijuzzzzz!!!!

    Se quiser dar uma olhada:pensaoacaso.blogspot

  7. Trollagem Memes disse:

    uma duvida que vem na cabeça de muitos e poucos sabem é como mudar a frase quando passa o mouse sobre a imagem para proxima pagina ou seja postagem mais antigas e recentes como mudaria esse texo que aparece quando por cima é colocado o mouse ?

  8. .:: Clau ::. disse:

    Willian
    Vou ficar te devendo a resposta, pq eu não sei te informar.

  9. William_Giani disse:

    Bom dia Clau,
    Gostaria de fazer uma pergunta..
    Como eu poderia alterar o numero de postagem exibidas?

    Tipo: No meu blog quando clico em postagens antigas mostra um limite de 7 postagens…
    Como eu poderia aumentar esse limite?

    PS: Gostaria de aumentar para 20

  10. Beatriz disse:

    Oi Clau !

    Tem como eu mudar a cor do telhadinho e das setinhas ?

    Desde já agradeço!

  11. .:: Clau ::. disse:

    Fabiane
    Não há como eu te prestar uma ajuda mais precisa, mas tente fazer o seguinte:
    tenta localizar a linha <b:includable id='nextprev'>
    (use o ctrl+f), e em seguida tenta localizar as urls das imagens e vai substituindo uma por uma.

  12. Igreja Viver para Cristo disse:

    Oii..

    Fiz tudo conforme o tutorial e deu certinho, só que hospedei as imagens em um site externo e acabou dando problemas nesse site, ai tentei seguir pelo tutorial para mudar as imagens e não acho mais o código.. sera que vc poderia me ajudar?

    Fabiane.
    Obrigada

  13. Beatriz Larah disse:

    Muuuito obrigada ! Deu certinho!!

  14. Isabella F. disse:

    E para quem quer só mudar o css destes links eis os códigos para 'postagens mais antigas', 'inicio' e 'postagens mais recentes'.

    .blog-pager {padding: 20px;} =aqui é o espaçamento geral

    .blog-pager-newer-link {color:#fff;
    background-color:#441a55;} =postagens mais recentes

    .blog-pager-older-link{color:#fff;
    background-color:#441a55;padding: 2px;}=postagens mais antigas

    .home-link {color:#fff;
    background-color:#1b1a1a;padding: 2px;}=inicio

    Por Eu xD, quem quiser ver o resultado é só ir no meu blog:
    thebelement.blogspot

  15. capas dvd de portugal disse:

    ola de novo rss
    por acaso no link das postagens mais antigas nao sabes como se sobe ou desce
    tipo para ficar mais junto acima nao sei se me entendes?

  16. .:: Clau ::. disse:

    Dani
    Quanto tempo querida! Que bom ver vc por aqui novamente. :)

  17. Das disse:

    Oi, Clau!
    Quanto tempo, hein? Saudades!
    Como você está?
    Voltei aqui, como sempre, pra 'pegar' o mapa da mina, que só você tem de uma maneira prática e fácil! rsrs
    Beijo no coração!
    Dani

  18. capas dvd de portugal disse:

    procurei e nao encontrei o que queria =(
    o codigo e assim->

    nao da para fazer algo assim do genero ->

    me ajuda pf..

  19. .:: Clau ::. disse:

    capas dvd de portugal
    Há uns dias atras eu publiquei um artigo ensinando como colocar anúncios do adsense nos posts..dá uma lida no artigo, talvez te ajude.

  20. capas dvd de portugal disse:

    obrigado pela resposta
    so mais uma coisinha aqui neste site ->ptcapas.blogspot
    da para subir ou descer, o anuncio google que esta por baixo dos posts?

  21. .:: Clau ::. disse:

    capas dvd de portugal
    Esse link são os créditos do autor que criou o script. Tente fazer contato com ele para ver se ele autoriza e retira os créditos. Somente o autor tem autoridade para isso.

  22. capas dvd de portugal disse:

    ola aqui neste site -» http://www.abu-farhan.com/2009/12/beautiful-new-page-navi-for-blogger/ consegues retirar o link que fica por baixo ?
    desde ja obrigado

  23. Lucas Hb disse:

    Clau,no template designer novo blog (o que eu uso) não encontro nenhum dos 3 trechos

  24. Willian Ferreira disse:

    Muito obrigado, estava atrás disso.
    Só preciso fazer uns ajustes.

  25. Clube da risada disse:

    Muito legal isso, vou colocar imagens no lugar dos links, pois colocar numeração nas páginas não é muito bom, usei a ferramenta de numeração e não gostei muito, acho essa padrão melhor, colocar imagens é melhor ainda, mas onde acho imagens assim? Tenho que fazer mesmo? AH, estou tendo um sério problema, não entendo, esses links de postagens mais antigas, e de numeração não estão apareçendo no blog, pq? Não tem nada abaixo. Abs!

  26. ::Clau:: disse:

    @Raí Uzumaki:
    Eu que agradeço pelo comentário e continue nos acompanhando sempre viu? 😉

  27. Raí Carvalho disse:

    Bem eu acompanho seu site a muito tempo e gostaria de te agradecer por essa grande dica viu.
    me ajudou bastante !!!

  28. Žéß?_?T disse:

    que massa em.. esse funcionou no meu blog. eu tinha usado um que nem funcionava. a maioria das coisas que eu acho no blog dos outro nao funciona. e aqui ta tudo funcionando. Vlwa ae

  29. Lizandra Melo disse:

    Agora estou seguindo seu bloguinhu!!! ^^
    :***

Desculpe, os comentários deste artigo estão desativados.

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.