- Inscrever-se no RSS Feed
- Marcar tópico como novo
- Marcar tópico como lido
- Flutuar este Tópico do usuário atual
- Favorito
- Inscrever-se
- Emudecer
- Página amigável para impressora
Personalize o botão Leia mais no seu blog
2 semanas atrás - editado pela última vez 2 semanas atrás
Alterar a aparência do botão Leia mais na página de listagem do blog pode ser muito útil se quiser que esse botão se destaque. Saiba como personalizar o design do botão ou editar o texto Leia mais .
Personalize a aparência do botão Leia mais
Para personalizar a aparência do seu botão Leia mais, crie uma classe CSS que manterá o estilo do botão. Adicione essa classe e qualquer estilo personalizado em sua folha de estilo. Veja alguns exemplos de estilos:
.read-more-btn{ background: blue; border-radius: 10px; color: white; }
Para adicionar uma classe personalizada ao botão Leia mais:
- Acesse o modelo do seu blog.
- Clique no módulo de conteúdo do blog para selecioná-lo no inspetor e, na seção Modelos de post, clique em Editar modelo de listagem para acessar a página de listagem HTML.
- Localize o seguinte código no modelo de listagem HTML:
<a class="more-link" href="{{content.absolute_url}}">Leia mais</a
- Substitua a classe
more-link
pela sua nova classeread-more-btn
. O código deve ser semelhante a este:
<a class="read-more-btn" href="{{content.absolute_url}}">Leia mais</a>
- Clique em Publicar alterações.
Edite o texto do botão Leia mais
Na página de listagem do seu blog, você verá uma visualização de cada post com um link Leia mais que abre o post completo. Para alterar o texto Leia mais para outro idioma ou frase, você precisará editar o modelo do seu blog.
- Na sua conta da HubSpot, navegue até Marketing > Arquivos e modelos > Ferramentas de design.
- No finder, clique no nome do modelo de blog.
- No modelo, clique no módulo de conteúdo do blog . No inspetor, na guia Editar, clique em Editar modelo de listagem.
- Procure o seguinte código próximo da linha 55:
<a class="more-link" href="{{ content.absolute_url }}">Leia mais</a>
- Edite Leia mais para personalizar esse texto em cada visualização de post na página de listagem do blog.
- Clique em Publicar alterações.
- Marcar como novo
- Favorito
- Inscrever-se
- Emudecer
- Inscrever-se no RSS Feed
- Realçar
- Imprimir
- Enviar e-mail a um amigo
- Relatar conteúdo como inapropriado