Como inserir imagens no template dos e-mails da minha loja - Signashop

Nesse tutorial será explicado como inserir imagens nos e-mails de sua loja modificando os templates deles. Também sendo possível atribuir um link a essas imagens, então quando o cliente clicar sobre ela, será redirecionado para a página que você determinou.

1 - Inserindo imagem no banco de imagens da loja

1.1 - Primeiro é necessário fazer o upload da imagem para o banco de imagens da loja, para isso, esse processo pode ser feito por meio da inserção por um bloco estático.

1.2 - Para isso siga pelo caminho: CMS> Conteúdo e Layout> Bloco Estático, conforme print a seguir:

1.3 - Acessando a página de blocos estáticos, clique em “Criar Bloco”, após é necessário preencher os campos, conforme descrito a seguir:

1.4 - No campo de "Título", preencha com uma descrição curta da Imagem, por exemplo: “Imagem de agradecimento e-mail de novo pedido”.

1.5- No campo “Identificador”, preencha com uma palavra ou algo que facilite na identificação e usabilidade do bloco estático, por exemplo: “Imagem”.

1.5.1 - Evite colocar espaços e símbolos neste campo.

1.6 - Após em “Conteúdo”, clicar no ícone de “Inserir Imagem”. Após abrir uma nova janela, na linha do campo “Imagem URL”, deves clicar no ícone disponível, dessa forma abrirá uma outra página para buscares a imagem desejada no computador, quando encontrares a imagem desejada, deves clicar na imagem e em Inserir Arquivo.

 1.6 - Após clicar em inserir arquivo, o campo de URL da imagem será preenchido, após deve-se clicar em “Insert”, após clique em Salvar.

1.7 - Feito todo esse processo, a informação que será utilizada para anexar no e-mail transacional, será o código dessa imagem. Para acesso a esse html, ainda no bloco estático clique em “Exibir/Esconder Editor de Texto”.

1.8 - Após visualizar o código o copie e siga para o passo do item 2.

1.9 - Segue gif de todo o processo a seguir:

2 - Inserindo Código da imagem no template do E-mail Transacional

2.1 - Para a imagem no template do E-mail, deve-se copiar o código da imagem gerado no processo do item 1.

2.2 - Após deve-se seguir pelo caminho: Sistema> E-mails de Transação> Selecionar o E-mail desejado, conforme print a seguir:

2.3 - Ao acessar o e-mail transacional desejado, em “Conteúdo do e-mail” você vai inserir o código que copiou do bloco estático.

2.4 - Para que a imagem fique logo abaixo da última frase do seu e-mail, cole o código na linha inferior a última frase em Conteúdo do e-mail e após clique em “Salvar”, conforme gif abaixo:

2.5 - Após esta alteração o cliente irá receber o e-mail transacional, como no exemplo de novo pedido conforme imagem abaixo:

 

3 - Inserindo link de redirecionamento na imagem inserida no e-mail transacional.

3.1 - Para inserir um link de redirecionamento na imagem inserida no e-mail transacional, deve-se acessar o bloco estático da imagem pelo caminho CMS> Conteúdo & Layout >  Blocos Estáticos> Selecionar Bloco da Imagem em questão.

3.2 - Dentro do bloco estático em questão, clique em cima da imagem e depois no ícone da ''corrente''.

3.3 - Depois disso, clique em Exibir/Esconder editor de texto. Um código como esse vai aparecer.

3.4 - Após copie o código inteiro e salve o bloco estático:

3.5 - É possível observar que neste novo código, haverá a informação da url da imagem e também o link de redirecionamento, utilize este código ao invés do demonstrado no item 2, caso queiras que a imagem direcione para uma página específica da loja.

3.6 - Quando o lojista inserir o link de redirecionamento ao cliente clicar na imagem disponível no e-mail recebido será direcionado para a página.

4 - Limpeza de índices e Caches:

4.1 - Após realizar os passos acima, será necessário realizar uma Reindexação e uma Liberação de Caches. Para fazer estes passos, basta clicar aqui para acessar o tutorial de reindexação e liberação de caches.



Dúvidas ou dificuldades em executar o processo? Entre em contato com o suporte! Será um prazer atender você :)