Atenção! Este artigo é destinado a programadores. Não assumimos qualquer responsabilidade caso seu site fique momentaneamente indisponível durante o desenvolvimento da integração ou durante os testes e assumimos que a pessoa responsável pela integração tenha conhecimento de programação. É altamente recomendável o backup do arquivo de original de sua página e a criação de um ambiente de testes para o período de desenvolvimento.
_________________________________________
O site da sua empresa é, geralmente, o primeiro canal de contato entre sua organização e o potencial cliente, que muitas vezes utiliza o formulário de contato para enviar mensagens a fim de saber mais sobre seu produto ou serviço. Manter o controle e gerenciar cada um desses Leads é essencial para um processo de vendas assertivo. Tendo isso em mente, uma boa estratégia é integrar o formulário do seu site com o Ploomes para que as informações fornecidas pelos visitantes sejam capturadas e enviadas para seu CRM automaticamente. Este artigo visa explicar, com exemplos práticos, como isto pode ser feito.
Existem muitas linguagens de programação e Frameworks, mas para fins práticos utilizaremos puramente HTML com Javascript. O exemplo pode ser adaptado para qualquer cenário.
Abaixo está um formulário simples em HTML (sem formatação) apenas como exemplo. Não pretendemos e nem esperamos que você o utilize já que ele é extremamente básico e você provavelmente já tem o seu, então ele serve apenas para contextualizar:
<table id="contact_table">
<tbody>
<tr>
<td>
<div >
<input id="TB_Nome" class="input" name="name" type="text" value="" size="30" placeholder="Nome" />
<br />
</div>
</td>
<td>
<div style="margin-top: 4px;">
<input id="TB_Empresa" class="input" name="empresa" type="text" value="" size="30" placeholder="Empresa" />
<br />
</div>
</td>
</tr>
<tr>
<td>
<div >
<input id="TB_Telefone" class="input" name="name" type="text" value="" size="30" placeholder="Telefone" />
<br />
</div>
</td>
<td>
<div style="margin-top: 4px;">
<input id="TB_Email" class="input" name="empresa" type="text" value="" size="30" placeholder="E-mail" />
<br />
</div>
</td>
</tr>
</tbody>
</table>
<input id="submit_button" style="margin-top: 5px;" onClick="enviarDados()" type="button" value="Enviar" />
Deve-se então criar a função enviarDados em sua página HTML, na seção reservada para os scripts. O exemplo abaixo mostra um trecho de como seria este script:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
function enviarDados() {
document.getElementById("submit_button").disabled = true;
var empresa = new Object();
empresa.Name = TB_Empresa.value;
empresa.TypeId = 1;
var contato = new Object();
//Cria a empresa
$.ajax({type: 'post',url: 'https://public-api2.ploomes.com/Contacts',data: JSON.stringify(empresa),contentType: "application/json; charset=utf-8",headers: {'User-Key' : '1D4CD83C8743D33389C5EFA7AB6B6594BC4B25484CBE5803A99DAE6423AA91A47D51C6501AA2F9746AAB63C434DA4DE7A1475BBF400C2B3A1B61FBFCD97DD50E' },traditional: true,success: function (data) {
//Empresa criada com sucesso
var contato = new Object();
contato.CompanyId = data.value[0].Id; //Atribui o Id da Empresa para o contato, para que fiquem vinculados
contato.Name = TB_Nome.value;
contato.Email = TB_Email.value;
contato.TypeId = 2;
if(TB_Telefone.value != "")
{
var phone = new Object();
phone.PhoneNumber = TB_Telefone.value;
phone.TypeId = 1;
//Cria um Array de telefones e adiciona o telefone recém-criado.
var phones = new Array(phone);//Adiciona a lista de telefones ao lead
contato.Phones = phones;
}
$.ajax({type: 'post',url: 'https://public-api2.ploomes.com/Contacts',data: JSON.stringify(contato),contentType: "application/json; charset=utf-8",headers: {'User-Key' : '1D4CD83C8743D33389C5EFA7AB6B6594BC4B25484CBE5803A99DAE6423AA91A47D51C6501AA2F9746AAB63C434DA4DE7A1475BBF400C2B3A1B61FBFCD97DD50E' },traditional: true,success: function (data) {
//contato criado com sucesso
}});
}});
}
</script>
No trecho de código acima é mostrado como criar um objeto empresa e popular com o Nome fornecido no formulário. Em seguida é criado um objeto pessoa e preenchido com os demais campos.
Para não ficar muito extenso usamos apenas informações básicas, mas muitas outras podem ser enviadas, como mostrado a seguir. Basta preencher as informações de acordo com sua necessidade e com os campos disponíveis no seu formulário.
Abaixo um exemplo de campos que podem ser manipulados.
_________________________________________
{
"Id": 693237,
"TypeId": 1,
"Name": "Ploomes",
"LegalName": "Ploomes Sistemas Empresariais S.A.",
"Register": "17682570000101",
"CNPJ": "17682570000101",
"CPF": null,
"StatusId": 82156,
"CompanyId": null,
"RelationshipId": null,
"LineOfBusinessId": null,
"OriginId": 141017,
"NumberOfEmployeesId": null,
"ClassId": 0,
"OwnerId": 65005,
"Birthday": null,
"Note": null,
"Email": "berauto.veiculos@globo.com",
"Website": null,
"RoleId": null,
"DepartmentId": null,
"Skype": null,
"Facebook": null,
"StreetAddress": "Av. Francisco Matarazzo, 420",
"StreetAddressNumber": null,
"StreetAddressLine2": null,
"Neighborhood": "Vila Olímpia",
"ZipCode": 04515030,
"ForeignZipCode": null,
"CityId": 2373,
"StateId": 25,
"CountryId": 76,
"CurrencyId": null
}
_________________________________________
Além dos campos que são padrões de cada conta, é possível enviar uma lista com campos customizados (OtherProperties), que podem ser criados conforme as necessidades do seu negócio.
O link a seguir contém informações adicionais sobre a API do Ploomes:
Reforçamos que a intenção deste artigo é fornecer um guia prático com exemplos, mas para cada situação ou necessidade será necessário fazer alguns ajustes específicos. Assumimos que a pessoa encarregada de realizar o procedimento tenha conhecimentos em programação.