O melhor portal de Marketing e Vendas para a sua empresa
Quer inovar nas estratégias de Black Friday? Saiba como criar uma ferramenta automatizada para enviar RCS usando PHP.
A Black Friday já se consolidou como uma data importante para atrair novos consumidores para os negócios. Por isso, para esse período, é tão relevante pensar em ferramentas que possam agilizar processos. Como é o caso de ferramentas automatizadas. Em outra ocasião, falamos sobre como utilizar bots para decolar as vendas na Black Friday. Aqui, vamos mostrar como é possível criar uma para enviar mensagens RCS com PHP e a ZENVIA API‘s.
Por meio da plataforma ZENVIA, temos a possibilidade de integrar a API de envio de mensagens RCS, criando grandes possibilidades para o uso neste fim de ano.
A seguir, vamos exemplificar o uso da API de Mensagens RCS da ZENVIA, utilizando PHP e banco de dados MySQL, criando uma ferramenta que permite o envio de mensagens RCS para uma lista de clientes cadastrados. Confira!
Para testes em Sandbox na plataforma ZENVIA, crie uma conta. Após o login, o acesso será liberado. Na tela inicial, navegue seguindo este fluxo Solutions > Sandbox. Clique em create a new e seleciona a opção RCS.
Você será redirecionado para uma tela de testes. Adicione seu número e clique em Send mensages. A partir deste momento, será enviada uma mensagem RCS para este número.
Para criar um canal de conexão através da mensagem enviada, clique em accept. Agora é possível a troca de mensagens utilizando a ZENVIA API’s.
Após configurar o canal, volte para o menu de produto e acesse Tokens e Webhooks. Clique em Create New e adicione o token. Logo após, você será redirecionado para a listagem de tokens e webhooks do Sandbox:
Vamos precisar da palavra-chave e do token para integrarmos com a API.
Neste tutorial, vamos desenvolver uma aplicação que permite o cadastro de clientes em uma base de dados e permitir o envio de mensagens RCS com notificações, utilizando a ZENVIA API’s. Neste exemplo, vamos automatizar o envio de mensagens para uma lista de contatos, notificando sobre novas promoções, cupons de descontos e outros tipos de vantagens e chamativos.
Para o desenvolvimento desta aplicação será necessário ter instalado o interpretador do PHP, um servidor web (apache, ngnix) e também o banco de dados MySQL.
1. Abaixo está disponível o schema de banco de dados. Crie o banco utilizando o nome store_db como o seguinte schema.
-- store_db.customers definition
CREATE TABLE `customers` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(255) NOT NULL,
`lastname` varchar(255) NOT NULL,
`phone` varchar(255) NOT NULL,
`email` varchar(255) NOT NULL,
`created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
`updated_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=33 DEFAULT CHARSET=latin1;
1.1. Com o banco de dados criado, será necessário fazer a conexão. Crie uma pasta com o nome database e, dentro dela, um arquivo chamado connect.php. Adicione as instruções abaixo, com suas credenciais do banco de dados:
<?php $connect = mysqli_connect("172.17.0.2", "root", "root", "store_db");
Para criar nossas páginas web, vamos utilizar o Bootstrap 4. Com este framework, podemos simplificar a estilização e também a criação de alguns componentes.
1. Crie uma pasta chamada includes e adicione dois arquivos o header.php e o footer.php. Isolando estes componentes, podemos replicá-los em todas as paginas do projeto.
Em header.php adicione o seguinte código. No header, os importes para utilizar o Bootstrap 4 já estarão disponíveis!
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,
shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet"
<!-- importação do CDN do Bootstrap -->
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous">
<title>Cadastrar Clientes</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="#">ZENVIA STORE</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse d-flex flex-row-reverse" id="navbarNav">
<ul class="nav navbar-nav mr-sm-2">
<li><a class="nav-link" href="send-messages.php">Enviar Mensagens RCS</a></li>
<li><a class="nav-link" href="customers.php">Listar Clientes</a></li>
<li><a class="nav-link" href="index.php">Adicionar Clientes</a></li>
</ul>
</div>
</nav>
<div class="container">
Em footer.php, adicione o seguinte exemplo de código:
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"></script>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
<script src="./js/script.js"></script>
</body>
</html>
1. Vamos criar uma página chamada customers.php. Esta página será o formulário para cadastrar os clientes na base:
<?php include("includes/header.php") ?>
<div class="row">
<div class="col-md-12 mt-5">
<h1 class="text-center">Cadastrar Cliente</h1>
<br />
</div>
</div>
<div class="row">
<div class="col-md-5 mx-auto">
<form action="customer-form.php">
<div class="form-group">
<label for="">Name</label>
<input type="name" name="name" class="form-control">
</div>
<div class="form-group">
<label for="">Sobrenome</label>
<input type="text" name="lastname" class="form-control">
</div>
<div class="form-group">
<label for="">Celular.</label>
<input type="text" name="phone" class="form-control"
placeholder="(99) 99999 - 9999">
</div>
<div class="form-group">
<label for="">Email</label>
<input type="email" name="email" class="form-control">
</div>
<div class="form-group">
<button type="submit" name="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
<?php include("includes/footer.php") ?>
1.1. Para receber os dados do formulário, vamos criar uma página chamada customer-form.php, com o seguinte código.
<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
<?php
//função para cadastrar o cliente no banco
function createCustomer($connect, $name, $lastname, $phone, $email) {
$query = "INSERT INTO store_db.customers (name, lastname, phone, email) values ('{$name}', '{$lastname}','{$phone}', '{$email}')";
return mysqli_query($connect, $query);
};
$name = $_GET["name"];
$lastname = $_GET["lastname"];
$phone = $_GET["phone"];
$email = $_GET["email"];
?>
<?php if(createCustomer($connect, $name, $lastname, $phone, $email)) { ?>
<div class="row">
<div class="col-md-5 mx-auto p-5">
<p class="alert-success"> Cliente <?= $name; ?> <?= $lastname; ?> adicionado com sucesso!</p>
</div>
<?php } else { ?>
<div class="col-md-5 mx-auto p-5">
<p class="alert-danger"> Cliente não cadastrado</p>
</div>
<?php } ?>
</div>
<?php include("includes/footer.php") ?>
1.2. Agora é possível cadastrar os clientes no banco de dados. Adicione mais uma página com o nome customer.php, com o código de exemplo abaixo:
<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
<div class="row">
<div class="col-md-12 mt-5">
<h1 class="text-center">CLIENTES CADASTRADOS</h1>
<hr style="height: 1px;color: gray;background-color: gray;">
</div>
</div>
<div class="d-flex flex-row-reverse mb-2">
<a href="index.php" class="btn btn-success ml-2">Novo cliente</a>
<a href="send-messages.php" class="btn btn-primary">Enviar Mensagens RCS</a>
</div>
<div class="row">
<div class="col-md-12">
<table class="table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Sobrenome</th>
<th>Celular</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<?php
if(isset($_GET['delete']))
{
$id=$_GET['delete'];
$sql_query="DELETE FROM store_db.customers WHERE id=".$id;
mysqli_query($connect, $sql_query);
}
$customers = mysqli_query($connect, "SELECT * FROM store_db.customers");
while ($customer = mysqli_fetch_assoc($customers)) {
?>
<tr>
<td> <?php echo $customer['id'] ?></td>
<td> <?php echo $customer['name'] ?></td>
<td> <?php echo $customer['lastname'] ?></td>
<td> <?php echo $customer['phone'] ?></td>
<td> <?php echo $customer['email'] ?></td>
<td>
<a href="customers.php?delete=<?php echo $customer['id'] ?>"
class="badge badge-danger">Delete</a>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
<?php include("includes/footer.php") ?>
1.3. Para cadastrar um cliente, abra a página de cadastro de clientes no navegador, preencha os dados e logo após, clique em submit. Retornando na página listar Clientes é possível visualizar o cliente cadastrado.
1. Vamos criar um arquivo chamado customer-json.php. Nele, vamos listar todos os clientes cadastrados em formato json. Adicione o seguinte código:
1.1. Crie uma pasta chamada js e crie um arquivo chamado script.js, adicionando o exemplo de código abaixo:
$(document).ready(function() {
$("button").click(function() {
var x = $("#form-message").serializeArray();
$.each(x, function(i, field) {
const URL = "https://api.zenvia.com/v2/channels/rcs/messages"
fetch('customers-json.php').then(res => res.json())
.then(response => {
response.forEach(item => {
const body = JSON.stringify({
from:"troubled-lemur",
to: item.phone,
contents:[{
type:"text",
text: field.value
}]})
fetch(URL, {
method:"post",
headers: {
'Content-Type': 'application/json',
'X-API-TOKEN':'<seu_token>'
},
body: body
}).catch(function(err){
console.error("Não foi possível achar a informação", err)
})
})
})
});
});
});
1.2. Vamos criar mais um formulário, que utilizaremos para enviar mensagem RCS:
<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
<div class="row">
<div class="col-md-12 mt-5">
<h1 class="text-center">Enviar Mensagem RCS</h1>
<br />
</div>
</div>
<div class="row">
<div class="col-md-5 mx-auto">
<form id="form-message">
<div class="form-group">
<label for="">Mensagem</label>
<textarea name="message" id="" cols="" rows="3"
class="form-control"></textarea>
</div>
<div class="form-group">
<button type="submit" name="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
<div id="output"></div>
<?php include("includes/footer.php") ?>
1.3. Preencha o formulário enviando as mensagens para os clientes cadastrados. Para todos os clientes cadastrados no banco de dados, uma mensagem será enviada. Exemplo abaixo:
Também recomendamos mais leituras e tutoriais que podem trazer insights importantes para a sua Black Friday:
Para finalizar, quer saber mais sobre as possibilidades das mensagens RCS? Conheça mais o potencial do RCS na página da ZENVIA!
*Diego Rodrigues Gonçalves é Analista de Integração Sr na ZENVIA | LinkedIn