AKNA SOFTWARE. NOVO EDITOR Drag and Drop

Transcrição

1 AKNA SOFTWARE NOVO EDITOR Drag and Drop

2 Novo Editor Para criar uma nova mensagem utilizando o AKNA Novo Editor, clique em Menu e depois em Mensagens cadastradas (novo). Clique em Temático para iniciar a criação de um novo conteúdo. Serão exibidos os templates oferecidos pela AKNA para seleção. Clique sobre o template desejado. Observação: os templates são totalmente gratuitos e a AKNA, de forma recorrente, disponibilizará novos modelos para você. Será exibida a tela abaixo. Do lado esquerdo encontram-se opções de componentes a serem inseridos (1), de forma totalmente opcional, no template apresentado do lado direito (2). 2

3 2 1 TRABALHANDO COM O AKNA NOVO EDITOR - NOME DA MENSAGEM Antes de editar o template, preencha o campo Nome da mensagem com o nome que a mensagem será identificada na Plataforma AKNA Marketing. Importante: o Nome da mensagem não é o assunto do . Clique sobre o campo Nome da mensagem para preenche-lo. - COMPONENTES Pode-se realizar edições no template selecionado com os componentes apresentados abaixo. Para isto, pressione o componente desejado com o botão direito do mouse e o arraste até o bloco desejado

4 Importante: antes de aprender a função de cada componente, é essencial ter a ciência de que a cada bloco possui as opções: Arraste o bloco Edite o bloco Duplique o bloco Exclua o bloco 1. Texto Insere-se um texto no bloco em que o componente foi arrastado. Utilize o campo esquerdo em destaque para desenvolver o texto. Formate o seu texto com as funcionalidades oferecidas na barra de ferramentas, como as principais descritas abaixo: Opção de formatação do texto para negrito, itálico, sublinhado ou remoção da formatação. Inserção de imagem. A imagem para ser inserida em uma mensagem precisa estar hospedada em um servidor, podendo ser o seu servidor ou o da AKNA. Para inserir uma imagem já hospedada no seu servidor, siga os passos a seguir: Clique no ícone Imagem. Na sequência, preencha o campo URL com o caminho da hospedagem da imagem e clique em OK. 4

5 Caso queira hospedar ou localizar uma imagem no servidor da AKNA, ressaltando que não tem nenhum custo, siga os passos a seguir: Clique também no ícone Imagem, mas ao invés de preencher o campor URL, clique em Localizar no Servidor para localizar a imagem e hospedá-la no servidor. Ao clicar sobre o ícone das pastas em destaque, tem-se acesso às subpastas da pasta Templates, as quais contemplam as imagens oferecidas gratuitamente pela AKNA, bem como as pastas e imagens compartilhadas pelos usuários de sua conta em Arquivos compartilhados e as subpastas e imagens hospedadas por você na pasta Imagens. 5

6 Para criar as suas subpastas e hospedar suas respectivas imagens, clique com o botão direito do mouse sobre a pasta Imagens, selecione a opção Nova sub-pasta (destacar), nomeie-a (destacar) e clique em OK. Ao clicar com o botão direito do mouse sobre uma subpasta já criada, pode-se criar uma nova subpasta, renomea-la e / ou apaga-la. Observação: se a sua subpasta contiver imagens, ao clicar sobre a opção Downloads as zip, faz-se download de todas as imagens de forma compactada em arquivo.zip. Clique em Enviar arquivo para localizar as imagens que serão hospedadas. Observação: além de hospedar a imagem clicando em Enviar arquivo, pode-se clicar em Atualizar para verificar se houve atualização nas imagens hospedadas, em Maximizar para aumentar a tela de visualização dos arquivos e em Configurações para definir o modo de visualização das imagens, bem como as informações a serem exibidas e o modo de ordenar as imagens. 6

7 Selecione o arquivo desejado e clique em Abrir para enviá-lo ao servidor. Dica: pressione a tecla shift do teclado e com o mouse clique em mais de uma imagem para realizar a hospedagem de várias imagens de uma única vez. Depois de enviada a imagem ao servidor, dê um duplo clique sobre ela para utilizá-la no bloco de texto da mensagem. Será exibida a tela Formatar Figura com uma breve visualização da imagem já com a inclusão de texto, ora como ficará no bloco de texto, bem como o caminho de hospedagem do arquivo e informações básicas sobre a imagem. Clique em OK para inserir a imagem já hospedada em seu bloco de texto. 7

8 Inserção de uma linha horizontal no bloco de texto. Segue abaixo o exemplo: Inserção ou edição de um hiperlink inserido em uma palavra e / ou imagem. Para inserir um hiperlink, selecione uma palavra e / ou imagem e clique no ícone, preencha o campo em destaque com o endereço da página da web que o contato deve ser direcionado ao clicar sobre a palavra e / ou imagem que encontra-se com o hiperlink. Para confirmar, clique em OK. Remoção de um hiperlink. Para remover um hiperlink inserido em uma palavra e / ou imagem, selecione o conteúdo e clique sobre o ícone. Verifica-se o código HTML do conteúdo e, se necessário, permite a realização de alguma alteração. Para retornar, clique novamente sobre o botão Código-Fonte. 8

9 Cola-se um texto sem formatação no bloco de texto, não sendo necessário digitálo. Para isto, clique no ícone e depois será exibida a janela abaixo, a qual deve ter preenchido o campo em destaque com o texto desejado. Conclua o preenchimento clicando em OK. Cola-se um texto do word no bloco de texto, não sendo necessário digitá-lo. Para isto, clique no ícone e depois será exibida a janela abaixo, a qual deve ter preenchido o campo em destaque com o texto desejado. Conclua o preenchimento clicando em OK. 9

10 Opções para desfazer e refazer. Quando este ícone encontra-se selecionado, realiza a correção ortográfica e a verificação da ortografia. Observe a diferença do ícone quando não selecionado e selecionado: Não selecionado Para retornar e visualizar os outros componentes, clique em Conteúdo. 2. Linha horizontal Insere-se uma linha horizontal entre os blocos em que o componente foi arrastado. Utilize o campo esquerdo em destaque para formatar a referida linha. Pode-se definir o estilo da borda utilizando o select Estilo da borda : A B C D E F G 10

11 A. Solid B. Dashed C. Dotted D. Double E. Groove F. Inset G. Outset Caso queira alterar a cor da linha horizontal, clique sobre o ícone em destaque e, com o botão esquerdo do mouse sobre as tonalidades, selecione a cor desejada. Para fechar a janela com as opções de cores, clique sobre o ícone. E ainda pode-se definir a espessura da linha horizontal, bem como do Padding-top e Padding-bottom preenchendo seus respectivos campos. Observação: os valores a serem inseridos nos campos Espessura, Padding-top e Padding-bottom são medidos em pixel. Para retornar e visualizar os outros componentes, clique em Conteúdo. 11

12 3. Botão Insere-se um botão no bloco em que o componente foi arrastado. Utilize as opções abaixo para formatar o botão inserido. Insira um texto para identificar o botão na mensagem. Selecione o destino do link que será inserido no botão, podendo ser: Endereço da Web (URL) ou Endereço de . Se selecionado o destino do link como Endereço da Web (URL), o campo a ser preenchido fica denominado como Endereço da Web (URL). Preencha-o com a URL da página da web que o contato será direcionado ao clicar no botão. Já se selecionado o destino do link como Endereço de , o campo será denominado como Endereço de . Preencha-o com o endereço de que o contato, ao clicar no botão, será direcionado para enviar uma mensagem. No mais, preencha o Assunto e a Mensagem do . 12

13 Selecione a cor de fundo do botão clicando sobre o ícone em destaque. Altere a cor do texto do botão clicando sobre o ícone em destaque. Defina o tamanho da fonte do texto do botão preenchendo o campo em destaque. Lembre-se: o valor a ser inserido no campo Tamanho da fonte é medido em pixel. Altere a cor da borda do botão clicando sobre o ícone em destaque. Defina a Border-radius preenchendo o campo em destaque. Lembre-se: o valor a ser inserido no campo Border-radius é medido em pixel. Veja o antes e depois de um botão com a Border-radius. Antes Depois 13

14 Defina o Padding-horizontal e o Padding-vertical preenchendo seus respectivos campos. Lembre-se: os valores a serem inseridos nos campos Paddinghorizontal e Padding-vertical são medidos em pixel. Defina a Margin-top e a Margin-bottom preenchendo seus respectivos campos. Lembre-se: os valores a serem inseridos nos campos Padding-horizontal e Padding-vertical são medidos em pixel. Para retornar e visualizar os outros componentes, clique em Conteúdo. 4. Imagem Insere-se uma imagem entre os blocos em que o componente foi arrastado. Clique no botão Procurar localizado no campo esquerdo para localizar e / ou incluir a imagem desejada. Pode-se utilizar uma imagem já armazenada em uma das pastas ou criar uma nova subpasta para hospedar novas imagens. Para utilizar uma imagem de uma pasta já criada, clique sobre a pasta e dê um duplo clique sobre a imagem desejada. Lembre-se: Na pasta Templates ficam as subpastas com as imagens oferecidas gratuitamente pela AKNA; 14

15 Na pasta Arquivos compartilhados ficam as subpastas com as imagens compartilhadas pelos usuários da sua conta; e Na pasta Imagens ficam as subpastas criadas por você com as suas imagens. Já para criar uma nova subpasta para hospedar novas imagens, clique com o botão direito do mouse sobre a pasta Imagens e depois selecione Nova subpasta. Observação: pode-se, também, criar uma nova subpasta em Arquivos compartilhados para compartilhar as imagens a serem inseridas com os usuários de sua conta. Depois de clicar em Nova sub-pasta, nomeie-a e clique em OK. Ao clicar com o botão direito do mouse sobre uma subpasta já criada, pode-se criar uma nova subpasta, renomea-la e / ou apaga-la. Observação: se a sua subpasta contiver imagens, ao clicar sobre a opção Downloads as zip, faz-se download de todas as imagens de forma compactada em arquivo.zip. 15

16 Clique em Enviar arquivo para localizar as imagens que serão hospedadas. Observação: além de hospedar a imagem clicando em Enviar arquivo, pode-se clicar em Atualizar para verificar se houve atualização nas imagens hospedadas, em Maximizar para aumentar a tela de visualização dos arquivos e em Configurações para definir o modo de visualização das imagens, bem como as informações a serem exibidas e o modo de ordenar as imagens. Selecione o arquivo desejado e clique em Abrir para enviá-lo ao servidor. Dica: pressione a tecla shift do teclado e com o mouse clique em mais de uma imagem para realizar a hospedagem de várias imagens de uma única vez. 16

17 Depois de enviada a imagem ao servidor, dê um duplo clique sobre ela para utilizá-la. A imagem será incluída no bloco de imagem e pode-se substituí-la clicando sobre a opção substituir localizado na parte esquerda em destaque. Pode-se incluir na imagem inserida um texto alternativo e / ou um link e, ainda, definir um alinhamento: Texto alternativo: clique sobre Texto ALT e preencha o campo com o texto alternativo que será exibido no caso do contato não conseguir visualizar a imagem. Link Clique sobre Link e defina entre as opções sem link para não utilizar nenhum hiperlink sobre a imagem inserida; Endereço na Web (URL) para utilizar um hiperlink direcionado a uma página da web; ou Endereço de para que o contato, ao clicar sobre o link, seja direcionado para o envio de uma mensagem. Se selecionado Endereço na Web (URL), preencha o campo em destaque com a URL da página web que o contato será direcionado ao clicar sobre a imagem. 17

18 Se selecionado Endereço de , preencha o campo em destaque com o endereço de que o contato, ao clicar na imagem, será direcionado para enviar uma mensagem. No mais, preencha o Assunto e a Mensagem do . Alinhamento: clique sobre Alinhamento e defina a posição da imagem junto a mensagem, sendo a esquerda, no centro ou a direita. Para retornar e visualizar os outros componentes, clique em Conteúdo. 5. Grupo de imagens Em Grupo de imagens pode-se inserir duas imagens entre os blocos em que o componente foi arrastado. Para aprender a incluir as imagens, siga o passo-a-passo do componente Imagens. 18

19 Para retornar e visualizar os outros componentes, clique em Conteúdo. 6. Imagem com legenda Em Imagem com legenda insere-se uma imagem e, abaixo dela, coloca-se um texto explicativo acerca da imagem inserida. Para aprender a incluir / editar a imagem, siga o passo-a-passo do componente Imagens e para aprender a inserir / editar um texto, siga a explicação do componente Texto. 7. Imagem com texto Em Imagem com texto insere-se uma imagem e, do lado esquerdo dela, um texto. Para aprender a incluir / editar a imagem, siga o passo-a-passo do componente Imagens e para aprender a inserir / editar um texto, siga a explicação do componente Texto. 19

20 Finalizado o uso dos componentes, tem-se ainda mais funcionalidades para edição de sua mensagem. Para isto, clique em Configurações Em Configurações, temos: 1. Pode-se alterar o idioma dos textos predefinidos da mensagem clicando sobre o ícone em destaque. Os idiomas disponíveis para seleção são: português, inglês, espanhol e italiano. Escolha a Área de Interesse da mensagem clicando no ícone em destaque. Importante: caso não tenha uma área de interesse cadastrada, este select estará indisponível. Em Cor de fundo altere a cor de fundo do e em Cor de fundo ( ) altere a cor de fundo dos blocos. Para realizar as alterações, clique em seus respectivos ícones em destaque. 20

21 Altere a cor do texto clicando sobre o ícone em destaque. Altere a cor do link, quando uma palavra contiver hiperlink, clicando no ícone em destaque. Altere o tipo e tamanho da fonte clicando em seus respectivos ícones, ora em destaque. Defina o espaçamento entre os blocos. Lembre-se: o valor a ser inserido é medido em pixel. 2. Preheader Caso queira, pode-se inserir o preheader do seu no campo em destaque. 3. Textos Alternativos Em Textos Alternativos deve-se selecionar quais links adicionais estarão em sua 21

22 mensagem, com exceção do link de Pedido de remoção que, devido as boas práticas, já estará incluso. Os links são: Visualização Alternativa : caso haja algum problema para visualizar a mensagem, pode-se acessá-la por meio do link de visualização alternativa que estará no cabeçalho da mensagem. Ao clicar, será aberta uma nova janela na web com o conteúdo da mensagem; Pedido de remoção : ao clicar sobre este link, o contato se tornará opt-out (sairá da lista de contatos); Encaminhamento : ao clicar sobre este link, o contato encaminhará a mensagem a um amigo ; Atualização de Cadastro : ao clicar sobre este link, o contato poderá atualizar os dados cadastrais; e Redes Sociais : seleciona-se, por meio do checkbox, as redes sociais que terão o seu logo no rodapé do para que, ao clicar, o contato compartilhe a mensagem em sua rede social. 22

23 4. Links Em Links tem-se a a possibilidade de integrar a Plataforma AKNA Marketing com dois serviços de monitoramento de sites: Google Analytics: fornece métricas de acesso das páginas em que monitora. Este serviço pertence ao Google e é gratuito; e Web Analytics: fornece métricas de acesso das páginas em que monitora e o endereço de de quem acessou. Este serviço foi desenvolvido pela AKNA e é contratado separadamente ao AKNA Marketing. Para realizar a integração, selecione o checkbox Rastrear links e depois selecione um ou os dois serviços de monitoramento para que seja realizada a integração. Também, serão apresentados todos os links da sua mensagem e abaixo de cada link tem-se o campo Título (1), utilizado para nomear o link para, posteriormente, facilitar a interpretação da estatística Links. Caso opte por não preencher o campo Título, a Plataforma o preencherá automaticamente com Sem título 1 porque não se pode concluir a criação da mensagem com este campo vazio. Observação: a numeração da nomenclatura Sem título varia de acordo com a quantidade links, ou seja, se dois links estiverem com o campo Título vazio, a Plataforma preencherá o campo Título do primeiro link com Sem título 1 e do segundo, Sem título 2. Dica: uma vez preenchido o campo Título de determinado link, quando utilizado novamente em uma mensagem, o link terá seu Título já preenchido, pois a Plataforma armazena a informação inserida anteriormente. Pode-se também, de forma opcional, inserir o Grupo (2) que o link pertence

24 5. Compartilhamento Pode-se atribuir a mensagem para um usuário ou compartilhar com outras equipes. Observações: a mensagem pode ser alterada quando atribuída devido ter sido dado total controle sobre ela a outro usuário, mas apenas visualizada quando compartilhada. Se algum usuário já possuir permissão para alterar mensagens de outros proprietários, a atribuição não terá efeito. Para atribuir a mensagem, selecione a Equipe e Usuário que receberá tal atribuição. Já para compartilhar, pode-se selecionar os usuários da equipe em que faz parte, de outras equipes e / ou usuários externos. 6. Arquivos Pode-se inserir arquivos anexos na mensagem, mas não é indicado pelas boas práticas porque pode prejudicar a entregabilidade dos s. Dica: opte por hospedar os anexos em um servidor e utilizar o hiperlink para que o contato possa ter acesso aos arquivos. 24

25 Para finalizar a criação da mensagem, verifique os ícones. Clicando sobre o ícone tem-se a visualização da mensagem em um acesso por desktop, bem como por mobile, lembrando que o Novo Editor da AKNA possui todos os templates com HTML responsivo. Já ao clicar sobre o ícone tem-se a Verificação Antispam, a qual apresenta as características spam da sua mensagem que podem reduzir a taxa de entrega do . A barra em destaque é preenchida de acordo com as descrições das características spam (1). Para fechar a janela de Verificação Antispam, clique no botão Fechar. 1 Clique em Salvar no canto direito inferior da página para concluir a criação da mensagem. 25

26 - MENSAGENS A mensagem criada ficará em Mensagens e você terá acesso ao nome da mensagem na coluna Mensagem (1), a data de sua criação na coluna Criada (2) e ao usuário que a criou na coluna Usuário (3). Nesta tela, pode-se ainda pesquisar uma mensagem preenchendo o campo Pesquisar e depois clicando no ícone. Ao clicar sobre o ícone pode-se optar por selecionar Todos as mensagens ou Nenhum mensagem para depois excluir por meio do ícone. Também pode-se selecionar uma mensagem específica por meio do seu respectivo dropbox e a partir daí editá-la clicando no botão Editar, além de explorar outras funções apresentadas no select Editar : Visualizar: tem-se a visualização da mensagem em um acesso por desktop, bem como por mobile; Duplicar: duplica-se a mensagem criada para desenvolver uma nova, sendo necessário apenas lhe conceder um novo nome; 26

27 Enviar Teste: o teste da mensagem verifica apenas o layout do . Para realizá-lo, preencha o campo (1) em destaque com os endereços de s que receberão o teste, podendo separa-los por vírgula (,) ou ponto e vírgula (;). Para concluir o envio do teste clique em Enviar. Importante: os últimos dez endereços de que foram utilizados para o teste da mensagem ficam armazenados no campo (2) em destaque e você pode utilizá-los para um novo envio sem ter a necessidade de digita-los novamente, apenas selecionando o respectivo checkbox do contato; e 1 2 Excluir: exclui a mensagem selecionada. 27

28 A AKNA é uma empresa diferenciada com especialização no desenvolvimento de soluções digitais de alta tecnologia. O compromisso de oferecer sempre a melhor solução faz com que sua trajetória seja marcada por muitas conquistas. Com grande experiência no mercado digital, a AKNA compartilha seu conhecimento e oferece soluções para mais de duas mil empresas, no Brasil e na América Latina, com o objetivo de potencializar seus resultados constantemente. Contate-nos: marketing@akna.com (11) /blog facebook.com.br twitter.com linkedin.com/company/akna A distribuição é gratuita e não pode ser utilizado para fins comerciais. O material não permite modificações e seu compartilhamento é livre, desde que a fonte seja mencionada. 28

29