HostGator Promoção (728x60)

Como Personalizar o botão Leia Mais (Read More) do WordPress

personalizar botao leia mais wordpress

O botão Leia Mais (Read More) aparece na página de listagem dos posts, ou seja, na página inicial, de buscas e etc. Ele nada mais é do que um link que manda o visitante para outra página onde é exibido o post completo. Outro grande problema é que, muitas vezes, o texto deste link está em Inglês.

Existem também um problema de SEO, já que esses links costumam vir com um "#ready-more" depois do link. E diga-se de passagem, esse "pequeno texto" no final da url só serve para deixar a mesma esteticamente feia.

Porque Personalizar o Leia Mais

Existem muitos motivos que levam as pessoas a personalizar o botão Leia Mais, uns dos motivos principais é o fato de ele vir escrito em inglês em alguns temas do WordPress. Outro bom motivo para modificá-lo é para deixar a url dos posts mais "amigáveis", conforme dito anteriormente.

Como Personalizar o Leia Mais

Para personalizar o botão Leia Mais (ou Read More), basta adicionar o seguinte código no arquivo functions.php do seu tema:

1
2
3
4
5
add_filter('the_content_more_link', 'filter_more_link');
 
function filter_more_link( $link ) {
return ' <a class="read-more" href="'. get_permalink( get_the_ID() ) . '" title="Continue lendo '.get_the_title().'">Continue lendo '.get_the_title().'...</a>';
}
add_filter('the_content_more_link', 'filter_more_link');

function filter_more_link( $link ) {
return ' <a class="read-more" href="'. get_permalink( get_the_ID() ) . '" title="Continue lendo '.get_the_title().'">Continue lendo '.get_the_title().'...</a>';
}

Agora é só personalizar da maneira que você quiser 🙂

48 Comentários para “Como Personalizar o botão Leia Mais (Read More) do WordPress

    1. André Bento

    Cara não deu certo no meu, ja tentei tradutor de .po ja tentei ver arquivo por arquivo... e nada,... pense num read more do c.... kkkkkkk o tema que estou usando é o goodnews5

    1. Paula

    MUITO OBRIGADA!
    Eu estava há uns dias procurando uma forma de inserir uma imagem no lugar do "Continue lendo" e graças a esse truque consegui.

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Paula,

      Fico muito feliz quando vejo comentários como o seu. Ele me faz ter certeza que estou conseguindo cumprir minha missão principal, que é ajudar as pessoas repassando meus conhecimentos.

      Abraços.

        1. Paula

        Oi, Lucas!

        Que nada, eu que te agradeço! Não acho que você tenha ideia do quanto me ajudou hahahahahaha, mas saiba que se não fosse pelo seu truque, eu teria desistido e mudado de tema.

    1. Diany

    Segui as orientações e tirei meu site do ar!

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Diany,

      Conseguiu resolver o problema?

      Utilizo esse mesmo código aqui no meu site. Acredito que você tenha colado o código no meio de uma função ou algo do tipo. Para restaurar o acesso ao site, utilizando um cliente FTP ou gerenciador de arquivo da hospedagem, vá até a pasta "wp-content/themes" e renomeie a pasta do seu tema para um nome qualquer. Feito isso, o WordPress vai mudar automaticamente para o tema padrão e você vai conseguir acessar o site. Como o tema está quebrado, se você ativá-lo novamente o site vai sair do ar de novo. Você também pode remover o código que inseriu para ver se o site volta a funcionar. Caso queira, copie todo o conteúdo do arquivo functions.php e hospede em um serviço como o Google Drive, assim eu posso ver o arquivo e ajudá-la a resolver o problema.

      Para mais informações sobre como restaurar o site:
      http://wptotal.com.br/como-resolver-o-problema-da-tela-branca-wordpress/

      Abraços.

        1. Luiza

        Tentei essa solução e consegui acessar o painel, porém não posso trocar de tema, nem voltou para o tema padrão. Pode me ajudar?

          1. Lucas Tavares
          2. (Autor do Post)

          Olá Luiza,

          Desculpa, fiquei uma semana fora e não pude ler os comentários. Se o seu site ainda tiver com problemas, me avise.

    1. Sivaldo Brito

    Instalei o plugin de ajax eventes calendar e não sei como colocar ele para ficar a disposição em uma pagina. Alguém aí de boa fé pode me ajudar?

    1. Luana

    Também tentei e meu site saiu do ar. Na luta agora para voltar ;~~

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Luana,

      Se você me mandar o arquivo functions.php (que você alterou), eu vejo o que está errado. Veja as orientações que eu dei para a DIANY.

      Abraços.

        1. Luana

        Pronto Lucas,
        consegui voltar com o site com as suas dicas no comentário. Obrigada!
        Queria muito esse 'leia mais' mas não consegui. Enfim...valeu!

          1. Lucas Tavares
          2. (Autor do Post)

          Luana,

          Coloque o código acima logo depois do "<?php", pule uma linha e coloque o codigo imediatamente após essa tag. Fazendo assim dificilmente colocará ele no lugar errado.

          Qualquer dúvida estou a disposição.

          Abraços.

            1. Leonardo

            Olá Lucas. Não entendi onde devo colocar o texto do codigo. Você orientou a Luana a colocar depois do ". Que aspas seriam estas? Grato.

            1. Jorge

            Fez toda diferença esta dica. Funcionou. Muito obrigado !

    1. Bruna

    Lucas,

    Além do meu site não ser direcionado da página inicial para o Blog, não consigo alterar o "Read More" nem o "Comments".
    Segui suas orientações, mas mesmo assim não funcionou, então apaguei o código. Também alterei todos os "Read More" que encontrei, mas nada.

    Já não sei mais o que fazer. Ainda estou procurando e pesquisando. Será que consegue me ajudar?

    http://www.brunafaria.com.br/blog

    1. Bruna

    Lucas,

    Te enviei um comentário hoje com uma dúvida, mas já consegui resolver.

    Muito obrigada!

    1. francesco

    Hoje consegui mudar o read more para (leia mais) do meu blog e foi muito simples. Entrei no editor e cliquei em content-excerpt e acheia o bendito read more e modifiquei. Funcionou beleza.Abraços

      1. Douglas

      Cara, muito obrigado, me ajudou pacas ja que da forma do tutorial nao havia funcionado e do seu modo funcionou, obrigado francesco.

      1. Moni

      Francesco, obrigada.. fiz como vc.. só assim consegui.. 🙂

      1. Filip

      Valeu Francesco!!! Estava no inferno tentando mudar essa bagaça!

    1. Michel

    Opa, parabéns, estava procurando o código para modificar esse read more, muito show o artigo.Valeu Lucas.

    1. Marcelo Pio

    Lucas, parabéns! Estava a 3 dias tentando alterar a tag 'read more' e não conseguia, com sua dica consegui. Abraço!

    1. Elvis Galvone

    Salvou a pátria. Valeu pela dica!

    1. Wladimir

    Boa noite! Estou com esse mesmo problema. Com relação a dica do Francesco, é só alterar a palavra Read More, por Leia Mais? Não funcionou comigo

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Wladimir,

      Um tema pode ter vários aquivos que usam este botão (Read More). Provavelmente você tenha alterado apenas um deles, tente procurar em outros arquivos.

      Espero ter ajudado.

        1. Davi Parolin

        Olá Lucas Tavares, estou aprendendo a trabalhar no wordpress e esse READ MORE está me matando...
        Veja se consegue me ajudar...

        Já coloquei a function.php esse código

        add_filter('the_content_more_link', 'filter_more_link');

        function filter_more_link( $link ) {
        return ' Continue lendo '.get_the_title().'...';
        }

        E continua dando erro.
        vc pode me orientar
        Já fiz a tradução do tema

          1. Lucas Tavares
          2. (Autor do Post)

          Olá David,

          Aparece qual mensagem de erro?

    1. Monique

    Consegui! Muito obrigada, super últi! 🙂

    1. Luiza

    Oi, Lucas. Tudo bem? Inseri o código e o site também saiu do ar. Consegui acessar através do serviço de hospedagem, porem o tema não voltou para o padrão e também não consigo colocar nenhum tema. Ou seja, consigo acessar o site, mas ele não voltou ao ar. Pode me ajudar, por favor?

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Luiza,

      Desculpa a demora para responder seu comentário. Você já conseguiu resolver o problema?

      Se ainda não tiver resolvido me avise.

    1. Jaqueline

    Meu site também saiu do ar. Estou desesperada! Não consigo nem acessar o painel. Nada funciona.
    Aparece apenas uma tela branca com o código:

    Parse error: syntax error, unexpected '(' in /var/www/html/naoesobatom.com.br/web/wp-content/themes/kerli-lite/functions.php on line 221

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Jaqueline,

      Você precisar utilizar um cliente FTP ou gerenciador de arquivos da sua Hospedagem de Sites para acessar o arquivo functions.php do tema e remover essa alteração que esta dando erro na linha 221. Pela mensagem de erro, existe um "(" a mais no código.

      Se você não sabe onde fica o arquivo functions.php do tema, pode consultar:
      http://wptotal.com.br/melhores-praticas-editar-arquivos-do-site/#principais_arquivos

      Se não conseguir resolver me avise.

      Espero ter ajudado.

    1. Lucas Terplak

    Olá, Lucas!

    Segui suas dicas e deu certo cara, muito obrigado!

    Eu só queria mudar a cor desse "continue lendo". No meu tema ficou dourado, gostaria de colocar outra cor, pq dourado fica muito difícil de ler.

    Poderia me ajudar?

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Lucas,

      O ideal é que você mude a cor através da folha de estilos do template. Mas para alterar o arquivo style.css é necessário criar um tema filho.

      Adicione o seguinte código ao arquivo style.css:

      .read-more:link,
      .read-more:visited {
      color: #F00; /* altera cor do texto para vermelho */
      background: #000; /* altera cor de fundo para preto */
      }

      No exemplo acima eu alterei a cor do texto e a do fundo. A classe CSS do botão do exemplo é a "read-more" (ela pode variar de acordo com o tema).

      Qualquer dúvida é só perguntar.

      Espero ter ajudado.

    1. Sandro Lima

    Meu velho colei o teu código e ferrou tudo e pior que não consigo colocar o backup do código que eu fiz. HELP.

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Sandro,

      Você consegue acessar o arquivo editado (functions.php) e remover o código que foi inserido nele? Se sim, provavelmente resolva o problema.

      Há pouco tempo eu escrevi o artigo Melhores Práticas para Editar Arquivos do Seu Site. Ele pode ser útil para você.

      Espero ter ajudado.

    1. Ricardo Daniel

    Olá, instalei um template no meu blog, e veio com o botão read more, tentei traduzir, mas não exite no meu código html em modelo, não aparece em nenhuma parte do código um local escrito read more onde seja possível alterar. Então tentei retirar, mas também não funciona, o botão sai, mas o texto fica. Como eu faço?

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Daniele,

      Desculpa a demora para responder seu comentário... então, o código acima dispensa a alteração manual do botão read more. Quando ele for inserido, em tese, vai "substituir" o botão readmore.

      Provavelmente o arquivo index.php de seu tema chama a função the_content(). Se você informar algum valor como parametro (Exemplo: the_content("Leia mais...")) ele vai exibir como texto do botão readmore.

      https://developer.wordpress.org/reference/functions/the_content/

      Espero ter ajudado.

    1. Marcos

    Gratidão meu amigo, estava há dias buscando uma solução simples e eficaz como esta. Grande abraço e sucesso!

    1. Bruno César de Andrade

    Cara, tem como personalizar pra esconder o botão em publicações de categorias especificas?
    Desde já obrigado por tua ajuda

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Bruno,

      Desculpe a demora... você pode fazer algo como:

      function filter_more_link( $link ) {
      if ( is_category( 'categoria-id' ) ) {
      return '';
      } else {
      return ' <a class="read-more" href="'. get_permalink( get_the_ID() ) . '" title="Continue lendo '.get_the_title().'">Continue lendo '.get_the_title().'...</a>';
      }
      }

      Espero ter ajudado.

    1. Ronan

    Já inseri o código e não funcionou. O Read More que preciso alterar aparece na Home do meu site. Já tentei de tudo e não consegui. Vc pode me ajudar? Obrigado. Abraços

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Ronan,

      Pode ser que o desenvolvedor do tema tenha inserido o botão de uma maneira diferente, neste caso é preciso analisar o código do mesmo para ver o que pode ser feito.

    1. Lucas

    Olá, utilizo o tema The7, e não consigo alterar de jeito nenhum a opção "details" similar ao "read more", já coloquei o código no "function.php", substitui o termo "read more" citado acima por "details-more-link" como esta aqui no meu, mas mesmo assim sem sucesso, o que poderia ser? O site continua online normal, somente a opção "details" que não muda para "Leia mais" não muda. Desde já agradeço, abraço!

    1. Isabela

    Eu botei o código e aparece assim: Continue Lendo... 'Titulo do post'...

    Como eu faço para só aparecer: 'Continue Lendo...' ?

    Grata

      1. Lucas Tavares
      2. (Autor do Post)

      Olá Isabela,

      Basta remover o '.get_the_title().' do código, ficando assim:

      return ' <a class="read-more" href="'. get_permalink( get_the_ID() ) . '" title="Continue lendo '.get_the_title().'">Continue lendo...</a>';

      Espero ter ajudado.

Deixe um comentário

(required)
(required)