Gostaria de enviar dados dos seus formulários WordPress para uma aplicação ou plugin de terceiros? Com o addon WPForms Webhooks, pode ligar os seus formulários a um serviço secundário.
Este tutorial irá mostrar-lhe como instalar e utilizar o addon Webhooks com o WPForms.
Requisitos:
- É necessário um nível de licença Elite para aceder ao suplemento Webhooks
- Certifique-se de que instalou a versão mais recente do WPForms para cumprir a versão mínima exigida para o complemento Webhooks
O que são Webhooks?
Um webhook permite-lhe enviar automaticamente informações do seu formulário para outro serviço ou ferramenta fora do seu sítio WordPress. Isto é especialmente útil se precisar de uma integração, mas ainda não existe um addon disponível para o efeito.
A maneira mais fácil para iniciantes de configurar um webhook é por meio do nosso complemento Zapier. O Zapier é ótimo para todos os níveis de usuário porque usa uma configuração no estilo de assistente, que o orienta em todas as etapas necessárias para conectar seus formulários a um serviço separado.
Outra opção é a nossa integração com o Uncanny Automator. Esta funcionalidade permite-lhe estabelecer ligações entre aplicações e serviços suportados.
Para utilizadores mais avançados, o suplemento Webhooks oferece capacidades semelhantes sem qualquer serviço de conetor. No entanto, como contrapartida, o processo de configuração é mais técnico.
Instalar o Addon Webhooks
Antes de começar, é necessário certificar-se de que o WPForms está instalado e ativado no seu site WordPress.
Assim que o WPForms estiver instalado e a sua licença for verificada, poderá instalar e ativar rapidamente o addon Webhooks.
Configurar um Webhook
Quando o processo de instalação estiver concluído, está pronto para configurar o webhook. Para começar, é necessário criar um novo formulário ou editar um já existente.
Depois de abrir o construtor de formulários, pode ativar os webhooks em Definições " Webhooks. A partir daqui, active a opção Ativar Webhooks.
Isto abrirá mais definições que pode configurar, incluindo a atribuição de um nome ao seu webhook.
Por predefinição, os novos webhooks não têm nome. Se pretender editar ou adicionar um nome ao seu webhook, clique no ícone do lápis.
Além disso, se pretender adicionar mais webhooks, pode clicar no botão Adicionar novo webhook e preencher as definições para cada ligação adicional.
Abaixo do nome do seu webhook, verá todas as definições disponíveis para esta ligação. Descrevemos o que cada uma delas faz abaixo.
URL de pedido
A URL de solicitação será usada para conectar o WPForms a um aplicativo secundário. Normalmente, é possível obter esse URL da API do serviço ou da ferramenta após configurar uma conexão básica.
Método de pedido
O método de pedido permite-lhe selecionar o método HTTP que pretende utilizar quando o pedido do webhook é executado.
Existem vários métodos diferentes para escolher, com base no tipo de ligação que pretende criar:
- GET: O método GET irá recolher informações de um formulário submetido e enviar os detalhes para uma aplicação ligada.
- POST: O método POST pega na informação submetida através do WPForms e envia-a para um serviço secundário.
- PUT: O método PUT permite-lhe atualizar os dados quando o webhook é executado.
- PATCH: O método PATCH permite-lhe substituir dados quando o webhook é executado.
- DELETE: O método DELETE permite-lhe eliminar informações quando este webhook específico é executado.
Formato do pedido
O formato do pedido comunicará ao seu servidor o tipo de dados que está a ser enviado através do seu webhook. Isto também definirá o valor do cabeçalho Content-Type para os seus dados.
Existem dois tipos diferentes de formato de pedido disponíveis:
- JSON: O método JSON irá formatar os seus dados num formato
application/jsone definirá o tipo de conteúdo comocharset=utf-8. - FORMULÁRIO: O método FORM formata os seus dados num formato
application/x-www-form-urlencodede definirá o tipo de conteúdo comocharset=utf-8.
Nota: Os dados são normalmente enviados em formato JSON, uma vez que isso facilitará a alteração do lado do servidor (incluindo validação, formatação e alterações de sanitização)
Segredo
A chave secreta gerará um hash (ou ID exclusivo) para cada pedido concluído. Isto actua como uma assinatura para verificar a origem do seu pedido HTTP, e será sempre fornecido no cabeçalho do pedido.
Nota: Na maioria dos casos, se estiver a integrar os seus formulários com um serviço de terceiros, não precisa de preencher a definição Segredo. A definição Segredo destina-se aos programadores que integram as suas próprias APIs como forma de verificar a origem de um pedido.
Cabeçalhos dos pedidos
Os cabeçalhos de pedido permitem-lhe definir a(s) chave(s) e o(s) valor(es) do cabeçalho HTTP a enviar com o seu pedido de webhook.
Nota: Esta definição é especialmente útil se estiver a tentar passar uma chave de API no seu cabeçalho HTTP para pedidos autenticados. Você pode preencher sua própria chave de API usando o campo oculto do WPForms .
Corpo do pedido
À semelhança dos Cabeçalhos do pedido, a definição Corpo do pedido permite-lhe definir a(s) chave(s) e o(s) valor(es) que serão enviados no corpo do pedido do webhook.
Nota: Para separar valores múltiplos em campos como Endereço, Dropdown, Checkboxes, etc., o WPForms usa duas barras verticais (assim: ||).
Exemplo: Usando Webhooks para conectar o WPForms ao Slack
Nota: Para uma integração mais fácil com o Slack, recomendamos a utilização do nosso suplemento Slack dedicado, que oferece uma configuração mais fácil e mais funcionalidades. Consulte o nosso guia do complemento do Slack para obter mais detalhes.
Como exemplo, mostraremos como conectar o WPForms à sua conta do Slack usando um webhook.
Observação: este exemplo mostra como enviar um único campo de formulário para o Slack. Se quiser enviar vários campos para o Slack, consulte a nossa documentação para desenvolvedores para obter mais detalhes.
Criar a sua aplicação Slack
Primeiro, você precisa navegar até a página da API do Slack. Em seguida, clique no botão Criar um aplicativo.
Isto abrirá uma sobreposição onde terá de selecionar a forma como pretende configurar a sua aplicação. Escolha a opção Do zero.
Poderá então dar um nome à sua aplicação e selecionar o espaço de trabalho para o qual pretende enviar os dados do formulário. No nosso exemplo, vamos chamar à nossa aplicação Contact Sullie. Clique no botão Criar aplicação para continuar.
Isto levá-lo-á a uma página com algumas informações básicas sobre a sua aplicação. Desloque-se para baixo até às definições Adicionar caraterísticas e funcionalidades e active a opção Webhooks de entrada.
Depois de ativar a definição Webhooks de entrada, alterne a opção Ativar Webhooks de entrada para Ligado. Isso abrirá mais detalhes mais abaixo na página.
Por baixo da secção URLs de Webhook para o seu espaço de trabalho, clique no botão Adicionar novo Webhook ao espaço de trabalho.
Isto irá redireccioná-lo para outra sobreposição onde terá de selecionar um canal do Slack para o qual enviar as suas mensagens. Escolha um canal no menu suspenso e clique em Permitir.
Isso o levará de volta à página anterior. Verá um novo URL na secção URLs de Webhooks para o seu espaço de trabalho. Vá em frente e copie esse URL, pois ele será usado na próxima etapa.
Não se esqueça de manter este separador ou janela do browser aberto, uma vez que irá precisar das informações desta área mais tarde.
Adicionar seu webhook do Slack a um formulário
Em seguida, você precisará abrir o formulário no qual usará seu webhook. Se ainda não o fez, certifique-se de configurar o seu addon Webhooks no WPForms.
Depois de ativar os webhooks para o seu formulário, cole o URL que copiou do Slack no campo URL de pedido para ligar o seu formulário à API do Slack.
Em seguida, configure o restante das definições do webhook. Apresentamos abaixo todas as nossas definições configuradas para este exemplo:
- Método de solicitação: Como queremos enviar dados de nossos formulários para o Slack, definiremos o Método de solicitação como a opção POST.
- Formato do pedido: Vamos definir o formato do pedido como JSON padrão.
- Segredo: Para o nosso exemplo, deixaremos o campo Segredo em branco e permitiremos que ele seja gerado automaticamente quando nosso webhook for executado. Se for um programador e quiser introduzir o seu próprio valor de Segredo, pode fazê-lo aqui.
- Cabeçalhos de solicitação: Não temos nenhum valor específico que precisamos enviar com nossa solicitação, portanto, deixaremos a configuração Cabeçalhos da solicitação em branco. Quando o webhook for executado, o segredo gerado automaticamente será colocado aqui.
- Corpo do pedido:
- Chave: Introduza texto no campo Chave do parâmetro do corpo do pedido, uma vez que o formulário enviará informações em texto simples. Se não introduzir texto como valor para este campo, é provável que ocorra um erro na sua ligação.
- Selecionar campo: A configuração Selecionar campo será o nome do campo cujos dados você gostaria de enviar. No nosso exemplo, enviaremos os dados do campo Comentário ou Mensagem para o Slack.
Não se esqueça de guardar as alterações antes de sair do construtor de formulários. Recomendamos também que teste o seu formulário para se certificar de que o webhook está a funcionar corretamente depois de o ter configurado.
Adição de lógica condicional (opcional)
A lógica condicional permite-lhe escolher se uma ação é ou não executada com base nas escolhas de um utilizador no seu formulário.
Como exemplo, vamos mostrar-lhe como pode utilizar a lógica condicional para enviar uma mensagem para o Slack se um utilizador submeter uma entrada no nosso formulário de contacto com uma mensagem que contenha a palavra "Ajuda".
Para o configurar, tem de se certificar de que o seu formulário tem um campo Texto de linha única ou Texto de parágrafo. Para o nosso exemplo, vamos adicionar um campo de Texto de parágrafo.
Em seguida, terá de ajustar a etiqueta do campo de introdução de mensagens. No nosso exemplo, adicionaremos a etiqueta Comentário ou Mensagem.
Em seguida, você precisará configurar sua lógica condicional. Na parte inferior das configurações do webhook do Slack, ative a opção Ativar lógica condicional para revelar os menus suspensos para criar sua regra.
Em seguida, adicione a regra para sua lógica condicional. Para o nosso exemplo, definimos os menus suspensos para ler, Enviar este webhook se Comentário ou Mensagem contiver ajuda.
Nota: Precisa de ajuda para configurar a sua regra de lógica condicional? Nosso tutorial para iniciantes sobre o uso da lógica condicional no WPForms tem todos os detalhes.
Como sempre, não se esqueça de guardar o seu formulário antes de abandonar o construtor.
Perguntas mais frequentes
Estas são algumas das principais perguntas que vemos relacionadas com a extensão Webhooks.
Como posso utilizar etiquetas inteligentes no cabeçalho e no corpo do pedido?
As Smart Tags podem ser utilizadas para inserir dinamicamente informações no cabeçalho e no corpo do pedido do seu formulário.
Para usar as Smart Tags, selecione Adicionar valor personalizado no menu suspenso Cabeçalhos de solicitação nas configurações do webhook e, em seguida, adicione a Smart Tag como a chave do parâmetro. Você pode repetir a mesma etapa para a configuração Corpo da solicitação.
Para obter uma lista completa de Smart Tags que podem ser usadas, não deixe de conferir todas as Smart Tags disponíveis no WPForms.
É isso aí! Agora você sabe como configurar o complemento Webhooks para WPForms.
A seguir, está à procura de uma forma de transferir facilmente os seus WPForms de um site para outro? Confira nosso tutorial sobre como importar e exportar seus formulários.