Como colocar o "Leia mais" personalizado no blog | Quero Dicas Quero Dicas : Como colocar o "Leia mais" personalizado no blog

Quero Dicas : Como colocar o "Leia mais" personalizado no blog

Como colocar o "Leia mais" personalizado no blog

| |


Como colocar o "Leia mais" personalizado
Esta semana, como prometido, estarei postando sobre como personalizar o botão "Leia mais" no blogger.


Na segunda-feira, fiz a postagem: Leia mais personalizado para blogger, que foi uma das maneiras super simples e de fácil de instalação.

Hoje vou mostrar como você poderá colocar sua própria imagem de maneira, também, muito fácil, deixando ainda mais bonito seu layout.

No final da postagem  deixei algumas imagens que você poderá utilizar, caso queira, claro!


  PASSO 1


A primeira coisa a ser feita é adicionar a ferramenta no blogger chamada Jump Break. Para isso:

1 - Acesse o painel do seu blogger

2 - Vá em "Layout" em "Postagens no blog" e clique em "Editar"

3 - Depois selecione quantas postagens você quer que apareça na primeira página.

Vá em "Layout" em "Postagens no blog" e clique em "Editar"

4 - Agora vá em qualquer postagem já criado ou, se preferir, crie uma e logo após o texto que quer deixar visível, clique em "Inserir expansão de postagem"

clique em "Inserir expansão de postagem"


Pronto. Agora vamos para o segundo passo.


  PASSO 2

Antes de começarmos, eu sempre recomendo fazer um backup do seu template, ao instalar qualquer tipo de implementação de códigos dentro do HTML do seu blog e claro, dê preferências ao blogs de teste! Não sabe fazer Backup? Não tem problema, clique em: Como fazer um Backup ou restauração do seu blog.

1 - Crie uma imagem  e hospede sua imagem. No próprio Blogger ou hospede na Web.

Caso prefira, você pode coletar alguma das imagens abaixo, Basta "salvar como", editar e hospedá-las ou até mesmo, colete o endereço qualquer uma delas. Para isso, clique em abrir em outra aba do seu navegador e pegue o endereço.


 
 

 
  
Todas estão em tamanho pequeno para não ocupar muito espaço


  ESTILO 1 - IMAGEM FIXA


Neste caso, vai aparecer apenas uma imagem fixa no local onde fica o link leia mais...

1 - Acesse o HTML do deu blog

2 - Procure por:

 <data:post.jumpText/>
 


3 - Ao encontrá-la, substitua por :

 <img src="URL da sua imagem"/>
 

4 - Cole o endereço da sua imagem no local indicado (URL da sua imagem), salve e Pronto!


  ESTILO 2 - EFEITO HOVER


Neste caso, vai aparecer duas imagem no local onde fica o link leia mais.

Terá que ter duas imagens. Uma que aparece em todas as postagens e a outra quando o mouse está em cima para clicar. Estilo o efeito hover. Então...

1 - Acesse o HTML do deu blog

2 - Procure por:

 <data:post.jumpText/>
 

3 - Ao encontrá-la, substitua por :

Estilo único

 <img src="URL da sua imagem"/> 

Estilo hover

 <img border='0' onmouseout='this.src='url da sua imagem''
onmouseover='this.src='url da sua imagem quando passa o mouse'
; return true' src='url da imagem'/> 


4 - Cole o endereço da sua imagem nos locais indicados, salve e Pronto!

E você, gostou?
Beijinhos



Compartilhe

* Você reservou um tempinho para comentar? *

Desde já agradeço!

Devido a falta de tempo, não prometo responder a todos os comentários. Mas farei o possível!


24 comentários:

  1. adorei muito obrigado por ajudar os(a) blogueiros <3 no meu blog ate indiquei voce e se vc puder seguir bjs
    http://universodamodinha.blogspot.com.br/2015/07/blogssites-que-podem-ajudar-fazer-seu.html#more

    ResponderExcluir
    Respostas
    1. Obrigada minha linda. Já estou seguindo seu blog =D

      Excluir
  2. MUITO OBRIAGADA , VOCÊ ME AJUDOU MUITO ! Tentando fazer isso eu tirei as postagens do meu blog sem querer por causa de um outro site ! Amei ! Super explicado !

    ResponderExcluir
    Respostas
    1. Que bom que tenha gostado Mariana, fico muito feliz =D
      Sucesso no blog!!!

      Excluir
  3. Obrigado pela boa dica. Funcionou legal.

    ResponderExcluir
  4. Olá tudo bem?
    To com um probleminha... quando eu pesquiso por , não aparece, como meu template é personalizado ele não tem isso

    o que eu faço?

    ResponderExcluir
    Respostas
    1. Olá Kaah.
      Se seu template é personalizado (retirado da Web), ainda sim, existe os códigos nele. Você só precisa achar o caminho.
      Por exemplo, insira a expansão em uma postagem e depois de publicada, ficará mais fácil.achar o caminho pelo seu navegador. =D
      Espero ter ajudado. Beijinhos ♥

      Excluir
  5. E para retirar, vc saberia dizer como faz?
    Bjs

    ResponderExcluir
    Respostas
    1. Sim, Milca
      Para que o Laia mais não apareça no seu blog veja este post:
      Ocultar elementos no blogger

      Escolha o que deseja e faça o tutorial. =D
      Beijinhos ♥

      Excluir
  6. ola eu ja fiz isso uma vez mais quando eu pesquiso no codigo html eu nao acho como eu nao estou consegindo se daquela vez eu cnsegui

    ResponderExcluir
    Respostas
    1. Desculpe Livia e Laura, não entendi o que está acontecendo. Poderia me explicar melhor para eu poder ajudar?
      Beijinhos ♥

      Excluir
  7. bom, e quando o blog não tem ?
    Exite outro formato a se procurar?

    ResponderExcluir
    Respostas
    1. Olá Cia do leitor. Caso eu tenha entendido sua pergunta: Sim, existe outras designer para o leia mais, aqui mesmo no Quero Dicas, se procurar na caixa de busca, você irá encontrar outros formatos.
      Espero que eu tenha ajudado.
      Beijinhos ♥

      Excluir
  8. Obrigada pela dica :) Eu comecei um blog agora só para me distrair, essa foi uma ótima dica :D

    ResponderExcluir
  9. Obrigado, passa no meu blog por favor..http://eusemprequissaber.blogspot.com.br/

    ResponderExcluir
  10. Obrigado, deu muito certo ;)
    http://bloggabrielaluz.blogspot.com.br/

    ResponderExcluir
  11. Adoro seu blog, me ajuda muito.
    Parabéns!

    Se quiser, de uma passadinha no meu blog
    http://eullarennia.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada Eulla por seu comentário e por gostar do Quero Dicas.
      Dei uma passadinha no seu blog, ele é uma gracinha! =D
      Beijinhos ♥

      Excluir
  12. Eu tenho que fazer o esquema de postagem por postagem?

    ResponderExcluir
    Respostas
    1. Neste caso, sim!
      Para que você tenha o leia mais automático acesse, leia e siga este tutorial: Leia Mais automático no Blogger

      Excluir
  13. Olá, gostaria de saber se tem como centralizar o botão.

    ResponderExcluir

Amigos do Blog

agenda dos blogs Universo das Dicas

Ganhe Visitantes | Inscreva-se!

GeraLinks Linkicha Atoananet Linkirado
subir