Como integrar um formulário do Contact Form 7 com PipeRun?

Neste passo-a-passo, vamos ver como configurar uma integração para que dados preenchidos em um formulário do Contact Form 7 em seu site WordPress sejam enviados automaticamente para o PipeRun, um popular CRM.

Para isso, vamos usar o plugin CF7 to Webhook do brasileiro Mário Valney. A vantagem desse plugin é que ele nos dá mais controle sobre exatamente como nós vamos enviar os dados para o webhook. Além de poder enviar para diversos webhooks (ou sistemas) diferentes.

Documentação útil

Então vamos ao passo a passo:

Etapa 1) Obter o endpoint no PipeRun

1. Acesse o PipeRun

2. Antes de qualquer coisa, identifique para qual etapa do funil você deseja que os dados sejam enviados.

3. Siga este tutorial para obter o hash da etapa de funil desejada. Copie esse dado, ele será útil na sequência.

Etapa 2) Configurar o CF7 to Webhook

1. Instale e ative os plugins Contact Form 7 e CF7 to Webhook em seu site.

2. Crie um formulário de contato com o Contact Form 7 normalmente. Você vai notar que aparecerá uma nova aba nas configurações do formulário chamada “Webhook”.

3. Configure essa aba da seguinte forma (itens não mencionados ficam em branco):

  • Webhook
    • Integrar (Enviar para o Webhook): Ative esta opção para que o conteúdo do formulário seja enviado para o RD Station
    • URL do Webhook: Você deve inserir o seguinte URL: https://app.pipe.run/webservice/integradorJson?hash=[hash-da-etapa]. Substitua o trecho [hash-da-etapa] pela hash da etapa para onde os dados serão enviados (veja etapa 1).
  • Configurações
    • Enviar E-mail (Enviar o e-mail do CF7 normalmente): Desative se você quiser que o CF7 não envie mais o e-mail, apenas o webhook. Recomendo deixar essa opção ativada.
  • Configurações avançadas:
    • Cabeçalhos: você deve adicionar o seguinte conteúdo:
      • accept: application/json
        content-type: application/json
  • Clique em Salvar

Etapa 3) Configurar o corpo da requisição

Para que o CF7 to Webhook envie o conteúdo do jeito que o CRM espera receber, além das configurações básicas acima, vamos precisar editar mais um campo na aba “Webhook”: Configurações Avançadas > Corpo.

Você pode adicionar um corpo personalizado parecido com esse:

{
    "rules": {
        "update": false,
        "status": "open"
    },
    "leads": [{
        "title": "Site - [your-email] - [_date] [_time]", // OPORTUNIDADE: TÍTULO (não pode ser duplicado)
        "email": "[your-email]", // PESSOA: E-MAIL
        "name": "[your-name]", // PESSOA: NOME
        "cpf": "[cpf]", // PESSOA: CPF
        "birth_day": "[aniversario]", // PESSOA: DATA DE NASCIMENTO
        "person_phone_main": "[telefone]", // PESSOA: TELEFONE PRINCIPAL
        "job_title": "[cargo]", // PESSOA: CARGO
        "cnpj": "[cnpj]", // EMPRESA: CNPJ
        "company": "[empresa]", // EMPRESA: NOME
        "company_phone_main": "[telefone-empresa]", // EMPRESA: TELEFONE PRINCIPAL
        "city_name": "[cidade]", // CIDADE: NOME (UTILIZADO EM EMPRESA/PESSOA)
        "city_state": "[estado]", // CIDADE: UF (UTILIZADO EM EMPRESA/PESSOA)
        "last_conversion": {
            "source": "Site - [_post_title]" // OPORTUNIDADE: ORIGEM
        },
        "custom_fields": {
            "traffic_source": "[utm_source]",
            "traffic_medium": "[utm_medium]",
            "traffic_campaign": "[utm_campaign]",
            "traffic_value": "[utm_term]",
            "Nome do campo 1": "informe_aqui_o_valor", // OPORTUNIDADE: CAMPO CUSTOMIZADO
            "Nome do campo 2": "informe_aqui_o_valor" // OPORTUNIDADE: CAMPO CUSTOMIZADO
        },
        "tags": [
            "site", // OPORTUNIDADE: TAG
            "[_post_title]" // OPORTUNIDADE: TAG
        ],
        "notes": [
            "texto da nota 1", // OPORTUNIDADE: NOTAS
            "texto da nota 2" // OPORTUNIDADE: NOTAS
        ]
    }]
}

Para entender o código acima, cada item está marcado entre aspas e, depois dos dois pontos, vem o conteúdo do item, nessa lógica:

"item": "conteúdo do item",

Você pode alterar o conteúdo de cada item com os shortcodes do CF7, como [your-name] e [your-email].

Além disso, você também pode usar tags especiais nativas do CF7 para metadados do formulário como nome da página ou horário. Nesse caso, você deve incluir as tags também no campo “Special Mail Tags” da aba “Webhook”.

Itens obrigatórios (não remova esses itens):

  • title (deve ser único no sistema)

Se quiser saber mais sobre os itens que podem ser incluídos na requisição, aqui tem um detalhamento dos parâmetros aceitos pelo CRM.

Além disso, é possível adicionar campos personalizados (custom_fields). Para saber mais sobre campos personalizados e como identificar os campos já criados, você pode usar este tutorial.

Observe que, dentro do PipeRun, os dados de contatos são chamados de Oportunidades.

Quando terminar, clique em Salvar.

Etapa bônus: rastrear os parâmetros de campanha da página

O Google utiliza parâmetros de URL chamados UTMs que ajudam a adicionar algumas informações sobre a origem de um lead e rastrear a eficácia de campanhas de marketing. Clique aqui se quiser saber mais.

Para coletar esses dados no formulário, você deve instalar e ativar o plugin Contact Form 7 – Dynamic Text Extension e depois é só adicionar os seguintes campos ocultos ao seu formulário:

[hidden utm_id default:get]
[hidden utm_source default:get]
[hidden utm_medium default:get]
[hidden utm_campaign default:get]
[hidden utm_term default:get]
[hidden utm_content default:get]

Além disso, não se esqueça de incluir os campos no corpo da requisição (veja etapa 3). E garantir que os campos personalizados equivalentes estejam criados no Piperun.

Teste

Se quiser testar o funcionamento do JSON enviado pelo webhook, você pode usar esta ferramenta.

Ainda tem dúvidas?

Entre em contato para eu poder te ajudar!