Carrito de compra en PHP, MySql y forma de pago Paypal (Parte 5.1: Scripts necesarios para un carro de compra en PHP y MySQL)

Comenzamos la parte que seguro todos estabais esperando, nos adentramos en el código de un carrito de compras con PHP y MySQL.

Un carrito de compra funciona básicamente de la siguiente forma:

1. El usuario entra en la web y se crea una sesión nueva.
2. El usuario añade un producto al carro de la compra.
3. Una página PHP recibe los datos y lo almacena en variables de sesión.
4. PHP redirecciona a otra página que muestra los datos del carro al Usuario dándole la opción de seguir comprando o bien realizar la compra.
5. Una vez el usuario está conforme con el carro de la compra y la cantidad de productos, realiza la compra.

Iremos viendo esta 5ª entrega del tutorial en distintas partes para que no se haga pesado y se concentre todo en un mismo POST.

Diseño y estructura en el código de la interfaz

Vamos a dar una breve explicación de cómo estructuraremos la página donde mostraremos los productos, la cual la construiremos de manera modular al igual que todo el resto de la interfaz, ¿Y esto que significa?, pues para que me entendáis, vamos a dividir la página en 9 archivos distintos para tener un código más usable y no tener que repetir las mismas líneas en cada una de las páginas, siendo más fácil su modificación.

La interfaz se compondrá de los siguientes archivos:

• main.css: Hoja de estilos de la página.
• conecta.php: Nos conecta con la base de datos. Este archivo tenéis que modificarlo según vuestros datos de acceso «host», «user», «pass».
• meta_tags.php: Incluye las etiquetas de inicio de html, meta tags y enlaces a las hojas de estilo.
• cabecera.php: Parte superior de la web, con el título y lo que se quiere añadir
• izquierda.php: En nuestro tutorial no lo usaremos, aunque no lo descarto para una futura versión ampliada del mismo, en el que crearemos un diseño algo más elaborado.
• pie.php: Incluye la parte del CopyRight o cualquier cosa que se quiera poner fuera del cuerpo.
• cierra_tags.php: Como su nombre indica, cerramos las etiquetas body y html
• productos.php: Una de las páginas más importante del tutorial donde se muestran todos los productos que vamos a «vender».
• carro.php: Esta página mostrará la cesta de la compra y podremos aumentar y disminuir la cantidad de productos.

Os voy a dejar un archivo llamado «carroCompras.rar» en el que está la base de la interfaz, la cual iréis modificando según vayamos avanzando en el tutorial, para ello hacer clic en el siguiente enlace:

Como habréis podido observar el diseño no es el fuerte de este carro de compras, de lo que se trata en este tutorial es de tener unos conocimientos básicos de PHP sobre este tema para después poder ir ampliándolo a vuestro antojo.

Una vez disponemos de nuestra base de archivos, vamos a empezar a codificar nuestro carro de la compra:

productos.php

En esta página se mostrarán los productos que hayamos dado de alta en la tabla “productos”. Para el tutorial, hemos dado de alta unos cuantos y aquí tenéis el código para que vosotros también podáis incluirlos en vuestra base de datos. (importar estas líneas de código en la paret SQL de phpmyadmin)

[mysql]
INSERT INTO `productos` VALUES (1, ‘Diseño Web Estática’, 850.00);
INSERT INTO `productos` VALUES (2, ‘Desarrollo CMS PHP y MySql’, 2150.00);
INSERT INTO `productos` VALUES (3, ‘Diseño Logo’, 210.00);
INSERT INTO `productos` VALUES (4, ‘Diseño Web (PSD)’, 540.00);
INSERT INTO `productos` VALUES (5, ‘Formulario de Contacto’, 52.00);
INSERT INTO `productos` VALUES (6, ‘Registro de Usuarios’, 42.00);
INSERT INTO `productos` VALUES (7, ‘Animación Flash’, 120.00);
INSERT INTO `productos` VALUES (8, ‘Carrito de Compra’, 590.00);
INSERT INTO `productos` VALUES (9, ‘Alojamiento Web’, 34.00);
INSERT INTO `productos` VALUES (10, ‘Dominio’, 9.00);
[/mysql]

Ahora que tenemos los registros necesarios, es hora de mostrarlos en nuestra página de productos.

¿Qué necesitamos en este archivo?

1. Iniciamos sesión
2. Conectar con nuestra base de datos
3. Acceder a la tabla productos y seleccionarlos
4. Mostrar tabla con Productos, Precio

La página debe quedar como os presento en esta imagen (Clic para ampliar):

Si habéis descargado los archivos de la interfaz, es hora de abrir «productos.php» porque vamos a añadir algunas líenas.

Para empezar, lo primero que tenemos que hacer es iniciar sesión, asi que antes de definir la variable $titulo, pondremos lo siguiente:

[php]
//Iniciamos sesión o continuamos la que ya exista
session_start();
[/php]

Algunos estaréis pensando ¿Qué es una sesión en PHP?, pues a pesar de lo que podáis pensar, no es una serie de temas unidos creados por un DJ (bromas a parte). Cuando hablamos de sesión en PHP hablamos de un entorno que consiste en controlar el acceso individual a una página o grupo de páginas por medio de un identificador único por visitante/usuario.

Para que me entendáis, imaginaros que no existieran las sesiones ni las cookies (otra forma de hacerlo, pero que no aconsejo pues hay navegadores que lo tienen desactivado) y entráis en una tienda virtual como puede ser la de Nike. Si nos vamos a la zona de productos y añadimos un producto para después seguir navegando por la web y buscar otro, cuando queramos añadir un segundo producto, al no tener sesiones activas en el sistema, no podrá recordar los productos que ya hemos elegido con anterioridad, perdiendo así los datos.

Por tanto el uso de sesiones es imprescindible para montar una carrito de compra online.

Una vez que conocemos para que sirven las sesiones, vamos a ver como se almacenarán los datos en las variables de sesión.

Crearemos un array bidimensional para almacenar el producto y la cantidad, de todos los productos que se vayan añadiendo al carrito de la compra. Para hacernos una idea más gráfica lo plasmaremos en una tabla:

INDICE	PRODUCTO (id)	CANTIDAD
0	10	1
1	8	3
2	4	1

Si aun así no os aclaráis os muestro una imagen de ejemplo de nuestra aplicación que seguro os hará entenderlo:

Si os fijáis en la cesta de la compra del ejemplo de la imagen de arriba hay 2 productos, en concreto se han añadido a la cesta 3 “Desarrollos CMS PHP y mySQL” y 5 Diseños Web (PSD). En el array que os muestro, se ve claramente el ID del producto y su cantidad, que es con lo que vamos a “jugar” en todo momento dentro de nuestros archivos «prodcutos.php» y «carro.php«.

Después de esta pequeña explicación sobre sesiones en PHP y cómo utilizarlas en nuestra aplicación, vamos a seguir con el código.

Una vez que tenemos nuestra sesión iniciada, tenemos que mostrar los productos en nuestra página, así que hay que conectar nuestro archivo PHP con la tabla de productos. Esto se consigue gracias al archivo que hemos incluido «conecta.php» (acordaros de poner vuestras credenciales), lo único que nos faltará será definir la sentencia SQL que nos devolverá lo que queremos:

[php]
//Sentencia SQL para obtener los productos de la tabla prodcuto
$resultado = mysql_query(«SELECT id, producto, precio FROM productos»);
[/php]

Bien, ya hemos definido la sentencia, la cual sólo recoge los campos id, producto y precio (utilizar «SELECT *» en este caso es una manera absurda de sobrecargar nuestra base de datos, ya que los demás campos no nos hacen falta para nada), ahora quedaría mostrarlos por pantalla.

Como hay más de un registro en la tabla productos tendremos que hacer uso de un bucle como puede ser la sentencia «while«, asi que justo después de definir las cabeceras de la tabla (que ya tenemos en el archivo que hemos descagado), vamos a realizar dicho bucle de la siguiente manera:

[php]
// comienza un bucle que leera todos los registros y ejecutara las ordenes que siguen
while ($productos = mysql_fetch_array($resultado)) {
echo «

» . $productos[‘id’] . «

«; // id del producto que no se verá por pantalla
echo «

» . $productos[‘producto’] . «

«; // imprime el nombre del producto
echo «

» . $productos[‘precio’] . » €

«; // imprime el precio
echo «

«;
echo «

«;
} // fin del bucle de ordenes
[/php]

Aquí tenemos bastantes cosas que explicar. Como veis el bucle recorrerá uno por uno los registros que se han recogido de la sentencia SQL guardándolos en un array que hemos llamado «$productos«. Cada uno de los campos se guardará en el array tal y como lo hemos nombrado en la sentencia SQL, es decir, cada registro se guardará en las siguientes variables del array:

• $productos[‘id’]
• $productos[‘producto’]
• $productos[‘precio’]

Una vez tenemos impreso el id (aunque este lo hacemos invisible al navegador gracias al estilo display:none), el nombre del producto y el precio, falta por asignar en enlace en forma de imagen donde el usuario hará clic para añadir o eliminar de la cesta según ya lo haya añadido o no.

Como podéis apreciar en el enlace que generamos, vamos a pasarle a la página «carro.php» un enlace con la siguiente estructura:

Ejemplo: carro.php?id=2&action=add

Este enlace lo que hace es pasarle el id del producto (en el caso del ejemplo sería el 2) y como variable acción el valor add, con lo cual le estamos diciendo al archivo carro.php, que añada a la cesta el producto número 2 (id=2 de la tabla productos).

Con esto ya tenemos el archivo «productos.php» casi completo, acordaros que faltaría añadir la funcionalidad para que muestre un icono de añadir o un icono de eliminar según si se haya añadido o no el producto en la cesta.

En la próxima parte del tutorial (5.2) explicaremos el archivo «carro.php» y ya sabéis que podéis hacer cualquier pregunta al respecto e intentaré respondérosla lo más pronto posible.

Guía Carrito de Compra en Php con forma de pago Paypal

• Parte 1: Introducción
• Parte 2: ¿Qué nos hace falta?
• Parte 3: Diagrama de Flujo
• Parte 4: Base de datos de un carro de compra
• Parte 5.1: Scripts necesarios para un carro de compra en PHP y MySQL
• Parte 5.2: Scripts necesarios para un carro de compra en PHP y MySQL
• Parte 6: Añadir PayPal como método de pago a nuestro carro de compra
• Parte 7: Factura y envío de e-mail al comprador
• Parte 8: Descarga de archivos