O JSON (JavaScript Object Notation) é um formato de troca de dados simples entre sistemas, processo também conhecido como parsing. Através de uma configuração de troca de dados, é possível integrar sistemas web, sites ou formulários em geral ao PipeRun.
Por exemplo: você pode configurar o envio de dados coletados através de uma landing page diretamente para o CRM de vendas PipeRun e gerar uma nova oportunidade, de forma automática.
Atenção! Este artigo exige conhecimentos técnicos em programação, tendo em vista que será necessário configurar as regras de envio de dados da integração em um JSON e inserir um script na página da landing page.
Confira neste artigo como realizar a configuração da integração. Também disponibilizamos uma explicação em vídeo, logo abaixo.
TÓPICOS DO ARTIGO
- Configurando uma integração json
- Json de regras (envio não obrigatório)
- Json do lead (envio obrigatório)
- Exemplo do json de regras e lead
- Exemplo de código em funcionamento, em um formulário para testes
- Outros exemplos
CONFIGURANDO UMA INTEGRAÇÃO JSON
Informações gerais para envio de dados:
- Endpoint:
https://app.pipe.run/webservice/integradorJson?hash=HASH_DA_ETAPA_DO_FUNIL - Tipo de requisição:
POST - Tipo de conteúdo (Content-Type):
application/json
É necessário ter o ID do formulário a ser integrado e o código precisa ser adaptado à realidade da integração.
Para saber como localizar a hash da etapa do funil, acesse este artigo.
JSON DE REGRAS (ENVIO NÃO OBRIGATÓRIO)
Confira abaixo o código, juntamente com a descrição, contendo as regras do envio dos dados:
{
"rules": {
"update": "informe_aqui_o_valor",
/*
* NOME: UPDATE
* DESCRICAO: DETERMINA SE IRA CRIAR OU ATUALIZAR UMA OPORTUNIDADE
* VALORES: {
* true, // ATUALIZARÁ UMA OP, UTILIZANDO O ATRIBUTO 'ID' DO LEAD
* false // CRIARÁ UMA NOVA OP
* }
* PADRÃO: false
*/
"filter_status_update": "informe_aqui_o_valor",
/*
* NOME: FILTER_STATUS_UPDATE
* DESCRICAO: SE JÁ HOUVER UMA OPORTUNIDADE COM O STATUS INFORMADO(E COM O MESMO ID), SERÁ ATUALIZADA ESSA OPORTUNIDADE, CASO CONTRARIO, UMA NOVA SERÁ CRIADA.
* VALORES: {
* "open", // ABERTA
* "closed", // GANHA
* "lost" // PERDIDA
* }
* PADRÃO: "open" // ABERTA
*/
"filter_situation_update": "informe_aqui_o_valor",
/*
* NOME: FILTER_SITUATION_UPDATE
* DESCRICAO: SE JÁ HOUVER UMA OPORTUNIDADE COM A SITUAÇÃO INFORMADA(E COM O MESMO ID), SERÁ ATUALIZADA ESSA OPORTUNIDADE, CASO CONTRARIO, UMA NOVA SERÁ CRIADA..
* VALORES: {
* "unfreezed", // NORMAL ou descongelada
* "freezed", // CONGELADA
* "undeleted", // NORMAL ou fora da lixeira
* "deleted" // NA LIXEIRA
* }
* PADRÃO: "NULL" // NULO ou oportunidade aberta normal.
*/
"equal_pipeline": "informe_aqui_o_valor",
/*
* NOME: EQUAL_PIPELINE
* DESCRICAO: DETERMINA O FUNIL PARA BUSCAR A OP POR SER ATUALIZADA
* VALORES: {
* true, // BUSCARÁ A OP NO MESMO FUNIL DA ETAPA RECEBIDA ATRAVÉS DA HASH
* false // BUSCARÁ A OP INDEPENDENTE DO FUNIL
* }
* PADRÃO: false
* OBS:DEPENDE DA REGRA 'UPDATE' > 'TRUE'
*/
"status": "informe_aqui_o_valor",
/*
* NOME: STATUS
* DESCRICAO: DETERMINA O STATUS DA OPORTUNIDADE
* VALORES: {
* "open", // ABERTA
* "closed", // GANHA
* "lost" // PERDIDA
* }
* PADRÃO: "open"
* OBS: AÇÕES AUTOMÁTICAS SERÃO EXECUTADAS, DEPENDENDO DO GATILHO
*/
"situation": "informe_aqui_o_valor",
/*
* NOME: SITUATION
* DESCRICAO: DETERMINA A SITUAÇÃO DA OPORTUNIDADE
* VALORES: {
* "freezed", // CONGELA A OP
* "unfreezed", // DESCONGELA A OP
* "delete", // ENVIA PARA LIXEIRA A OP
* "undelete", // RETIRA DA LIXEIRA A OP
* }
* PADRÃO: "NULL" // NULO
* OBS: PERMITE MAIS DE UM VALOR NESSA REGRA, DEVENDO SER SEPARADO POR "," (VÍRGULA)
*/
"validate_cpf": "informe_aqui_o_valor",
/*
* NOME: VALIDATE_CPF
* DESCRICAO: DETERMINA BUSCA DA PESSOA
* VALORES: {
* true, // BUSCA A PESSOA ATRAVÉS DO ATRIBUTO 'CPF'
* false // BUSCA A PESSOA ATRAVÉS DO ATRIBUTO 'EMAIL'
* }
* PADRÃO: false
*/
"validate_cnpj": "informe_aqui_o_valor"
/*
* NOME: VALIDATE_CNPJ
* DESCRICAO: DETERMINA BUSCA DA EMPRESA
* VALORES: {
* true, // BUSCA A EMPRESA ATRAVÉS DO ATRIBUTO 'CNPJ'
* false // BUSCA A EMPRESA ATRAVÉS DO ATRIBUTO 'COMPANY'
* }
* PADRÃO: false
*/
"validate_person_phone": "informe_aqui_o_valor"
/*
* NOME: VALIDATE_PERSON_PHONE
* DESCRICAO: DETERMINA BUSCA DA PESSOA PELO TELEFONE
* VALORES: {
* true, // BUSCA A PESSOA ATRAVÉS DOS ATRIBUTOS 'PERSON_PHONE_MAIN, PERSONAL_PHONE, MOBILE_PHONE'
* false // BUSCA A PESSOA ATRAVÉS DO ATRIBUTO 'EMAIL'
* }
* PADRÃO: false
*/
}
}JSON DO LEAD (ENVIO OBRIGATÓRIO)
Confira abaixo o código, juntamente com a descrição, do envio dos dados do lead.
{
"leads": [{
"id": "informe_aqui_o_valor", // OPORTUNIDADE: IDENTIFICADOR (PARA NÃO DUPLICAR)
"user": "informe_aqui_o_valor", // OPORTUNIDADE: DONO
"title": "informe_aqui_o_valor", // OPORTUNIDADE: TITULO
"value": "informe_aqui_o_valor", // OPORTUNIDADE: VALOR DA NEGOCIAÇÃO
"value_mrr": "informe_aqui_o_valor", // OPORTUNIDADE: VALOR RECORRENTE
"email": "informe_aqui_o_valor", // PESSOA: E-MAIL
"name": "informe_aqui_o_valor", // PESSOA: NOME
"cpf": "informe_aqui_o_valor", // PESSOA: CPF
"birth_day": "informe_aqui_o_valor", // PESSOA: DATA DE NASCIMENTO
"person_phone_main": "informe_aqui_o_valor", // PESSOA: TELEFONE PRINCIPAL
"personal_phone": "informe_aqui_o_valor", // PESSOA: TELEFONE
"mobile_phone": "informe_aqui_o_valor", // PESSOA: TELEFONE
"public_url": "informe_aqui_o_valor", // PESSOA: URL PÚBLICO
"job_title": "informe_aqui_o_valor", // PESSOA: CARGO
"cnpj": "informe_aqui_o_valor", // EMPRESA: CNPJ
"company_website":"informe_aqui_o_valor", // EMPRESA: WEBSITE
"company": "informe_aqui_o_valor", // EMPRESA: NOME
"company_phone_main": "informe_aqui_o_valor", // EMPRESA: TELEFONE PRINCIPAL
"city_name": "informe_aqui_o_valor", // CIDADE: NOME (UTILIZADO EM EMPRESA/PESSOA)
"city_state": "informe_aqui_o_valor", // CIDADE: UF (UTILIZADO EM EMPRESA/PESSOA)
"last_conversion": {
"source": "informe_aqui_o_valor" // OPORTUNIDADE: ORIGEM
},
"custom_fields": {
"Nome do campo 1": "informe_aqui_o_valor", // OPORTUNIDADE: CAMPO CUSTOMIZADO
"Nome do campo 2": "informe_aqui_o_valor" // OPORTUNIDADE: CAMPO CUSTOMIZADO
},
"tags": [
"nome_da_tag 1", // OPORTUNIDADE: TAG
"nome_da_tag 2" // OPORTUNIDADE: TAG
],
"notes": [
"texto da nota 1", // OPORTUNIDADE: NOTAS
"texto da nota 2" // OPORTUNIDADE: NOTAS
]
}]
}EXEMPLO DO JSON DE REGRAS E LEAD
{
"rules": {
"update": true,
"equal_pipeline": false,
"validate_cpf": true,
"validate_cnpj": true,
"validate_person_phone": true,
"situation": "freezed,undelete",
"status": "open",
"filter_status_update": "open",
"filter_situation_update": "freezed"
},
"leads": [{
"user": "[email protected]",
"id": "[email protected]",
"title": "Teste OP via Json",
"name": "Pessoa 123",
"email": "[email protected]",
"cpf": "0123456789",
"person_phone_main": "(51) 33333334",
"personal_phone": "(51) 33333333",
"mobile_phone": "(51) 999999999",
"company": "Empresa 456",
"cnpj": "9876543210",
"company_website:"https://meusite.com.br"
"company_phone_main": "(51) 33333334",
"city_name": "Porto Alegre",
"city_state": "RS",
"last_conversion": {
"source": "Formulário Site"
},
"custom_fields": {
"Campo customizado teste 1": "Sim",
"Campo customizado teste 2": "(51) 123456789"
},
"tags": [
"Tag teste 1",
"Tag teste 2"
],
"notes": [
"Lead obtido através da integração com o formulário XYZ do site ABC."
]
}]
}Pontos importantes:
- Caso o título não seja definido, o padrão
H:i d/m Integração: Nameserá utilizado; - Caso as tags informadas não existam, elas serão criadas e vinculadas, automaticamente;
- Caso os campos customizados não existam, eles serão criados e vinculados automaticamente (serão campos do tipo "texto" por padrão. Para outros tipos de campos, o campo deverá ser criado previamente);
- Você poderá utilizar o atributo
idpara evitar a duplicidade de leads, utilizando o dado informado para ser único junto a oportunidade. Dessa forma, antes de salvar, o PipeRun irá verificar se esse dado já existe vinculado a alguma oportunidade aberta, e, existindo o dado, será apenas atualizada a oportunidade, caso contrário, uma nova oportunidade será criada; - É possível ainda atualizar oportunidades com status diferente de aberta, como perdida, ou ganha utilizando o parâmetro
filter_status_updatenas rules; - Também é possível atualizar oportunidades que estejam na situação de congelada ou na lixeira, utilizando o parâmetro
filter_situation_update.
O PipeRun devolverá um JSON com status de sucesso, caso tudo tenha funcionado, após realizar o cadastro:
{
"success": true,
"message": "OK",
"data": {
"id": [
"1234"
],
"hash": [
"qkh5ei2qjkvvh9302yhp44zmtlyzxkz"
]
}
}OUTROS EXEMPLOS
Exemplo de código para captura de lead via integrador JSON com coleta de campanha através das variáveis UTM e conversão no Analytics.
// METODO PARA COLETAR DADOS DO FORMULARIO E ENVIAR PARA O PIPERUN, COM DADOS DE UTM.
// dependencia do script sessionStart.min.js
// dependencia do google analytics.
// sessionStart.min.js
function setCookie(name,value,exdays=1){var expires;var date;var value;date=new Date();date.setTime(date.getTime()+(exdays*24*60*60*1000));expires=date.toUTCString();document.cookie=name+"="+value+"; expires="+expires+"; path=/"}function getCookie(name){var c_name=document.cookie;if(c_name!=undefined&&c_name.length>0){var posCookie=c_name.indexOf(name);if(posCookie>=0){var hashOportunidade='';var value="; "+document.cookie;var parts=value.split("; "+name+"=");if(parts.length==2){hashOportunidade=parts.pop().split(";").shift()}return hashOportunidade}else{return!1}}}function eraseCookie(name){setCookie(name,-1)}function getRequestURL(name){if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(location.search))return decodeURIComponent(name[1])}function setSessionStart(sessionStartName,arTerms=['utm_source','utm_medium','utm_campaign','utm_term','utm_content','utm_position','utm_device','utm_match','utm_creative','plano','tipo']){arTerms.forEach(function(termo){var nameTermo=sessionStartName+'_'+termo;sessionStartCookie[termo]='';sessionStart[termo]='';var termValue=' ';var boSet=!1;if(getRequestURL(termo)){termValue=getRequestURL(termo);boSet=!0}if(!getCookie(nameTermo)){boSet=!0}if(boSet){setCookie(nameTermo,termValue)}termValue=getCookie(nameTermo);if(termValue==''){termValue=' '}sessionStartCookie[termo]=termValue;sessionStart[termo]=termValue})}var sessionStartCookie=new Object();var sessionStart=new Object();
// URL de referencia;
// https://crmpiperun.com/?utm_source=google&utm_medium=cpc&utm_campaign=institucional
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
if (sessionStart && sessionStart[name]) {
return (sessionStart[name] === null || sessionStart[name] === "" || sessionStart[name] === " " || sessionStart[name] === undefined) ? "" : sessionStart[name];
}
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
// Função para formatação de data.
function formatDate(date) {
return (date.getDate() < 10 ? '0' : '') + date.getDate()
+ '/' +
(date.getMonth() + 1)
+ '/' +
date.getFullYear() + ' ' +
date.getHours() + ':' + date.getMinutes();
}
const form = document.getElementById('conversion-form');
form.addEventListener('submit', enviarDados);
function enviarDados() {
if ($("#conversion-form").validate().errorList.length) {
return false;
}
// ENDPOINT
let endpoint = "https://app.pipe.run/webservice/integradorJson?hash=aaaa0000-0a00-0a0a-0000-0aa000a00aa0"
let dataHora = formatDate(new Date());
let name = jQuery('#text_field-conversion-form').val();
let email = jQuery('#email_field-conversion-form').val();
let company = jQuery('#text_field-conversion-form').val();
let phone = jQuery('#phone_field-conversion-form').val();
let utm_source = getParameterByName('utm_source');
let utm_medium = getParameterByName('utm_medium');
let utm_campaign = getParameterByName('utm_campaign');
let utm_term = getParameterByName('utm_term');
let utm_content = getParameterByName('utm_content');
let utm_position = getParameterByName('utm_position');
let utm_device = getParameterByName('utm_device');
let utm_match = getParameterByName('utm_match');
let utm_creative = getParameterByName('utm_creative');
// RULES
let rules = {
"update": true,
"status": "open",
"equal_pipeline": true,
"filter_status_update": "open",
}
// LEAD
let lead = [{
"id": email,
"title": dataHora + " " + company,
"name": name,
"email": email,
"company": company,
"mobile_phone": phone,
"last_conversion": {
"source" : "Site_PipeRun"
},
"custom_fields": {
"url_conversao": location.href,
"utm_source": utm_source,
"utm_medium": utm_medium,
"utm_campaign": utm_campaign,
"utm_term": utm_term,
"utm_content": utm_content,
"utm_position": utm_position,
"utm_device": utm_device,
"utm_match": utm_match,
"utm_creative": utm_creative
},
"notes" : [
"Título: " + dataHora + " Fale Consultor CRM</br>" +
"E-mail: " + email + "</br>" +
"Nome: " + name + "</br>" +
"WhatsApp: " + phone + "</br>" +
"Empresa: " + company + "</br>" +
"utm_source: " + utm_source + "</br>" +
"utm_medium: " + utm_medium + "</br>" +
"utm_campaign: " + utm_campaign + "</br>" +
"utm_term: " + utm_term + "</br>" +
"utm_content: " + utm_content + "</br>" +
"utm_position: " + utm_position + "</br>" +
"utm_device: " + utm_device + "</br>" +
"utm_match: " + utm_match + "</br>" +
"utm_creative: " + utm_creative
]
}]
jQuery.each(lead[0], function(index, value) {
if (typeof value == 'string' && value == '') {
delete lead[0][index]
}
});
// DATA
let dataToSend = {
"rules": rules,
"leads": lead
}
jQuery.ajax({
type: "post",
data: JSON.stringify(dataToSend),
dataType: "json",
url: endpoint,
success: function(data) {
ga('send','event','form','contato','fale-consultor');
}
});
}Exemplo de código para captura de lead via integrador JSON com javascript puro, sem a necessidade de uso do jQuery.
// Integrador JSON PipeRun.
document.getElementById('button').onclick = function(event) {
// ENDPOINT
let endpoint = "https://app.pipe.run/webservice/integradorJson?hash=aaaa0000-0a00-0a0a-0000-0aa000a00aa0"
// RULES
let rules = {
"update": true,
"equal_pipeline": true,
"filter_status_update": "open"
}
// LEAD
let lead = [{
"id": document.getElementsByName('email')[0].value,
"title": "CRM PipeRun Landing Page",
"user": "[email protected]",
"name": document.getElementsByName('name')[0].value,
"email": document.getElementsByName('name')[0].value,
"mobile_phone": document.getElementsByName('phone')[0].value,
"last_conversion": {
"source": "Site_CRMPipeRun"
},
"custom_fields": {
"segmento": (document.getElementsByName('segmento')[0].value ? document.getElementsByName('segmento')[0].value : "Não Informado")
},
"tags": [
"Contato"
],
"notes": [
"Contato enviado através do formulário de consultoria técnica do CRM PipeRun."
]
}]
// DATA
let dataToSend = {
"rules": rules,
"leads": lead
}
// Requisição POST
fetch(endpoint, {
headers: {
'Content-Type': 'text/plain'
},
method: "POST",
body: JSON.stringify(dataToSend)
}).then((response) => {
// Retorno do Ajax
console.log(response);
ga('send','event','form','contato','fale-consultor');
}).catch((error) => {
console.log(error);
});
};
Exemplo de código para captura de lead via integrador JSON implementado no Wordpress com Elementor.
// METODO PARA COLETAR DADOS DO FORMULARIO E ENVIAR PARA O PIPERUN, COM DADOS DE UTM. // dependencia do google analytics. // URL de referencia; // https://crmpiperun.com/?utm_source=google&utm_medium=cpc&utm_campaign=institucional function getParameterByName(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), results = regex.exec(location.search); return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } // Função para formatação de data. function formatDate(date) { return (date.getDate() < 10 ? '0' : '') + date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' ' + date.getHours() + ':' + date.getMinutes(); } const form = document.getElementsByClassName('elementor-form')[0]; form.addEventListener('submit', enviarDados); function enviarDados() { // ENDPOINT let endpoint = "https://app.pipe.run/webservice/integradorJson?hash=aaaa0000-0a00-0a0a-0000-0aa000a00aa0" let dataHora = formatDate(new Date()); let name = jQuery('#form-field-nome').val(); let email = jQuery('#form-field-email').val(); let company = jQuery('#form-field-empresa').val(); let phone = jQuery('#form-field-phone').val(); let job_title = jQuery('#form-field-cargo').val(); let message = jQuery('#form-field-message').val(); let utm_source = getParameterByName('utm_source'); let utm_medium = getParameterByName('utm_medium'); let utm_campaign = getParameterByName('utm_campaign'); let utm_term = getParameterByName('utm_term'); let utm_content = getParameterByName('utm_content'); let utm_position = getParameterByName('utm_position'); let utm_device = getParameterByName('utm_device'); let utm_match = getParameterByName('utm_match'); let utm_creative = getParameterByName('utm_creative'); // RULES let rules = { "update": true, "status": "open", "equal_pipeline": true, "filter_status_update": "open", } // LEAD let lead = [{ "id": email, "title": dataHora + " " + company, "name": name, "email": email, "company": company, "mobile_phone": phone, "job_title": job_title, "last_conversion": { "source" : utm_source || "Site CRM PipeRun" }, "custom_fields": { "url_conversao": location.href, "utm_source": utm_source, "utm_medium": utm_medium, "utm_campaign": utm_campaign, "utm_term": utm_term, "utm_content": utm_content, "utm_position": utm_position, "utm_device": utm_device, "utm_match": utm_match, "utm_creative": utm_creative }, "notes" : [ "Título: " + dataHora + " Fale com Consultor CRM</br>" + "E-mail: " + email + "</br>" + "Nome: " + name + "</br>" + "WhatsApp: " + phone + "</br>" + "Empresa: " + company + "</br>" + "Mensagem: " + message + "</br>" + "utm_source: " + utm_source + "</br>" + "utm_medium: " + utm_medium + "</br>" + "utm_campaign: " + utm_campaign + "</br>" + "utm_term: " + utm_term + "</br>" + "utm_content: " + utm_content + "</br>" + "utm_position: " + utm_position + "</br>" + "utm_device: " + utm_device + "</br>" + "utm_match: " + utm_match + "</br>" + "utm_creative: " + utm_creative ] }] jQuery.each(lead[0], function(index, value) { if (typeof value == 'string' && value == '') { delete lead[0][index] } }); // DATA let dataToSend = { "rules": rules, "leads": lead } jQuery.ajax({ type: "post", data: JSON.stringify(dataToSend), dataType: "json", url: endpoint, success: function(data) { ga('send', 'event', 'form', 'contato', 'captura_lead_corporativo'); } }); }
Pronto! Agora você já sabe como configurar a integração Json no CRM de Vendas PipeRun.
Em caso de dúvidas, chame nossa equipe no chat. 😉