Hack leia mais... Tutorial para blog.

Hack leia Mais... Clique aqui... Continue lendo... Continuação aqui.

Esse são apenas alguns exemplos dos nomes dados ao conhecido Hack Leia mais... Hoje disponibilizamos essa excelente e diria essencial ferramenta para todo blogueiro. Esse tutorial é bem simples e super eficaz pois ele pode ser utilizado tanto para textos como para imagens.

Mas o que realmente achei de prático e o verdadeiro diferencial é que ao invés de abrir nova página com o restante da postagem, ele possibilita que o leitor veja o restante das imagens ou texto na mesma página, bastanto para isso um único clique para expandir a matéria retida e um segundo clique para êscondê-la novamente.

Isso é de suma importância para os blogueiros pois quando postamos muitas imagens, usualmente fica ruim para a estética do blog expô-las todas de uma vez na homepage do blog. Assim, com o recurso desse hack você poderá adequar quantas imagens ou quanto do texto você deseja que o leitor visualize antes de clicar. Vamos ao pequeno tutorial:

O texto ou imagem que você quer que apareça antes do hack.

<div class="pre-text">

<input id="xs" value="continue lendo..." style="margin-left: 50px; padding: 0px; width: 200px; " onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ocultar'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'continue lendo...';}" type="button"> </div>

<div>

<div class="spoiler" style="display: none;">

Aqui ficará o texto e/ou imagens que você quer que apareça somente quando clicarem no botão.

</div></div>

Aqui você pode continuar com o artigo e/ou imagens, porém essa parte ficará sempre em evidência, não sendo necessário nenhum clique para vê-la.

A parte destacada poderá ser modificada conforme sua vontade. Poderá escrever: Leia mais... continue a leitura... veja mais imagens..., etc.

Prontinho, agora é só você favoritar esse artigo (CONTROL + D) e fazer uso sempre que necessário. Aqui segue o link de uma postagem onde você poderá visualizar como ficará. Clique aqui e veja.

Gostou do artigo? Então clique no botão abaixo e descubra um segredinho...

Seja VIP, receba as novidades no seu email, clique no ícone...