Incluir uma opção de adicionar ao calendário em seus formulários do Wordpress

Como incluir uma opção Adicionar ao calendário em seus formulários do WordPress

Deseja incluir uma opção Add to Calendar em seus formulários do WordPress?

Oferecer aos visitantes do site uma maneira fácil de adicionar datas de eventos aos seus calendários depois de se registrarem no seu site é um toque pessoal adicional que as pessoas apreciarão. Se preferir, você também pode adicionar essa opção às confirmações do formulário ou às notificações por e-mail.

Neste artigo, mostraremos como incluir uma opção Add to Calendar em seus formulários do WordPress, para que os visitantes do site possam começar a planejar seus próximos eventos a partir do momento em que enviarem um formulário em seu site.

Crie seu formulário WordPress agora

Como incluir uma opção Adicionar ao calendário em seus formulários do WordPress

Etapa 1: Criar um formulário do WordPress

A primeira coisa que você precisa fazer é instalar e ativar o plug-in WPForms. Para obter mais detalhes, consulte este guia passo a passo sobre como instalar um plug-in no WordPress.

Em nosso exemplo, criaremos um formulário simples de RSVP para festas de aniversário que as pessoas podem preencher e enviar. Para obter ajuda com essa etapa, não deixe de conferir este tutorial sobre como criar um formulário RSVP no WordPress.

Veja como o modelo de formulário RSVP de convite para festa de aniversário se parece no criador de formulários:

O modelo de formulário de convite de aniversário RSVP no criador de formulários

Para adicionar uma pequena mensagem ao formulário informando às pessoas quando será a festa, basta arrastar o campo de formulário Content (Conteúdo) do lado esquerdo do construtor de formulários para a área de visualização do lado direito. Em seguida, clique no campo para fazer alterações.

Veja o que adicionamos ao nosso formulário:

Adição de um campo Content a um formulário RSVP

Agora é hora de incluir a opção Add to Calendar em seu formulário.

Etapa 2: criar um evento no Google Agenda

A primeira coisa que faremos antes de adicionar a opção de calendário ao nosso formulário é criar um evento no Google Calendar.

Para fazer isso, faça login na sua conta do Google e acesse o Google Agenda. Em seguida, clique em Criar " Evento e preencha os detalhes do evento.

Criação de um novo evento do Google Agenda

Clique em Save (Salvar) para que o evento seja salvo em seu calendário.

Em seguida, localize o evento em seu calendário e clique no ícone de três pontos. No menu suspenso, selecione Publicar evento.

Publicação de um evento do Google Agenda

Ao fazer isso, um modal pop-up aparecerá com links para o seu evento. Você deverá copiar o link para usá-lo em seu formulário do WordPress.

Cópia de um link de evento do Google Agenda

Para que os visitantes do seu site vejam o evento publicado, é preciso garantir que o Google Agenda esteja definido como "Público".

Para alterar seu Google Agenda para "Público" para que todos possam ver, primeiro escolha Configurações no menu suspenso do seu calendário.

Abrir a configuração de seu Google Agenda

Em seguida, clique no calendário que deseja tornar público, role para baixo até Permissões de acesso para eventos e clique na caixa de seleção Tornar disponível ao público.

Tornar seu Google Agenda público

Tornar seu Google Agenda público fará com que todos os eventos de sua agenda fiquem visíveis para o mundo, mesmo por meio da pesquisa do Google. Se você tiver assuntos particulares em seu calendário, sugerimos que crie um Google Agenda separado para os eventos que deseja que os visitantes do site adicionem a seus próprios calendários.

Agora seu evento está pronto para ser adicionado ao formulário do WordPress.

Etapa 3: Inclua uma opção Add to Calendar em seu formulário do WordPress

Há vários locais onde você pode incluir a opção Add to Calendar em seus formulários:

  1. No próprio formulário
  2. Em confirmações de formulários
  3. Em notificações por e-mail

Primeiro, vamos dar uma olhada em como incluir a opção Add to Calendar no seu formulário real.

Caso ainda não o tenha feito, adicione um campo de formulário Content (Conteúdo ) ao seu formulário de evento arrastando-o do lado esquerdo para o painel do lado direito.

Adicionamos esse campo de formulário desde o início porque queríamos garantir que as pessoas soubessem um pouco sobre nosso evento.

Quando o campo do formulário Content for adicionado, clique nele para fazer alterações. Adicione o link que você copiou do Google Calendar.

Adição de um link do Google Agenda a um campo de conteúdo

Clique em Save (Salvar ) na parte superior do construtor de formulários quando terminar.

Salvando seu formulário

Quando um visitante do site clicar no botão de CTA denominado Google Calendar, o Google abrirá e solicitará que ele faça login em sua conta. Em seguida, o evento aparecerá com todos os detalhes que você adicionou para que ele possa salvá-lo em sua própria agenda, se assim desejar.

Agora, se você preferir não ter uma opção Add to Calendar no formulário do WordPress, poderá adicionar o link para o seu evento nas confirmações ou notificações do formulário.

Etapa 4: Inclua uma opção Add to Calendar na mensagem de confirmação de seu formulário

As confirmações de formulário são mensagens que são exibidas aos visitantes do site depois que eles enviam um formulário em seu site. Elas permitem que as pessoas saibam que o formulário foi aprovado e oferecem a oportunidade de informá-las sobre as próximas etapas.

O WPForms tem três tipos de confirmação para escolher:

  1. Mensagem. Esse é o tipo de confirmação padrão no WPForms. Quando um visitante do site enviar seu formulário RSVP, uma mensagem simples de confirmação será exibida, informando-o de que o formulário foi aprovado.
  2. Mostrar página. Esse tipo de confirmação levará os visitantes do site a uma página específica em seu site para agradecê-los pelo RSVP. Para obter ajuda sobre como fazer isso, consulte nosso tutorial sobre como redirecionar os clientes para uma página de agradecimento.
  3. Ir para URL (Redirecionar). Essa opção é usada quando você deseja enviar os visitantes do site para um site diferente.

Para nosso formulário de evento, criaremos uma mensagem de confirmação com a opção Add to Calendar para que os visitantes do site possam adicionar imediatamente nosso próximo evento aos seus calendários do Google.

Para começar, clique na guia Confirmations (Confirmações ) no Form Editor, em Settings (Configurações).

Em seguida, selecione o tipo de confirmação que deseja criar. Para este exemplo, selecionaremos Mensagem.

Abrir as configurações de confirmação de um formulário RSVP

Como estamos adicionando a opção de adicionar seu evento a um calendário na confirmação do formulário, temos duas opções:

  1. Crie uma mensagem simples, adicionando a opção Add to Calendar na mensagem, independentemente de as pessoas comparecerem ou não.
  2. Crie várias confirmações de formulário e ative a lógica condicional inteligente para que somente as pessoas que participarão ou poderão participar vejam a mensagem de confirmação com a opção Add to Calendar.

Para simplificar, criaremos uma mensagem de confirmação que será exibida para todos os visitantes do site, quer eles planejem participar do evento ou não. Basta digitar um texto e adicionar o link do evento do Google Agenda a ele.

Adição de um link de evento do Google Agenda a uma mensagem de confirmação

Esta é a aparência da confirmação do formulário quando alguém envia um formulário RSVP:

Uma mensagem de confirmação com um link para o Google Agenda

Novamente, tudo o que o visitante do site precisa fazer é clicar no link do Google Agenda e adicionar seu evento à agenda dele.

Se você quiser criar várias confirmações de formulário e usar a lógica condicional para exibir mensagens diferentes para as pessoas, dependendo das respostas de RSVP, confira este tutorial sobre como criar confirmações de formulário condicionais.

Etapa 5: Inclua uma opção Add to Calendar nas notificações por e-mail de seu formulário

O último lugar em que você pode incluir uma opção Add to Calendar em seus formulários do WordPress é na notificação por e-mail que as pessoas recebem quando enviam um formulário em seu site.

Mas, antes de começarmos a explicar como fazer isso, você precisa ter certeza de que tem um campo de formulário Email no seu formulário RSVP, o que não aconteceu no nosso exemplo. Essa é a única maneira de o WPForms saber como enviar uma notificação por e-mail aos visitantes do seu site.

Depois de adicionar um campo de formulário de e-mail ao seu formulário de evento, vá para Settings " Notifications ( Configurações " Notificações ) no Form Editor (Editor de formulário).

Acessar as configurações de notificações de um formulário

Por padrão, você sempre receberá uma notificação por e-mail quando alguém enviar um formulário em seu site.

Para garantir que os visitantes do site também recebam uma notificação, no entanto, você precisará usar as Smart Tags para adicionar o e-mail do visitante do site à notificação por e-mail.

Para fazer isso, clique em Show Smart Tags.

Exibição de Smart Tags nas configurações de Notificações

Em seguida, selecione a opção Email no menu suspenso para que o WPForms saiba como enviar uma notificação por e-mail para o e-mail que o visitante do site inseriu no formulário RSVP.

Adição do campo E-mail à configuração Enviar para endereço de e-mail com uma Smart Tag

Agora é hora de personalizar a mensagem com a opção Add to Calendar.

Para esse método, você precisará do código HTML do link do Google Agenda. Volte para as configurações de publicação no Google Calendar e copie a opção HTML do modal pop-up.

Copiar o HTML do link do evento do Google Agenda

De volta ao construtor de formulários, role para baixo atéMensagem de e-mail e adicione a mensagem que você deseja que as pessoas vejam em seus e-mails. Em seguida, cole o código HTML do seu evento do Google Agenda.

Adição do HTML do evento do Google Agenda à mensagem de notificação por e-mail

Agora, sempre que alguém preencher o formulário do seu evento, receberá uma notificação completa com um botão para adicionar o evento ao Google Calendars.

Um botão do Google Agenda em uma notificação por e-mail

Em seguida, adicione um Datepicker a seus formulários do WordPress

E aí está! Agora você sabe como incluir uma opção Add to Calendar em seus formulários do WordPress para que os visitantes do site possam adicionar facilmente seu próximo evento ao Google Agenda deles.

Se estiver criando formulários para eventos ou reservas, você também gostará deste guia sobre como criar um formulário do WordPress com um seletor de datas.

Você sabia que pode permitir que seus visitantes adicionem eventos de calendário a um calendário compartilhado do WordPress? Aqui está nosso guia fácil para adicionar um formulário para eventos enviados por usuários.

Se você estiver preocupado com a possibilidade de todos os visitantes do site verem e preencherem o formulário do seu evento, saiba que o WPForms permite que você ative permissões de formulário específicas para que somente aqueles com uma senha possam preencher e enviar o formulário do seu evento. Para obter ajuda com essa etapa, confira este tutorial fácil de seguir sobre como proteger seus formulários do WordPress com senha.

Então, o que está esperando? Comece hoje mesmo a usar o mais avançado plug-in de formulários do WordPress.

E não se esqueça de que, se você gostou deste artigo, siga-nos no Facebook e no Twitter.

Divulgação: Nosso conteúdo é apoiado pelo leitor. Isso significa que, se você clicar em alguns de nossos links, poderemos receber uma comissão. Veja como o WPForms é financiado, por que isso é importante e como você pode nos apoiar.

Claire Broadley

Claire é a gerente de conteúdo da equipe do WPForms. Ela tem mais de 13 anos de experiência escrevendo sobre WordPress e hospedagem na Web.Saiba mais

O melhor plug-in de criação de formulários de arrastar e soltar para WordPress

Fácil, rápido e seguro. Junte-se a mais de 6 milhões de proprietários de sites que confiam no WPForms.

Ative o JavaScript em seu navegador para preencher este formulário.

6 comentários sobre "Como incluir uma opção Adicionar ao calendário em seus formulários do WordPress"

    1. Oi Jan,

      Peço desculpas, pois não temos uma maneira integrada de inserir o iCalendar nas notificações por e-mail. Concordo que isso será muito útil! Adicionei seu voto para considerar isso como uma solicitação de recurso para aprimoramentos futuros.

      Obrigado pela compreensão! 🙂

  1. Nem todos os membros da minha organização têm uma agenda do Google. Alguns usam o Outlook, outros o icalender, outros não têm calendário. Esse projeto atende apenas aos usuários do Google, não é mesmo?

    1. Olá Patrick - Para incluir uma opção add-to-calendar no Google Calendar, os usuários precisarão de uma conta do Gmail. Caso queira se conectar com o Outlook, você pode considerar o uso de nossa integração Zapier. Caso seja útil, você pode integrar o Google Calender com o iCalendar . Dito isso, se estiver se referindo a uma integração diferente, sinta-se à vontade para entrar em contato usando nosso formulário de contato com detalhes adicionais.

  2. Isso é muito útil, obrigado! Como posso incluir "adicionar opção de calendário" para o agendamento de compromissos? Para compromissos, o evento do Google Agenda não pode ser criado com antecedência, pois o cliente pode escolher qualquer dia no calendário

Adicionar um comentário

Ficamos felizes por você ter optado por deixar um comentário. Lembre-se de que todos os comentários são moderados de acordo com nossa política de privacidade, e todos os links são nofollow. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.

Este formulário é protegido pelo Cloudflare Turnstile e aplicam-se a Política de Privacidade e os Termos de Serviço da Cloudflare.