Published by admin on 19 de fevereiro de 2014

Inserir uma assinatura de e-mail com imagem html no Webmail

Oi pessoal!

Vou passar um passo a passo de como incluir uma assinatura de e-mail com imagem para que vocês não tenham grandes problemas na hora de configurar.

Quem mexe com desenvolvimento web e outras áreas da internet sabe bem que uma imagem para aparecer em uma página deve estar hospedada em algum lugar na internet, ou seja, em um servidor. Não tem jeito, ela não pode ficar “voando” por aí, deve estar em algum lugar. Neste passo a passo vou te ensinar a incluir uma assinatura de e-mail com imagem em html em seu Webmail, para que você mesmo possa fazer o trabalho, sem que ninguém mais precise acessar o seu e-mail para fazer o serviço pra você.

Em primeiro lugar, a pegadinha: o maior erro que podemos fazer ao incluir uma assinatura é copiar uma imagem (copy -> paste) e colar no campo das configurações da assinatura. Como a imagem está em SEU computador, a assinatura vai aparecer ali pra você bonitinha, mas engana-se quem pensa que será assim para todos. Como eu disse antes, ela está em seu computador e você não a hospedou em nenhum servidor da internet – ainda. Como ela poderia aparecer para os outros? Vamos ao passo a passo e você saberá!

Passo 1) Já com a arte da assinatura pronta (em JPEG, PNG, GIF…), você deve procurar um Host de imagem gratuito, tem vários pela internet mas um que eu costumo usar quando preciso é o ImageShack. É grátis e relativamente confiável. Digo isso porque você deve pensar que se por acaso aquele servidor sair do ar, ou simplesmente fechar, sua imagem vai parar de aparecer na assinatura do e-mail (se isso acontecer não é nenhuma tragédia, é só procurar outro host e reinserir a assinatura).

 

Passo 2) Crie um cadastro grátis no ImageShack ou host de preferência

ScreenHunter_351 Feb. 19 17.51

 

 

Passo 3) Clique em upload, e busque a imagem da sua assinatura em seu computador

img4984

 

 

Passo 4) Quando o upload estiver concluído, sua imagem vai aparecer como “uploadada”. Pelo ImageShack, você deve clicar no ícone sobre a imagem para ver mais, e abrirá um menu (veja imagem abaixo)

img498483

 

Passo 5) Onde está escrito DIRECT neste menu, há um link ao lado que você pode copiar. Copie e cole em um bloco de notas.

 

Passo 6) No bloco de notas, copie este código HTML abaixo, lembrando de substituir o que está em negrito pelo link DIRECT no lugar:

<img src=”coleOlinkDIRECTaqui” />

ScreenHunter_351 Feb. 19 18.01

 

 

Passo 7) Sua assinatura já está pronta para ser incluída no Webmail. Acesse o seu Webmail, e vá em Configurações.

 

Passo 8) Na barra à esquerda, clique em IDENTIDADES (em outro e-mail que não seja Webmail deve ser algo parecido…)

 

Passo 9) Na tela que aparecer, clique em seu nome

 

Passo 10) Vai mostrar as configurações prévias da sua assinatura, você pode trocar o seu nome como aparece para outras pessoas ou definir algum e-mail que queira enviar cópias dos e-mails recebidos.

Abaixo, terá o campo para escrever sua assinatura.

 

Passo 11) Neste campo, clique onde você ver o ícone HTML (fica bem pequenininho à direita, ao lado da caixa de cor). Vai abrir uma tela pop up com o Editor HTML.

img484

 

ScreenHunter_351 Feb. 19 18.04

 

Passo 12) Vá ao bloco de notas, copie o código que você colou lá anteriormente, e agora cole-0 no Editor HTML. Se tiver dúvida, é esse aqui -> <img src=”coleOlinkDIRECTaqui” />  

ScreenHunter_351 Feb. 19 18.07

Passo 13) Dê um ok ou atualizar, e a tela pop up vai fechar. Se o código estiver escrito corretamente e o link da imagem estiver funcionando, aparecerá a imagem de sua assinatura no campo dela, e estará tudo ótimo. Porém, caso a imagem não apareça, verifique se o código html está correto, se você não esqueceu nenhuma letra ou as aspas ” ” entre o link. Se tiver, é só alterar no Editor HTML e o problema estará resolvido.

Depois pode fazer um teste, clique para enviar um e-mail e confirme se a assinatura aparece mesmo.

Importante: nas configurações do seu e-mail é essencial que esteja marcado para enviar e receber e-mails em HTML, caso contrário o e-mail mostrará apenas texto e sua assinatura não vai aparecer nem pra você nem pra outras pessoas. 

Espero que tenha sido útil pra vocês!

Qualquer dúvida é só comentar aqui…

Até mais!

 

Share on Facebook0Tweet about this on Twitter0Pin on Pinterest0Share on Google+0Share on LinkedIn0Share on TumblrEmail this to someone
#assinatura#e-mail#gratis#host imagem#html#imageshack