Olá anjos!
Estava olhando meus posts em rascunho e notei que tenho muitos aqui que estão atrasados, já deveriam ter sido postados há tempos, mas por algum motivo que não sei eles ficaram parados aqui. Inclusive alguns pedidos que recebi no meu primeiro Tumblr. Enfim, vou postar esses tutoriais até o dia 31. Isso quer dizer que teremos vários posts por dia.
Hoje vou trazer o tutorial do Leia Mais em hover. Diferente dos "leia mais" que a gente conhece, esse é em hover com imagens. O tutorial é do blog Jackie Dream, e estou repassando.
Vá no HTML do seu blog, marque a opção ''expandir modelos de widgets''. Depois disso aperte CTRL+F e procure por:
<data:post.jumpText/>Apague todo esse código, e no lugar coloque:
<img border='0' onmouseout='this.src='url da imagem principal'' onmouseover='this.src='url da imagem com o mouse em cima'; return true' src='url da imagem principal'/>
Entenda o código:
Nos trechos url da imagem principal apague e cole a url da imagem que irá aparecer sem o mouse estar em cima.
No trecho url da imagem com o mouse em cima apague e cole a url da imagem que irá aparecer com o mouse em cima. O nome já diz tudo né?
A Jackie fez algumas imagens que eu achei muito fofas! Veja só:
<img border='0' onmouseout='this.src='http://i.imgur.com/uErwS.png'' onmouseover='this.src='http://i.imgur.com/8G7q6.png'; return true' src='http://i.imgur.com/uErwS.png'/>
<img border='0' onmouseout='this.src='http://i.imgur.com/oQTJO.png'' onmouseover='this.src='http://i.imgur.com/DEsev.gif'; return true' src='http://i.imgur.com/oQTJO.png'/>
<img border='0' onmouseout='this.src='http://i.imgur.com/eWFP8.png'' onmouseover='this.src='http://i.imgur.com/FHNfD.png'; return true' src='http://i.imgur.com/eWFP8.png'/>
Meus querides! Caso vocês gostem desse blog e queiram continuar me acompanhando, eu ainda escrevo, mas em outro blog. Não posto apenas tutoriais, mas continuo escrevendo e falando de vários assuntos, inclusive a blogosfera. Caso queira visitar (sério ótimo uma visita): clique aqui para ir ao blog Serenar
O meu Leia Mais já tá personalizado então nem vou mexer nele D: Mas é um ótimo turo
ResponderExcluirNeoreul Saranghae
É sim ^^
ExcluirGostei! Obrigada.
ResponderExcluirbeijodecereja.tk
beijo-de-cereja.blogspot.com
Obrigada pelo tuto! Amei
ResponderExcluirminhas-confissoes-2012.blogspot.com
Eu fiz, mas não está dando certo alternar as imagens, quando se passa o mouse. Também não estou conseguindo retirar uma descrição que aparece quando o mouse fica em cima da imagem, pois fica aparecendo a palavra teste.
ResponderExcluirOi Alice!
ExcluirQual o link do seu blog? Talvez se eu ver possa te ajudar a resolver o problema.
Você tentou usar algum modelo como exemplo? Pode dar certo ^^
Marina!! Que fofa você!!!
ExcluirEntão, eu estou na verdade criando um novo layout pro meu blog Tromba. Daí esse link é do blog teste. Como você pode averiguar, quando se passa o mouse em cima da imagem "leia mais" aparece a palavra "teste". Também não consegui alternar as imagens. Fiquei um pouco triste, porque de todos os "Leia Mais" esse do seu blog foi o mais bonito que encontrei.
Olha, o teste que aparece eu já entendi. Quando você passa o mouse em cima do leia mais, o nome da postagem aparece, e como o nome do post é teste, aí aparece isso.
ExcluirAcho que sei porque a imagem não está mudando, você fez o upload delas de novo não fez? Repare que no código do seu blog, tem um ponto e vírgula (;) depois do link delas, acho que é por isso que não está dando certo. Tenta tirar os pontos e vírgulas depois do link e ver se dá certo.
Depois me fala se deu ou não ^^
Ahhhhh, sua linda!! Deu certinho. Depois vai lá pra você ver! Achei que ficou lindo! Queria muitíssimo agradecer por sua gentileza, educação e presteza. Sempre que eu mudo de layout, eu falo do novo modelo e cito o blog que eu retirei o html. Pode estar certa que citarei o seu e a ajuda que me deu. Estou participando do seu blog também, para acompanhar os novos tutoriais. Obrigada mesmo!!! Deus abençoe você! :)
ExcluirFicou lindo mesmo! Vou acompanhar seu blog e assim que tiver tempo comento nas postagens, está meio tarde agora haha'
ExcluirSempre que precisar eu estou aqui ;)
Obrigada amore, estava tentando fazer isso a um tempão mas nunca conseguia, sua explicação foi simples e eficiente muito obrigada viu, um grande beijo e até mais.
ResponderExcluir