Buscar este blog

miércoles, 25 de septiembre de 2013

La Tienda Online de tu Salón (1.iii): Instalación de Prestashop


Hoy vamos a hacer la instalación real de la tienda y nos quedaremos un pasito más cerca de estar vendiendo nuestros productos online. Ya hicimos los preparativos necesarios en las entradas anteriores y ahora toca montar de verdad nuestra tienda. Para ello utilizaremos una tienda gratuita llamada Prestashop, la descargaremos en el servidor local que instalamos la semana pasada y comprobaremos que funciona todo perfectamente.

El primer paso será descargar el paquete de instalación de Prestashop desde la página web oficial. Haz clic aquí para comenzar la descarga. Simplemente tendremos que introducir nuestro correo electrónico, seleccionar que somos comerciantes y pulsar el botón verde que dice "Descargar Prestashop V1.5.5" (mirar imagen inferior). La 1.5.5.0 es la última versión a la fecha en que se escribe esta entrada, pero si os aparece una versión superior no pasa nada, descargad la que os muestre esa pantalla. Si no funcionase el enlace, porque hayan cambiado algo en la página de Prestashop desde que se escribió esta entrada, simplemente entrad en www.prestashop.com y buscad el enlace para descargar la tienda.


Suponiendo que todo se haya descargado con normalidad, tendremos en la parte inferior izquierda de nuestro navegador un fichero llamado prestashop_1.5.5.0.zip, que abriremos como hicimos la semana pasada: clic con el botón izquierdo en la fecha, y clic de nuevo con el botón izquierdo en "Abrir".


Si os fijáis en el nombre del archivo que hemos descargado veréis que termina en ".zip". Eso significa que es un archivo comprimido, y cuando hemos hecho clic en "Abrir" lo que realmente se ha abierto es el programa que nos permite descomprimirlo. Yo utilizo Winrar para descomprimir archivos, si no tenéis ningún programa para descomprimir archivos os lo podéis bajar de aquí. Como siempre digo, si hay dudas sobre algún punto de este curso, por favor, dejad comentarios en esta misma entrada y os iré ayudando a todos paso a paso hasta que consigáis tener vuestra tienda funcionando. La ventana que os tiene que salir es algo así:


Nosotros vamos a descomprimir directamente la carpeta llamada "prestashop" en nuestro servidor local, porque es donde la vamos a utilizar para nuestro tutorial, pero si alguno quiere lanzarse y poner su tienda web directamente en internet (si ya tiene un hosting), lo que debe hacer es primero descomprimirla y después subirla a su hosting con un programa FTP como FileZilla. No os preocupéis si esto os parece complicado, insisto en que de momento nosotros vamos a trabajar en nuestro servidor local. Pulsamos por tanto en el segundo botón de arriba, donde pone "Extraer en".
 

Ahora se abre una nueva ventana, que nos pregunta dónde queremos descomprimir los archivos, y hay que tener cuidado porque no podemos dejar la ruta que nos sale por defecto, que nos descomprimiría los archivos en nuestra carpeta de descargas, sino que debemos cambiarla a la carpeta de nuestro servidor local: c:\xampp\htdocs, tal como muestra la imagen. Hacemos clic en el botón "Aceptar" y comienza a descomprimir los archivos. Nos saldrá una ventana mostrando el progreso, que tarda muy poco y volveremos a la ventana de Winrar, que ya podemos cerrar porque tenemos los archivos descomprimidos. ¿Ves qué fácil ha sido?

Ya tenemos la tienda descargada de internet y ya la hemos descomprimido. Ahora solo queda ejecutar el programa de instalación y tendremos nuestra tarea de hoy completada. Vamos a abrir el panel de control XAMPP que instalamos la semana pasada, para iniciar nuestro servidor local. Hacemos clic en el botón de inicio de Windows, después en "Todos los programas", también en "XAMPP" y finalmente en "XAMPP Control Panel".


Se abrirá el Panel de Control de XAMPP, tal como se muestra en la imagen de abajo. Como esto ya lo hicimos la semana pasada voy a ir un poco más rápido. Pulsamos en los botones "Start" de Apache y MySQL:


Tras comprobar que no nos ha aparecido ningún mensaje de error, y que en ambos botones el texto ha cambiado y ahora en vez de "Start" pone "Stop", pulsaremos el botón "Admin" de la segunda fila (MySQL).


Se abrirá nuestro navegador y automáticamente nos llevará al programa de administración de bases de datos de nuestro servidor local. Posiblemente lleves un rato pensando que todo te suena a chino, o que no entiendes nada de lo que estás haciendo. No te preocupes, no es necesario comprender todos los pasos de la instalación para llegar a tener tu tienda online, pero sí quiero explicarte que lo que vamos a hacer es crear una base de datos, donde guardaremos todos los datos de nuestros productos, de nuestros clientes, de las ventas que se produzcan, etc. Haz clic en el menú superior, donde pone "Bases de Datos":


En la pantalla que nos aparece escribiremos el nombre que queremos dar a nuestra base de datos. Yo la voy a llamar "centroesteticacarlos", pero podéis ponerle el nombre que queráis. No utilicéis espacios, tildes, ni la letra Ñ, y os recomiendo que sea todo en minúsculas. Apuntad ese nombre en un papel, porque es fácil que se os olvide y lo vamos a necesitar más adelante. Una vez hayamos puesto el nombre pulsamos el botón "Crear" (nos saldrá un mensaje en verde diciendo que la base de datos se ha creado correctamente).


Ya tenemos todo preparado para empezar con la instalación de Prestashop propiamente dicha. El programa prácticamente hace todo solo, así que será muy sencillo, prácticamente es dar a "Siguiente" todo el rato. Abrimos un navegador y escribimos en la barra de direcciones "http://localhost/prestashop/install" (o haz clic aquí para ir directamente).

La primera pantalla que nos aparece es para darnos la bienvenida y seleccionar el idioma. Nos aseguramos que tenemos seleccionado "Español" y pulsamos en "Siguiente".


La segunda pantalla nos muestra la licencia, es decir, nos dice que es un programa gratuito. Marcamos la casilla "Acepto los términos y condiciones arriba indicados" y pulsamos "Siguiente".


Llegamos a la tercera pantalla y nos aparece un formulario donde nos piden una serie de datos básicos sobre nuestra tienda. Únicamente son obligatorios los que tienen un asterisco rojo al lado. Os pongo lo que voy a poner yo en cada uno de ellos, para que lo tengáis a modo de ejemplo, pero rellenadlos vosotros con los datos de vuestra tienda.
  • Nombre de la tienda: Centro de Estética Carlos (aquí sí podemos poner espacios, tildes y todo lo que haga falta).
  • Actividad Principal: Belleza, Salud y Cuidado Personal.
  • País: España.
  • Nombre: Carlos
  • Apellido: Adrián
  • Dirección de correo electrónico: carlosadrian@nuevavision.es. 
  • Contraseña de la tienda: la que queráis. Tened en cuenta que tiene que tener letras y números, por ejemplo podría ser 000000carlos, pero no 1234.
  • Confirmar la contraseña: la misma que hayáis puesto arriba.
Pulsamos el botón "Siguiente" y llegamos a la cuarta pantalla, donde configuraremos la conexión a la base de datos que hemos creado hace un rato.

  • Dirección del servidor de base datos: dejamos "localhost", como aparece por defecto, porque es el nombre que tiene nuestro servidor local.
  • Nombre de la base de datos: ponemos el nombre que hemos dado a nuestra base de datos cuando la hemos creado (el que apuntaste en un papel).
  • Usuario de la base de datos: dejamos root, porque si lo cambiamos aquí tendríamos que cambiarlo también en MySQL y creo que no merece la pena para un desarrollo local.
  • Contraseña de la base de datos: la dejamos en blanco por el mismo motivo.
  • Prefijo de las tablas: las dos letras que queráis seguidas de un guión bajo. Podéis dejar lo que viene por defecto, pero a mí me gusta cambiarlas por motivos de seguridad. Yo pondré "ec_", de Estética Carlos.
Pulsamos el botón grande que dice "¡Comprueba la conexión de tu base de datos ahora!" para ver que no se produce ningún error y cuando nos aparezca el rótulo verde diciendo "La base de datos está conectada", pulsamos en "Siguiente". Si os aparece algún error, por favor, dejad un comentario en esta entrada del blog y os ayudo a arreglarlo.

En este punto el programa de instalación comenzará a ejecutar todas las tareas necesarias para crear la tienda, y nos irá informando con una barra de progreso. Simplemente esperaremos a que llegue al 100%, pero os aviso ya que esta parte sí tardará un buen rato.


Cuando el programa de instalación haya terminado todas las tareas nos saldrá la pantalla final, en la que nos indica que todo se ha instalado correctamente. Hay dos cosas importantes en esta pantalla:


Os recomiendo encarecidamente que imprimáis la información de inicio de sesión, porque luego siempre se nos olvida el correo y la contraseña que pusimos al instalar, y es necesario saberlos para administrar la tienda.

Abajo nos dice "Por razones de seguridad debe eliminar la carpeta install". Para borrar esa carpeta pulsamos el botón de Inicio de Windows y después "Equipo" (esto puede cambiar dependiendo de vuestra versión de Windows, podría ser Mi PC, Explorador de Windows, etc...). Vamos a c:\xampp\htdocs\prestashop, hacemos clic en la carpeta "install" con el botón derecho y pinchamos en "Eliminar" (con el botón izquierdo ahora). Y nos aparecerá la siguiente pantalla, donde pulsaremos el botón "Sí".


Señoras y señores, ya tienen su primera tienda online instalada, enhorabuena. Supongo que estaréis deseando verla, por lo que podéis abrir un navegador y poner en la barra de direcciones "localhost/prestashop" y os llevará a ella (o podéis hacer clic aquí directamente).

Si habéis entrado a ver cómo ha quedado la tienda os estaréis preguntando qué son todos esos iPod que aparecen ahí. La tienda no se crea vacía, sino que el programa de instalación genera unos cuantos productos de demostración para que veamos cómo quedaría nuestra tienda en funcionamiento. En las próximas semanas iremos sustituyendo esos teléfonos y ordenadores de muestra por nuestras cremas y productos profesionales.

Ha sido una entrada un poco larga, pero ya nos hemos quitado la parte más aburrida. A partir de la semana que viene comenzaremos a personalizar la tienda que hemos instalado con nuestro logotipo, nuestros productos, nuestros textos, nuestras imágenes, etc...

¿Habéis conseguido llegar hasta aquí? Lo más difícil ha pasado, ahora queda lo divertido. ¿Os habéis quedado atascados en algún punto y no habéis sabido continuar? Por favor, os ruego que nos lo comuniquéis y os ayudaremos todo lo que sea necesario.

¡Hasta la semana que viene!


Entradas anteriores:

No hay comentarios:

Publicar un comentario

¡Gracias por tu participación!