Tutorial - "LEIA MAIS" com imagem

Hoje separei para voçês mais um tutorial mega fácil, não tem nada que aprender, apenas seguir todos os passos e já está! Lembram-se que todas as semanas eu iria postar um tutorial? Só hoje é que me lembrei que esta semana estava em falta, mas o assunto já se está a resolver.. Ás vezes entramos em certos blogs todos organizadinhos e bonitinhos que em vez de apareçer o texto do post todo na página principal, apareçe metade do post e uma imagem com a informação: "leia mais", hoje irão aprender a colocar essa imagem!

Para começar a fazer este tutorial voçês tem que criar uma imagem, podem usar o picassa, ou outro editor que dê para fazer montagens.

Depois de criada, tem que a hospedar num site. Eu uso o photobucket, podem optar também pelo Tinypic ou pelo imageshack, em nenhum dos sites é preciso cadastrar para poder usá-lo. Carregam a imagem na menor resolução possível, ok, e copiam  o código que apareçe á frente de "direct link".

Em seguida entrem no HTML do blog (Modelo > Editar HTML). Marquem a opção "expandir modelos de widgets", apertem Ctrl+F e procurem por: 

<data:post.jumpText/>

Apague esse código, e no lugar dele coloque este:

<img src="URL-DA-SUA-IMAGEM" /> <br />

É  só colocar o link da imagem onde se pede e salvar as alterações. Senão sabem personalizar as imagens não se preocupem, para facilitar seleccionei algumas,  para usá-las, é só copiar o url da imagem, clique na imagem com o botão direito do rato escolha "Copiar endereço da imagem", ele não abrirá nenhuma janela com o url, atenção, o url fica logo copiado só têm que colar no código que vos falei em cima.
Senão conseguirem, o código peçam-me que mando por e-mail.
O que acharam?

Se usarem não se esqueçam de comentar para depois lá ir ver,  se acharam útil comentem também, se existir alguma dúvida poderão colocá-la aqui ou no facebook do blog.
Bom fim-de-semana!