Gostaria de aumentar o envolvimento do cliente com notificações de e-mail personalizadas para o seu site WordPress? Com apenas alguns passos, pode criar notificações por correio eletrónico personalizadas que deixam uma impressão duradoura no seu público.
Este tutorial irá mostrar-lhe como personalizar os seus e-mails de notificação WPForms.
Neste artigo
Antes de começar, é necessário criar um novo formulário ou editar um já existente para aceder ao criador de formulários. Em seguida, certifique-se de que conclui a configuração básica de notificação do formulário.
Aceder às definições de personalização do e-mail
Para personalizar suas notificações por e-mail, primeiro você precisa ir para WPForms " Configurações e clicar na guia E-mail.
Personalizar as notificações por correio eletrónico
Depois de clicar na guia E-mail, você encontrará todas as configurações que permitem personalizar as notificações por e-mail enviadas pelo WPForms. Cobriremos cada uma das opções de personalização nas seções a seguir.
Nota: As configurações nas seções a seguir se aplicam a todos os e-mails de notificação do WPForms para o seu site, não apenas aqueles para um formulário individual.
Escolher um modelo de correio eletrónico
O WPForms fornece muitos modelos que podem ser usados para personalizar a aparência dos seus e-mails de notificação.
Na secção Modelo, encontrará todos os modelos disponíveis que o WPForms suporta. Cada um dos modelos de e-mail tem seu estilo e recursos exclusivos. Abaixo, descrevemos os modelos disponíveis.
- Clássico
- Compacto
- Moderno
- Elegante
- Técnica
- Texto simples
Nota: É necessária uma licença WPForms válida para utilizar os modelos Moderno, Elegante e Técnico.
Por predefinição, todas as mensagens de correio eletrónico utilizam o formato Clássico. Mas pode atualizar o modelo e o esquema de cores para corresponder aos estilos da sua marca.
Nota: Se você configurou anteriormente o modelo HTML antes de atualizar para a versão 1.8.5 ou superior do WPForms, verá o modelo Legacy selecionado por padrão. Este modelo não suporta algumas das opções de estilo modernas, como definir um esquema de cores ou alterar a família de fontes. Consulte a nossa secção FAQ para obter mais detalhes.
Para selecionar um modelo, basta passar o cursor do rato sobre o modelo que pretende utilizar e clicar no botão Escolher. Para este exemplo, vamos escolher o modelo Moderno, mas pode escolher qualquer um que quiser.
Em qualquer altura, pode clicar no botão Pré-visualização para ver o aspeto de cada um dos modelos na caixa de entrada do utilizador.
Eis um exemplo do aspeto do modelo de correio eletrónico Moderno.
Se preferir mudar para notificações compactas, selecione Compacto na secção Modelo . Em seguida, prima Pré-visualizar para ver o seu aspeto.
Eis um exemplo do aspeto de uma mensagem de correio eletrónico compactada.
A opção Texto simples remove todos os estilos do e-mail de notificação. Aqui está o aspeto quando pré-visualiza o modelo.
Ajustar a definição de aspeto
O WPForms permite-lhe personalizar as suas notificações de e-mail com um tema Claro ou Escuro para combinar com o estilo da sua marca. Para alterar o tema visual dos seus e-mails, basta selecionar a opção Claro ou Escuro na secção Aparência. Isso garante que seus e-mails terão uma ótima aparência e permanecerão consistentes com sua marca nas caixas de entrada de seus usuários.
Depois de escolher o seu modo de aparência preferido, pode definir a sua própria imagem de cabeçalho, esquema de cores exclusivo e tipografia para esse modo, garantindo um aspeto coeso e apelativo para os seus e-mails nos temas Claro e Escuro.
Nota: O aspeto do e-mail pode variar consoante a definição do modo escuro do seu dispositivo. Para uma pré-visualização exacta, certifique-se de que as definições do seu dispositivo correspondem à opção de aspeto escolhida.
Definir uma imagem de cabeçalho de e-mail
Se pretender adicionar uma imagem de cabeçalho ou um logótipo aos seus e-mails de notificação, desloque-se para a secção Imagem de cabeçalho. Em seguida, clique em Carregar imagem para selecionar o ficheiro de imagem do cabeçalho.
Para obter a melhor experiência de visualização em todos os tamanhos de ecrã, recomendamos a utilização de uma imagem com 300 píxeis de largura e 100 píxeis de altura.
Depois de carregar a sua imagem, verá um menu pendente para selecionar o tamanho da imagem a utilizar para as suas notificações por correio eletrónico. Os tamanhos disponíveis incluem Pequeno, Médio e Grande. Se selecionar qualquer um destes tamanhos, a resolução da imagem será ajustada para corresponder ao tamanho escolhido.
A imagem também se ajusta ao ecrã do utilizador. Isto significa que se estiver a visualizar a notificação por correio eletrónico a partir de um dispositivo móvel, esta será ajustada ao tamanho do ecrã.
Para mais detalhes, consulte o nosso tutorial sobre como adicionar uma imagem de cabeçalho aos e-mails de notificação.
Alterar o esquema de cores
O WPForms fornece uma secção de Esquema de Cores que lhe permite personalizar as cores dos elementos no e-mail de notificação. Abaixo, explicamos todos os esquemas de cores disponíveis:
Antecedentes
Esta cor controla o aspeto exterior do modelo de correio eletrónico. Abaixo está um exemplo com uma cor de fundo azul claro.
Corpo
A cor do corpo controla o aspeto do contentor do modelo de correio eletrónico. Esta é a área onde o e-mail de notificação real reside. Aqui está uma imagem de exemplo com um esquema de cor branca para o contentor do corpo.
Texto
Esta é a cor que será utilizada para todos os textos na mensagem de correio eletrónico de notificação. O esquema de cores predefinido é uma cor de texto escura, como se pode ver na imagem abaixo.
Ligações
Este é o esquema de cores para todos os links no e-mail de notificação. Na imagem abaixo, o endereço de correio eletrónico é uma ligação que utiliza a cor laranja predefinida para as ligações.
Para atualizar qualquer uma das cores, pode introduzir o valor HEX no campo de cor ou clicar no mesmo para abrir o seletor de cores.
Com o seletor de cores, pode ajustar a cor ao seu gosto.
Atualizar a tipografia do e-mail
A tipografia controla qual família de fontes será usada para e-mails de notificação do seu site. Atualmente, o WPForms suporta as fontes Sans Serif e Serif.
Para atualizar a família de tipos de letra do seu modelo de e-mail, clique no menu pendente Tipografia e selecione o tipo de letra que pretende utilizar.
Quando tiver terminado de personalizar o seu modelo de correio eletrónico, desloque-se para baixo e clique no botão Guardar definições para guardar as suas alterações.
Pré-visualização do modelo de e-mail
Depois de guardar as suas alterações, pode pré-visualizá-lo para ver o seu aspeto na caixa de entrada do utilizador. Para o fazer, clique na ligação Pré-visualizar modelo de e-mail no menu pendente Tipografia.
Isto abrirá uma pré-visualização do seu modelo de e-mail de notificação num novo separador do navegador. A pré-visualização aplicará todas as personalizações que acabou de configurar.
Se o dispositivo do utilizador estiver configurado para utilizar o modo escuro, o e-mail de notificação será automaticamente ajustado para corresponder ao aspeto do dispositivo do utilizador.
Personalização de notificações para formulários individuais
Se desejar, pode personalizar o modelo de correio eletrónico para um formulário específico no criador de formulários. Para o fazer, abra o formulário pretendido e aceda a Definições " Notificações.
Em seguida, desloque-se para baixo e clique em Avançadas para aceder às definições avançadas. Deverá ver um menu pendente Modelo de correio eletrónico.
Por predefinição, esta opção está definida como Modelo predefinido para todos os formulários do seu site. Isto significa que os seus formulários utilizarão as definições globais que configurou na página de definições.
Para substituir o modelo predefinido, clique na lista pendente Modelo de e-mail e selecione o modelo que pretende utilizar.
Em alternativa, pode clicar na ligação Ver modelos para ver todos os modelos disponíveis.
Na sobreposição que aparece, selecione a que pretende utilizar para o formulário específico.
Uma vez concluído, certifique-se de que guarda o seu formulário para atualizar o modelo.
Nota: A seleção de um modelo a partir do criador de formulários aplicará os estilos predefinidos do modelo. Não será possível personalizar as cores e a tipografia do modelo a partir do construtor de formulários.
Perguntas mais frequentes
Estas são as respostas a algumas das principais perguntas sobre a personalização de modelos de correio eletrónico de notificação.
Não estou a ver o modelo HTML. Como é que o posso incluir na biblioteca de modelos de correio eletrónico?
Se estava a utilizar o modelo HTML antes de atualizar para a versão 1.8.5 ou superior do WPForms, é provável que ainda tenha o modelo HTML disponível na sua página de definições de e-mail. Este modelo é denominado Legado na secção Modelo.
Se não estiver a ver o modelo Legacy, pode mostrá-lo adicionando um filtro personalizado ao ficheiro function.php do seu tema. Abaixo está o trecho de código a ser adicionado ao seu site.
/** * Este trecho de código força o uso do modelo de e-mail legado que foi chamado de "HTML" na v1.8.4 e abaixo. */ $settings = (array) get_option( 'wpforms_settings', [] ); $settings['email-template'] = 'default'; update_option( 'wpforms_settings', $settings );
Nota: Consulte o nosso guia sobre como adicionar código PHP personalizado para WPForms se precisar de orientação adicional.
Se estiver a utilizar o plug-in WPCode, pode importar facilmente o código acima para o seu site. Para mais pormenores, consulte o nosso tutorial de integração de fragmentos de código.
Uma vez que o modelo HTML não é suportado por defeito no WPForms versão 1.8.5 ou superior, não será possível aplicar-lhe algumas das opções de estilo mais recentes.
Pode ainda atualizar a cor de fundo do seu modelo. No entanto, a utilização do esquema de cores e das definições de tipografia não é suportada no modelo Legacy.
É isso mesmo! Agora já sabe como personalizar os e-mails de notificação do formulário.
Não deixe de explorar os nossos outros tutoriais sobre notificações de formulários para saber como pode tirar o máximo partido delas.