Olá pessoal,
Em um outro artigo vimos como é simples criar um botão “Comprar Agora” utilizando o gerador online de botões. O único problema do gerador é que precisamos definir o preço do produto no próprio gerador, o que pode ser problemático se tivermos muitos botões e o preço dos produtos variar muito constantemente.
Para resolver essa situação, podemos criar um botão que permite a variação do preço do produto dinamicamente. Isso é muito simples e pode ser feito em poucos passos:
Etapa 1
- 1. Vamos até PayPal.com.br e fazemos login:
- 2. Na aba “Minha conta”, selecionamos a opção “Perfil”:
- 3. No menu que aparecerá no lado esquerdo, selecionamos “Minhas ferramentas de venda”:
- 4. Na lista que aparecerá no lado direito, selecionamos “Botões do PayPal”:
- 5. Na caixinha que aparecerá no lado direito, selecionamos “Criar novo botão”:
Na tela do gerador de botões, vamos configurar o novo botão informando o tipo de botão “Comprar Agora”, o nome do item e vamos usar um valor qualquer no lugar do preço:
Etapa 2
Finalizada a Etapa 1, vamos clicar na aba “Etapa 2″ para a próxima parte da configuração. Para que possamos fazer a mudança do preço do item dinamicamente, vamos precisar desmarcar o checkbox “Salvar botão no PayPal”, isso garantirá que possamos customizá-lo livremente:
Finalização
A aba “Etapa 3″ é opcional, se você tiver alguma configuração para fazer lá, você pode fazê-la. Se não tiver nenhuma configuração, basta clicar no botão “Criar botão”:
Código gerado
Ao clicar em “Criar botão”, o PayPal gera o botão de pagamento “Comprar Agora” conforme configurado no gerador. O último detalhe da criação desse botão é Remover proteção do código.
O código gerado:
Após clicar em “Remover proteção do código” ele ficará assim:
Customizando o botão manualmente
Sem a proteção no código, podemos fazer diversas customizações no botão. Para conhecer todas as variáveis possíveis, visite a documentação em HTML Variables for PayPal Website Payments Standard
Nesse instante temos o seguinte código:
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="email@vendedor.com.br">
<input type="hidden" name="lc" value="BR">
<input type="hidden" name="item_name" value="Aqui colocamos o nome do item">
<input type="hidden" name="amount" value="1.00">
<input type="hidden" name="currency_code" value="BRL">
<input type="hidden" name="button_subtype" value="services">
<input type="hidden" name="no_note" value="0">
<input type="hidden" name="cn" value="Adicionar instruções especiais para o vendedor">
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted">
<input type="image" src="https://www.paypalobjects.com/pt_BR/BR/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - A maneira mais fácil e segura de efetuar pagamentos online!">
<img alt="" border="0" src="https://www.paypalobjects.com/pt_BR/i/scr/pixel.gif" width="1" height="1">
</form>
No código vamos encontrar as duas linhas abaixo:
<input type="hidden" name="item_name" value="Aqui colocamos o nome do item">
<input type="hidden" name="amount" value="1.00">
Em item_name podemos colocar o nome do produto e em amount, que inicialmente colocamos 1, podemos colocar o preço manualmente, 77 reais por exemplo:
<input type="hidden" name="item_name" value="Aqui colocamos o nome do item">
<input type="hidden" name="amount" value="77.00">
O código completo ficaria assim:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Botão dinâmico</title>
</head>
<body>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="email@vendedor.com.br">
<input type="hidden" name="lc" value="BR">
<input type="hidden" name="item_name" value="Aqui colocamos o nome do item">
<input type="hidden" name="amount" value="77.00">
<input type="hidden" name="currency_code" value="BRL">
<input type="hidden" name="button_subtype" value="services">
<input type="hidden" name="no_note" value="0">
<input type="hidden" name="cn" value="Adicionar instruções especiais para o vendedor">
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted">
<input type="image" src="https://www.paypalobjects.com/pt_BR/BR/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - A maneira mais fácil e segura de efetuar pagamentos online!">
<img alt="" border="0" src="https://www.paypalobjects.com/pt_BR/i/scr/pixel.gif" width="1" height="1">
</form>
</body>
</html>
E o botão se parecerá com o seguinte:
E a página de pagamento ficará assim:
Não deixe de conferir as variáveis html para o Website Payment Standard, elas poderão ajudá-lo nas customizações possíveis: HTML Variables for PayPal Website Payments Standard
O código de exemplo pode ser encontrado em Code Sample
Nota: Os códigos de exemplo são meramente ilustrativos, com o intuito de demonstrar a facilidade de integração com a API. Apesar de funcionarem segundo a proposta do tutorial, devem ser tratados como exemplos e não como código de produção.
De 0 a 10, o quanto você recomendaria este artigo para um amigo?