- Como Criar Um Site, Blog – WebMaster.pt - https://www.webmaster.pt -

Carrinho de Compras Personalizado Em PHP

Posted By Quemuel Aquino On 08/06/2010 @ 09:20 In Desenvolvimento Web,Featured,PHP | 37 Comments

^[1]

Olá! É a primeira vez que visitas o nosso blog? Subscreve o nosso RSS Feed ^[1] para receberes notificações de novos artigos. Ou segue-nos no Twitter ^[2].

Tweet ^[3]

Meu sonho ao começar a estudar linguagem dinâmica de Programação era o de elaborar lojas virtuais e sistemas mais avançados.

Creio que assim como eu tive esse sonho um dia, hoje vários Programadores que iniciam tem o mesmo interesse!

Não adianta nós colocarmos algo muito bem elaborado cheio de classes que ele não vai entender nada! Aliás, vai apenas copiar e colar o código para testar quando tiver um tempo.

Por esse motivo, decidi na matéria de hoje postar um dos primeiros modelos de carrinho de compras que eu já usei!

Sim. Era gratuito. Confesso.

Na época peguei em um CD que vinha com revistas de informática. Mas eu personalizei seu código, e defini uma outra estrutura.

Usando um método simples de programação, consegui fazer de um carrinho de compras básico algo que atendesse minhas necessidades e desse aos meus clientes a confiança que eu precisava em meus serviços, já que minha finalidade era a de “solicitarem o Produto e no final receber seus dados de contato por email de forma personalizada”.

Bem… essa é minha finalidade. Ok?

Abaixo vou descrever passo a passo esse script.

No final da matéria você poderá baixar o ficheiro, para poder estudar sem nenhum problema.

Página Inicial – Index.php

Como minha finalidade é gerar o conhecimento tanto para quem está iniciando quanto quem já conhece um pouco de programação e Base de Dados, na pagina abaixo ao invés de trabalharmos com base de dados, receberemos as informações necessárias em formato de Array.

Veja o código abaixo e repare como ele aparecerá em tela:



<?php

//MONTA O ARRAY DE PRODUTOS

$produto[1][CODIGO] = "1";

$produto[1][ARTISTA] = "Produto 01";

$produto[1][ALBUM] = "Descrição do Produto 01";

$produto[1][preço] = "10,15";

$produto[1][IMAGEM] = "semimagem.jpg";



$produto[2][CODIGO] = "2";

$produto[2][ARTISTA] = "Produto 02";

$produto[2][ALBUM] = "Descrição do Produto 02";

$produto[2][preço] = "15,25";

$produto[2][IMAGEM] = "semimagem.jpg";



$produto[3][CODIGO] = "3";

$produto[3][ARTISTA] = "Produto 03";

$produto[3][ALBUM] = "Descrição do Produto 03";

$produto[3][preço] = "20,10";

$produto[3][IMAGEM] = "semimagem.jpg";



$produto[4][CODIGO] = "4";

$produto[4][ARTISTA] = "Produto 04";

$produto[4][ALBUM] = "Descrição do Produto 04";

$produto[4][preço] = "25,60";

$produto[4][IMAGEM] = "semimagem.jpg";



//TOTAL DE PRODUTOS POR LINHA

$total = 2;



?>



<html>

<head>

<title>.:: WebMaster.PT :: Carrinho de Compras Personalizado ::.</title>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

-->

</style></head>



<body>

<table width="773" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><br><br><br>

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><font face='Arial' size='2'>Confira abaixo, os produtos disponíveis no site:</font> </td>

</tr>

</table>

<br>



<form action="carrinho.php" method="post" name="frmcarrinho">

<input type="hidden" name="opc_efetivar" value="1">

<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<?php

//PEGA A CHAVE DO ARRAY

$chave = array_keys($produto);



//EXIBE OS PRODUTOS

for($i=0; $i<sizeof($chave); $i++) {

$indice = $chave[$i];

$codigo = $produto[$indice][CODIGO];

$artista = $produto[$indice][ARTISTA];

$album = $produto[$indice][ALBUM];

$preço = $produto[$indice][preço];

$imagem = $produto[$indice][IMAGEM];



//VERIFICA

if($total == $atual) {

echo "</tr><tr>";

$atual = 0;

} ?>



<td width="14%" height="100"><img src="imagens/<?= $imagem; ?>" width="80" height="80" border="1"></td>

<td width="36%">



<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><font face='Arial' size='2'><?php echo $artista; ?></font></td>

</tr>



<tr>

<td><font face='Arial' size='2'><?php echo $album; ?></font></td>

</tr>



<tr>

<td><font face='Arial' size='2'>R$ <?php echo $preço; ?></font></td>

</tr>



<tr>

<td>

<input type="hidden" name="txtprod[<?php echo $indice;?>][CODIGO]" value="<?php echo $codigo; ?>">

<input type="hidden" name="txtprod[<?php echo $indice;?>][ARTISTA]" value="<?php echo $artista; ?>">

<input type="hidden" name="txtprod[<?php echo $indice;?>][ALBUM]" value="<?php echo $album; ?>">

<input type="hidden" name="txtprod[<?php echo $indice;?>][preço]" value="<?php echo $preço; ?>">

<input type="text" name="txtprod[<?php echo $indice;?>][QTDE]" size="3" maxlength="3">

<input type="image" src="imagens/carrinho.gif" onClick="java script: document.forms[0].submit();"></td>

</tr>

</table></td>

<?php

//SOMA 1 A VARIÁVEL CONTROLADORA

$atual++;

}//FEHA FOR ?>

</tr>

</table>

</form></td>

</tr>

</table>

</body>

</html>

Página Index.php

O detalhe interessante neste Projeto é o “for” que inicia na linha 67 e finaliza na linha 110.

O número de produto por linha é definido na linha 29, porém, tem resultado direto nesta área.

Mais a frente falaremos de Projetos maiores que necessitam deste tipo de estrutura!

Minha dica é que você altere esse conteúdo e o gerencie por uma base de dados, alterando algo para melhorar o script e adaptá-lo às suas necessidades.

Página carrinho.php

O carrinho de compras não é dificil de se entender. Basta apenas analisar com cuidado os scripts em JavaScript e os que estão em PHP.

Da linha 1 à linha 67 você encontrará vários tratamentos.

OBS.: Caso você queira alterar as variáveis desta parte do script, é interessante entendê-lo primeiro (passo a passo) e depois fazer as alterações.

Elas são responsáveis tanto pelo recebimento dos dados da página anterior, quanto da finalização.

Veja maiores informações no script abaixo e na imagem a seguir:



<?php



//INICIALIZA A SESSÃO

session_start();



//VERIFICA SE A OPÇÃO ATUALIZAR FOI SELECIONADA

if($_POST[opc_atualizar]) {



//RECEBE OS PRODUTOS CHECADOS PARA ATUALIZAÇÃO

$v_atualiza = $_POST[a_prod];



//PEGA A CHAVE DO ARRAY

$chave = array_keys($v_atualiza);



//EXIBE

for($i=0; $i<sizeof($chave); $i++) {

//PEGA O INDICE DO PRODUTO

$indice = $chave[$i];



//ALTERA A QUANTIDADE DO PRODUTO SELECIONADO

$_SESSION[cesta][$indice][QTDE] = $v_atualiza[$indice][QTDE];

}//FECHA FOR

}//FECHA IF



//VERIFICA SE A OPÇÃO EXCLUIR FOI SELECIONADA

elseif($_POST[opc_excluir]) {



//RECEBE OS PRODUTOS CHECADOS PARA EXCLUSÃO

$excluir = $_POST[check];



//EXIBE

for($i=0; $i<sizeof($excluir); $i++) {

//PEGA O INDICE DO PRODUTO

$indice = $excluir[$i];

//DESTRÓI A VARIÁVEL ESPECIFICADA

unset($_SESSION[cesta][$indice]);

}//FECHA FOR

}//FECHA IF



//RECEBE O PEDIDO DO USUÁRIO

elseif($_POST[opc_efetivar]) {

//RECEBE AS VARIÁVEIS

$v_prod = $_POST[txtprod];



//PEGA A CHAVE DO ARRAY

$chave = array_keys($v_prod);



//EXIBE

for($i=0; $i<sizeof($chave); $i++) {

$indice = $chave[$i];



//VERIFICA

if(!empty($v_prod[$indice][QTDE]) ) {



//GRAVA NO ARRAY CESTA

$cesta[$indice][ARTISTA] = $v_prod[$indice][ARTISTA];

$cesta[$indice][ALBUM] = $v_prod[$indice][ALBUM];

$cesta[$indice][preço] = $v_prod[$indice][preço];

$cesta[$indice][QTDE] = $v_prod[$indice][QTDE];

}//FECHA IF

}//FECHA FOR



//GRAVA NA SESSÃO

$_SESSION[cesta] = $cesta;

}//FECHA ELSE

?>



<html>

<head>

<title>.:: WebMaster.PT :: Carrinho de Compras Personalizado ::.</title>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

.style2 {

color: #000000;

font-weight: bold;

}

.style5 {color: #FFFFFF; font-weight: bold; }

-->

</style>



<script language="JavaScript">

<!--

function enviar(opcao) {

//OPÇÃO EXCLUIR SELECIONADA

if(opcao == 'E') {

document.forms[0].opc_excluir.value = 1;

document.forms[0].submit();

}//FECHA IF



//OPÇÃO ATUALIZAR SELECIONADA

if(opcao == 'A') {

document.forms[0].opc_atualizar.value = 1;

document.forms[0].submit();

}//FECHA IF



//OPÇÃO FINALIZAR SELECIONADA

if(opcao == 'F') {

document.forms[0].opc_finalizar.value = 1;

document.forms[0].action = "finalizar.php";

document.forms[0].submit();

}//FECHA IF



}//FECHA FUNCTION

//-->

</script>



</head>



<body>

<table width="773" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><br>

<br>

<br>

<br>

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><font size="2" face="Arial">Carrinho de Compras: </font></td>

</tr>

</table>



<?php

//EXIBE O CARRINHO SE TIVER PRODUTOS

if(count($_SESSION[cesta]) > 0) { ?>



<form name="frmCarrinho" method="post">

<input type="hidden" name="opc_excluir">

<input type="hidden" name="opc_atualizar">

<input type="hidden" name="opc_finalizar">

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr bgcolor="#CCCCCC">

<td width="4%"> </td>

<td width="8%"><span class="style2">Qtde</span></td>

<td width="51%"><span class="style2">Produto</span></td>

<td width="19%"><span class="style2">Valor</span></td>

<td width="18%"><span class="style2">Subtotal</span></td>

</tr>

<?php

//PEGA A CHAVE

$chave_cesta = @array_keys($_SESSION[cesta]);



//EXIBE OS PRODUTOS DA CESTA

for($i=0; $i<sizeof($chave_cesta); $i++) {

$indice = $chave_cesta[$i];



//SUBTOTAIS DE CADA PRODUTO

$subtotal = $_SESSION[cesta][$indice][QTDE] * ereg_replace(",",".",$_SESSION[cesta][$indice][preço]);



//TOTAL GERAL

$total += $subtotal;

?>

<tr>

<td height="25"><input name="check[]" type="checkbox" value="<?php echo $indice; ?>"></td>

<td height="25"><font face='Arial' size='2'>

<input type="text" name="a_prod[<?php echo $indice; ?>][QTDE]" value="<?php echo $_SESSION[cesta][$indice][QTDE]; ?>" size="3"></font></td>

<td height="25"><font face='Arial' size='2'><?php echo $_SESSION[cesta][$indice][ARTISTA]; ?> - <?php echo $_SESSION[cesta][$indice][ALBUM]; ?></font></td>

<td height="25"><font face='Arial' size='2'>R$ <?php echo $_SESSION[cesta][$indice][preço]; ?></font></td>

<td width="18%" height="25"><font face='Arial' size='2'> R$ <?php echo number_format($subtotal,2,',','.'); ?></font></td>

</tr>

<?php

}//FECHA FOR ?>

<tr>

<td height="25" colspan="3">

<input type="image" name="btnExcluir" src="imagens/excluir.gif" onClick="enviar('E');">

<input type="image" name="btnAtualiza" src="imagens/atualizar.gif" onClick="enviar('A');"></td>

<td height="25" bgcolor="#FF0000"><span class="style5"> Total à pagar: </span></td>

<td height="25" bgcolor="#FFF0F0" class="style2"> R$ <b><?php echo number_format($total,2,',','.'); ?></b></td>

</tr>

<tr>

<td height="25" colspan="3"> </td>

<td height="40" colspan="2"><div align="center">

<input type="image" name="btnFinaliza" src="imagens/continuar.gif" onClick="enviar('F');"></div></td>

</tr>

</table>

</form>

<?php

}//FECHA IF(count)

else { ?><br><br><br>

<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td align='center'><font face='Arial' size='2' color="#006666"><b>Desculpe, mas no momento você não possui nenhumm produto.</b></td>

</tr>

</table><br><br>

<?php

}//FECHA ELSE (count)?>

<table width="70%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td align='center'><font face='Arial' size='2'><a href="index.php"><< Voltar </a></font></td>

</tr>

</table>

<br>

</td>

</tr>

</table>

</body>

</html>

Página carrinho.php

OBS.: Após clicar no botão “continuar”, o Sistema trará abaixo o conteúdo do ficheiro “finalizar.php”.

Página finalizar.php

Esta página não tem muitos detalhes. Ela é mais para a finalização da compra e envio do internauta para a página inicial!

Analise passo a passo o script e personalize para suas necessidades!



<?php



//INICIALIZA A SESSÃO

session_start();



//VERIFICA SE FOI ESCOLHIDA A OPÇÃO PARA FECHA O PEDIDO

if($_POST[opc_enviar]) {



//RECEBE OS DADOS DO FORMULÁRIO

$v_nome = $_POST[txtNome];

$v_end = $_POST[txtEndereco];

$v_email = $_POST[txtEmail];

$v_produtos = $_POST[v_produtos];

$v_total = number_format($_POST[v_total],2,',','.');



//EMAIL DO ADMINISTRADOR QUE VAI RECEBER O PEDIDO

$email_dest = "publiqueseuemailaqui@gmail.com";



//PREPARA O PEDIDO

$mensagem = "<center><table width='500' border='0' cellspacing='1' cellpadding='4' bgcolor='#4a66a3'>

<tr>

    <td bgcolor='white' valign='top'>

       <link rel='important stylesheet' href='chrome://messenger/skin/messageBody.css'>

       <style type='text/css' media='screen'>

       <!-- td { color: #069; font-size: 8pt; font-family: Arial, Verdana, Arial, Helvetica, sans-serif } --></style><br>

        <p align='justify'>Prezado Administrador,<br><br>

          Recebemos através do site o pedido de compra abaixo descrito:<br><br>



          <b>DADOS DA COMPRA:</b><BR>



          <b>Produto:</b> $v_produtos<br>

          <b>Quantidade:</b> <?php echo $_SESSION[cesta][$indice][QTDE]<br>

          <b>Total a Pagar:</b> $v_total<br><br>



          <b>DADOS PARA ENTREGA:</b><BR>

          <b>Nome:</b> $v_nome<br>

          <b>Endereço:</b> $v_end<br>

          <b>Email:</b> $v_email<br>



          <p> <font color='#076DB8'>Atenciosamente,<br>



        <br>



        <b>Departamento Comercial</b><br>

        Nome do Seu site</font>

      <br>

      <b><font color='#7694CB' size='1' face='Verdana, Arial, Helvetica, sans-serif'>:: Politica de Privacidade::<br></font></b>

      <font color='#7694CB' size='1' face='Verdana, Arial, Helvetica, sans-serif'>O envio e recebimento de nossas mensagens procura estar alinhado com o C&oacute;digo de &Eacute;tica Anti-SPAM que objetiva reger e orientar a comunica&ccedil;&atilde;o institucional, comercial e publicit&aacute;ria enviada sob a forma de mensagens eletr&ocirc;nicas.</font>

      <br>

      <hr size='1'>

       <font size='1' face='Verdana, Arial, Helvetica, sans-serif'>

       Temos a forte convic&ccedil;&atilde;o de que a rela&ccedil;&atilde;o entre cliente e empresa deve ser marcada pelo conceito de parceria, fortalecendo o v&iacute;nculo estabelecido em bases de

       confian&ccedil;a e apoio m&uacute;tuo.</font></td>

       </tr></table></center>";



  $headers = "MIME-Version: 1.0" . "\r\n";

  $headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";// More headers

  $headers .= "From: $v_email" . "\r\n"; // 'From: $email_dest' . "\r\n";



mail("$email_dest", "Pedido: Nome do Seu Site", "$mensagem", "$headers");



if (mail){



     //ELIMINA TODAS AS VARIÁVEIS DA SESSÃO

       $_SESSION = array();



     //DESTRÓI A SESSÃO PARA GARANTIR

       @session_destroy();



?>



<script language="JavaScript">

<!--

alert("PARABÉNS!!\n\nO seu pedido foi enviado com sucesso.");

window.location.href = "index.php";

//-->

</script>

<?php

}//FECHA IF(envia)

else {?>

&lt;script language="JavaScript">

<!--

alert("ERRO!!\n\nAconteceu algum problema.\n\nPor favor, tente novamente...");

window.location.href = "index.php";

//-->

</script>

<?php

}//FECHA ELSE (envia)

}//FECHA IF



?>



<html>

<head>

<title>.:: WebMaster.PT :: Carrinho de Compras Personalizado ::.</title>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

.style2 {

color: #000000;

font-weight: bold;

}

.style5 {

color: #FFFFFF;

font-weight: bold;

}

-->

</style>



<script language="JavaScript">

<!--

function finaliza() {

if(confirm('Deseja mesmo efetivar esse pedido ?'))

return true;

else return false;

}//FECHA FUNCTION

//-->

</script>



</head>



<body>

<table width="773" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><br><br>



<br><br>



<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><font size="2" face="Arial">Fechamento do pedido de compras: </font></td>

</tr>

</table>



<br>

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr bgcolor="#0099CC">

<td width="10%"><span class="style2">Qtde</span></td>

<td width="53%"><span class="style2">Produto</span></td>

<td width="19%"><span class="style2">Valor</span></td>

<td width="18%"><span class="style2">Subtotal</span></td>

</tr>



<?php

//PEGA A CHAVE

$chave_cesta = array_keys($_SESSION[cesta]);



//EXIBE OS PRODUTOS DA CESTA

for($i=0; $i<sizeof($chave_cesta); $i++) {

$indice = $chave_cesta[$i];



//ATRIBUI CONTEUDO A VAR QUE VAI SER USADO NO EMAIL

$v_produtos .= $_SESSION[cesta][$indice][QTDE]." - ".$_SESSION[cesta][$indice][ARTISTA]." ".$_SESSION[cesta][$indice][ALBUM]." - ".$_SESSION[cesta][$indice][preço]."\n";



//SUBTOTAIS DE CADA PRODUTO

$subtotal = $_SESSION[cesta][$indice][QTDE] * $_SESSION[cesta][$indice][preço];



//TOTAL GERAL

$total += $subtotal;

?>

<tr>

<td height="25"><font face='Arial' size='2'><?php echo $_SESSION[cesta][$indice][QTDE]; ?></font></td>

<td height="25"><font face='Arial' size='2'><?php echo $_SESSION[cesta][$indice][ARTISTA]; ?> - <?php echo $_SESSION[cesta][$indice][ALBUM]; ?></font></td>

<td height="25"><font face='Arial' size='2'>R$ <?php echo $_SESSION[cesta][$indice][preço]; ?></font></td>

<td width="18%" height="25"><font face='Arial' size='2'> R$ <?php echo number_format($subtotal,2,',','.'); ?></font></td>

</tr>

<?php

}//FECHA FOR ?>

<tr>

<td height="25" colspan="2"> </td>

<td height="25" bgcolor="#FF0000"><span class="style5"> Total à pagar: </span></td>

<td height="25" bgcolor="#FFF0F0" class="style2"> R$ <b><?php echo number_format($total,2,',','.'); ?></b></td>

</tr>

</table>



<form name="frmFinalizar" method="post" onSubmit="return finaliza();">

<input type="hidden" name="opc_enviar" value="1">

<input type="hidden" name="v_produtos" value="<?php echo $v_produtos; ?>">

<input type="hidden" name="v_total" value="<?php echo $total; ?>">

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td bgcolor="#FFCC99" class="style2"><div align="center">Dados Pessoais</div></td>

</tr>

</table>



<br>

<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="11%" height="25"><font face="Arial" size="2">Nome:</font></td>

<td height="25" colspan="3"><font face="Arial" size="2">

<input name="txtNome" type="text" size="50" maxlength="50"></font></td>

</tr>



<tr>

<td height="25"><font face="Arial" size="2">Endereço:</font></td>

<td width="45%" height="25"><font face="Arial" size="2">

<input name="txtEndereco" type="text" size="40" maxlength="80"></font></td>

<td width="8%" height="25"><font face="Arial" size="2">Email:</font></td>

<td width="36%" height="25"><input name="txtEmail" type="text" size="40" maxlength="45"></td>

</tr>



<tr valign="bottom">

<td height="50" colspan="4"><div align="center">

<input name="btnEnviar" type="submit" value="Confirmar o pedido de compras >>"></div></td>

</tr>

</table>

</form>



<table width="70%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="47%" align='center'><font face='Arial' size='2'><a href="index.php"><< Página inicial </a></font></td>

<td width="53%" align='center'><font face='Arial' size='2'><a href="carrinho.php"><< Carrinho de compras</a></font> </td>

</tr>

</table><br></td>

</tr>



</table>

</body>

</html>

Prático, não?

Agora vou te passar dois desafios!

Junto ao código fonte, inseri o diretório “calculafrete”.

Este ficheiro tem a finalidade de calcular os fretes para entrega dos produtos.

Pegue o carrinho de compras que acabei de lhe enviar e adapte o sistema de calcular frete nele!

No ficheiro “finalizar.php” deixei um pequeno “bug” (relacionado ao envio dos produtos).

Faça os testes devidos e efetue a correção! Após corrigir, me envie para comandosusa@gmail.com e estarei analisando o código, dando sugestões de melhorias (caso sejam necessárias).

Minha intenção nisso é sair um pouco da Internet e interagir mais com quem acompanha nossas matérias!

Bem… daqui a algumas semanas estaremos retornando novamente este assunto, onde publicaremos as correções e dando maiores informações sobre este tipo de atividade.

Espero que esta matéria lhe ajude! Em caso de dúvidas ou maiores informações sobre esta matéria, é só me escrever no email acima. Ok?

Download do código utilizado neste tutorial: Carrinho de Compras Personalizado ^[4]

Tweet ^[3]

Be Sociable, Share!

^[5]
^[6]
^[7]
^[8]
^[9]

Tweet ^[3]