CÓMO CREAR TU PROPIA TIENDA ONLINE CON

CÓMO CREAR TU PROPIA TIENDA
ONLINE CON PRESTASHOP Y MAGENTO
1
ÍNDICE
1 Introducción al
comercio electrónico
4 Comparativa
2 Prestashop
5 Casos de éxito
3 Magento
6 Repositorios de Aplicaciones
de Software libre
1 Introducción al comercio
electrónico
3
INTRODUCCIÓN
Objetivos del taller :
 ¿Qué es? y principales tipos de comercio electrónico.
 Ventajas del comercio electrónico.
 Herramientas para crear una tienda online:
PRESTASHOP y MAGENTO
- Instalación del programa
- Gestión del contenido de la tienda
 Comparativa entre software :
¿Cuál es más adecuado para mi tienda?
INTRODUCCIÓN
¿Qué es el comercio electrónico?
Consiste en la distribución, venta, compra, marketing y suministración de información
de productos o servicios a través de Internet.
Principales tipos de comercio electrónico :
- B2C (Business-to-Consumer): Empresas que venden al público en general.
- B2B (Business-to-Business): Empresas que hacen negocios entre ellas.
- B2G (Business-to-Government): Empresas que venden al gobierno.
- C2C (Consumer-to-Consumer): Consumidores compran y venden entre ellos.
INTRODUCCIÓN
Ventajas del comercio electrónico
 Expandir la base de clientes al entrar a un mercado más amplio.
 Extender el horario de venta: 24 x 7 x 365 .
 Crear una ventaja competitiva (Ej.: catálogo amplio y detallado)
 Reducir costes de producción, capital, administración, almacén...
 Mejorar la comunicación con los clientes y efectividad de las campañas
publicitarias.
INTRODUCCIÓN
Crear una tienda online
La creación de una tienda virtual en la actualidad es menos compleja gracias a los
diferentes CMS o sistemas de gestión de contenidos (Content Management
System) que fueron apareciendo.
De las diferentes opciones en software libre que existen en la actualidad vamos a
presentar dos de ellas a modo de ejemplo: Prestashop y Magento.
En este caso haremos una instalación local, es decir, vamos a instalar
“la tienda” en nuestro ordenador, para ver una demostración.
En caso de estar interesados en lanzar la tienda, debemos comprar un dominio
(entre 7€ y 50€ año) y un hosting para alojarla (entre 50€ y 200€ año).
2
Prestashop
8
Prestashop
¿ Qué es ?
Prestashop es una herramienta para crear y administrar tiendas on-line de
manera sencilla con más de 310 funcionalidades.
Las características más importantes son:
- No requiere grandes conocimientos para crear modelos y módulos .
- Es Open Source (código abierto – libre de derechos de autor)
Tiene disponible la descarga con kit de instalación.
- Es muy rápido.
- De fácil y sencilla actualización.
- Tiene gran cantidad de plantillas.
- Uso fácil de módulos en el panel de control.
Prestashop
Funcionalidades :
Gestión de catálogos
Gestión de Inventario
Exportación de Productos a eBay y otros
Comparación de Productos
Visualización de productos
Visualización de Cantidades Disponibles
Acercamiento de Productos
Productos Relacionados
Gestión del sitio
Diseño con plantillas personalizables
Elección de Idiomas a Mostrar
Personalización de logos de facturas,
encabezado..
Prestashop
Funcionalidades :
 Marketing
Correos Electrónicos de Seguimiento
Cupones y Vales
 Seguridad
Encriptación de Contraseña y Cookie
Back Office Segura
 Localización/ impuestos
Formato de domicilio de acuerdo al
país
Sincronización de tipo de cambio
 SEO (Posicionamiento en buscadores)
Incremento en rankings
Notificaciones por Correo del Estado de la
entrega
 Envíos y Logística integrados
Descuentos de Envío
Direcciones de Facturación y Envío
Diferentes
 Pagos
Pagos a través tarjeta de crédito, cheque,
transferencia….
Reglas de precio en los carritos de compra
Prestashop
Instalación
Antes de poder instalar y utilizar Prestashop en nuestro ordenador,
debemos instalar un servidor local y crear una base de datos.
PASOS A SEGUIR :
1) Instalar servidor local – WAMP.
2) Crear base de datos y usuario.
3) Descargar e instalar software – PRESTASHOP.
Prestashop
Paso 1: Instalación del servidor local
Para poder instalar nuestra tienda online, requerimos de un alojamiento web o
hosting. Un hosting es un espacio virtual para instalar los ficheros de la aplicación
(sería como el local físico donde montamos nuestra tienda en el barrio)
En este caso, para instalarlo en nuestro ordenador, vamos a utilizar un servidor
local llamado WAMP.
Vamos a la página de descarga www.wampserver.es y escogemos la versión para
nuestro sistema operativo.
Prestashop
Paso 1: Instalación del servidor local
Ejecutamos el instalador.
Aceptamos licencia
Prestashop
Paso 1: Instalación del servidor local
Instalamos en C:
Comienza la instalación
Prestashop
Paso 1: instalación del servidor local
A media instalación nos pedirá que seleccionemos nuestro Navegador
predeterminado, basta con hacer doble click sobre el acceso directo del
navegador.
Y siguiente
Prestashop
Paso 1: instalación del servidor local
La instalación habrá acabado al darle a “Siguiente” y después a “Finalizar”.
Ahora sabremos que nuestro WAMP esta encendido por el icono de la barra de
tareas:
Este icono que aparece en la imagen anterior es el pilar fundamental de WAMP,
con click derecho sobre él accederás a unos menús, con click izquierdo, podrás
acceder a otros menús diferentes.
El servidor estará funcionando cuando el icono esté en color verde.
Prestashop
Paso 2: creación base de datos
Vamos al icono de la
parte inferior de la pantalla y
pulsamos sobre phpmyadmin.
Pulsamos sobre el botón de
“base de datos”
Prestashop
Paso 2: creación base de datos
Y en la pantalla nueva que nos aparece, le damos un nombre
(ej: tienda viveiro) y pulsamos sobre el botón de crear.
Prestashop
Paso 3: Descarga e instalación de Prestashop
www.prestashop.com
Una vez descomprimida, copiamos la carpeta
“prestashop” con todos sus archivos dentro
de la carpeta “www” que se encuentra en el
directorio de WAMP C:\wamp\www\prestashop
Prestashop
Paso 3: Descarga e instalación de Prestashop
Para empezar la instalación tecleamos en el explorador
http://localhost/prestashop.
Prestashop
Paso 3: Descarga e instalación de Prestashop
Metemos los datos de
nuestra tienda y empresa
Escribimos el nombre de la base datos
creado en el paso 2.
Usuario: root (sin contraseña)
Tablas: ps_
Prestashop
Paso 3: Descarga e instalación de Prestashop
Comienza la instalación….
Si todo ha salido correcto,
veremos un mensaje donde
nos muestra el usuario y la
contraseña de acceso
OJO!! Antes de poder entrar en la
tienda, deberemos borrar la
carpeta install que tenemos en
C/wamp/www.
(Es un requisito obligatorio de
seguridad).
¡¡ TIENDA INSTALADA !!
Prestashop
Paso 3: Descarga e instalación de Prestashop
Si tecleamos en el navegador la
dirección ”http://localhost/prestashop”
accedemos a la tienda online y veremos
algunos artículos de ejemplo.
Si queremos entrar en el BackOffice,
escribiremos en el navegador la
dirección
http://localhost/prestashop/adminXXX
(donde las X son un numero aleatorio
que genera la instalación del programa
y podemos encontrar en la carpeta
C/wamp/www/prestashop/admin)
Prestashop
BACK OFFICE
El back-office PrestaShop es el nombre utilizado para describir al panel de
administración de la tienda. Todo lo que el comprador observará es gestionado
directamente desde aquí: añadir/editar/eliminar productos, gestionar
transportistas, construir paquetes, crear vales, mantener contracto con los
clientes, mejorar su tienda, etc.
Prestashop
BACKOFFICE
Estas son las
pestañas más
importantes para
gestionar la tienda.
Podemos ir
navegando por ellas
para familiarizarnos.
Prestashop
BACKOFFICE: Catálogo
Prestashop
BACKOFFICE: Pedidos
Prestashop
BACKOFFICE: Transporte
Prestashop
Eliminar el contenido de la tienda
La instalación por defecto cuenta con una demo de productos
para ayudarle a explorar la organización de una tienda real.
Debe eliminar todos estos elementos con el fin de comenzar su tienda de forma
limpia.
Antes de eso vamos a desactivar el modo demo en: Preferencias/mantenimiento.
Prestashop
Eliminar el contenido de la tienda
Módulos / módulos y buscamos “limpiador”. Lo instalamos.
A continuación entramos a configurar.
Prestashop
Eliminar el contenido de la tienda
Una vez dentro del módulo nos aparece para eliminar todo el catálogo de
productos y para eliminar los pedidos y clientes. Si queremos eliminar el
catálogo de productos marcamos la casilla "SI" en su lugar correspondiente
y hacemos click en "Borrar catálogo". Lo mismo con pedidos y clientes.
Si todo ha ido correctamente nos devolverá el
mensaje "Catálogo truncado“.
(Lo mismo con pedidos y clientes).
Prestashop
Configuración de la tienda
AJUSTE
DESCRIPCIÓN
DONDE ENCONTRARLO
NOMBRE
Define tu marca , sobre todo en los motores de
búsqueda.
Menú " Preferencias “/ Contactos de la
tienda / Información de contacto , editar la
opción " Nombre de la tienda " .
LOGO
Define su marca visualmente. Aparece en
la parte superior izquierda de cada pagina de su
tienda, en e-mails automáticos y facturas.
Menú "Preferencias”/ "Temas".
MONEDA
La moneda en la que desea establecer el precio
por defecto para sus productos
Menú "Localización", nuevamente
"localización".
INFORMACIÓN
ATENCIÓN
CLIENTE
Un bloque para indicar el numero de teléfono de
su servicio al cliente, y un botón para que le
envíen un e-mail. Se vera en la columna de la
derecha del front-office.
Ir a módulos y buscar Contact block y
pulsar configurar.
INFORMACIÓN
DE LA EMPRESA
Y DATOS DE
CONTACTO
Un bloque para presentar su dirección de
contacto, el numero de teléfono de su servicio
al cliente, y un enlace para que le envíen un email. Se vera en el pie de pagina del frontoffice.
Ir a módulos y buscar Block contact info y
pulsar configurar.
Un bloque para presentar una imagen con un
enlace a otro sitio. Se vera en el front-office, a la
izquierda.
Ir a módulos y buscar Advertising block y
pulsar configurar.
PUBLICIDAD
Prestashop
Configuración de la tienda
AJUSTE
DESCRIPCIÓN
DONDE ENCONTRARLO
IMAGE SLIDER
El Slider presenta varias imagenes, Se vera
desplazamiento de las imagenes una despues
de la otra. Suele colocarse al frente y centro
de la pagina de inicio.
Ir a módulos y buscar Image slider for your
homepage y pulsar configurar.
CMS
El contenido de las paginas estaticas, como
"About Us", "entrega", "Aviso Legal", "Terminos
y Condiciones", y "Pago Seguro".
Ir a "Preferencias", "CMS", a continuaci6n,
editar y crear paginas como desee.
REDES SOCIALES
Un bloque para presentar Facebook, Twitter y feed
RSS. Por defecto, todos estos enlaces conducen a
sitios propios de PrestaShop.
Ir a módulos y buscar Social networking
block
y
pulsar configurar.
TOP MENÚ
Indica categorias a las que el visitante puede ir,
asi como enlaces a otros lugares (blog)
Ir a módulos y buscar Top horizontal
menu
y
pulsar configurar.
Contenido demo: textos, imagenes, enlaces, etc
Ir a módulos y buscar Theme configurator y
pulsar configurar. Principalmente, le
permite cambiar (botones sociales para
compartir, banner superior, logotipos de
pago, etc) También permite
agregar
facilmente imagenes / cambios en su
home- page.
CONTENIDO DE
LA PÁGINA DE
INICIO
Prestashop
Ejemplo Logo: Preferencias / Temas
Nuestro Logo
Prestashop
Ejemplo Image Slider: Módulos / HomeSlider / Configurar
Aquí seleccionamos las fotos que nos aparecerán en movimiento en el front-office.
Prestashop
Ejemplo métodos pago: Módulos / Métodos de pago
En este módulo
elegiríamos los
diferentes
métodos de pago
de nuestra tienda
on-line
Prestashop
Ejemplo categorías: catálogo / categorías
Nombre: nombre de la categoría que estamos creando.
Categoría Padre: Aquí debemos elegir la categoría superior. Es decir, ”marisco”
será la categoría padre de “camarón” o “pescado” será la categoría padre de “sardina”.
Descripción: explicamos lo que ofrecemos dentro de esta categoría.
Imagen: Podemos subir una imagen para identificar la categoría.
Meta--título: Título que aparecerá en el recuadro del buscador.
Meta descripción: Texto que aparecerá en el recuadro del buscador.
Prestashop
Ejemplo productos: Catálogo / Productos
En este módulo
introduciríamos
los diferentes
productos de
nuestro catálogo.
Prestashop
IMPORTANTE:
En “Módulos” nos aparecen los que vienen ya instalados por defecto, pero tenemos
muchos que podemos instalar para personalizar la tienda y adaptarla a nuestros gustos.
Cuando ya están instalados, para utilizarlos pinchamos en “configurar”.
Prestashop
IMPORTANTE:
Cuando navegamos por las pestañas, en la parte derecha siempre vamos a tener
una explicación a cerca de la categoría donde estamos. Nos dan información de la
función de esa categoría y consejos para configurarla.
Prestashop
Iremos haciendo cambios hasta tener toda la tienda configurada con sus productos,
precios, medios de pago, transportistas, etc.
Una vez tengamos todo esto hecho,
¿ Cómo damos vida a nuestra tienda ?
Tendremos que migrar la tienda de servidor local a un hosting (en internet)
Prestashop
Lo primero será hacer una copia de seguridad tanto de los ficheros de la
tienda Prestashop, como de la base de datos.
Para ello ,necesitaremos exportar la base de datos. Lo hacemos a través
de phpMyAdmin.
A continuación veremos el siguiente pantallazo
Seleccionamos
formato SQL
Prestashop
Una vez tenemos una copia de la base de datos y también de los ficheros de la tienda
(la carpeta donde está instalado prestashop), el siguiente paso es acceder al hosting
que hayamos contratado para alojar la tienda.
Dependiendo de cuál hayamos escogido, la importación de los datos se hará de una u
otra forma. En este caso tenemos que contactar con nuestro proveedor para que nos
facilite este trabajo.
3
Magento
45
Magento
¿Qué es?
Es también un software Open Source, que permite su libre desarrollo y
distribución, aunque solo en una de sus versiones, pudiendo elegir también
otras versiones de tipo propietario que tendremos que pagar.
Recomendamos el uso de Magento para empresas o proyectos de gran tamaño,
o que por lo menos tengan vistas a que sean así, ya que es una plataforma que
necesita bastantes recursos y necesitaréis un servidor dedicado
si recibís muchas visitas, lo cual aumenta el coste de vuestro proyecto.
Magento
Características:
•Herramientas de Marketing
Cupones flexibles con la habilidad de
restringir su uso a tiendas, grupos de
clientes, periodo de tiempo, productos y
categorías.
•Estadísticas / informes
Panel de control para Revisión de Reportes y
Estadísticas. Reporte sobre Cesta de Compra
no completada. Reporte de Mejores Clientes
por numero de pedidos y total.
•Optimización SEO para buscadores
Google Site Map. Re-escritura de direcciones
web que permite el control total de las
paginas. Meta-información para productos y
categorías.
•Completa gestión de la tienda
Control de múltiples paginas y
tiendas desde un Panel de
Administración Central.
•Gestión del catálogo
Importación y Exportación de
catalogo de un golpe. Soporte para
precios especiales.
•Visualizando el catálogo
Navegación por capas para filtrado
de productos dentro de Resultado
de Búsqueda. Comparación de
Productos.
Magento
Características:
• Compra
Finalizar Compra en una pagina. Finalizar Compra
sin tener cuenta o con cuenta de Invitado.
•Formas de pago
Soporte a un gran abanico de métodos de pago.
Autorización y captura de fondos configurable.
•Servicio al cliente
Cuentas de Cliente con múltiples opciones. Rastreo
de Pedido desde la Cuenta.
•Móvil e-commerce
Optimizado para iPhone y otros smartphones.
•Internacionalización
Multilingüe. Soporte para Múltiples Monedas.
Magento
Instalación:
PASOS A SEGUIR:
1) Instalar servidor local – WAMP
2) Crear base de datos.
3) Descargar e instalar software – MAGENTO
La instalación de WAMP ya hemos visto cómo se realiza, así como la
creación de la base de datos por lo que pasaremos directamente a la
descarga e instalación del programa MAGENTO.
Magento
Paso 3: Descarga e instalación de MAGENTO
www.magentocommerce.com
A día de hoy la última versión es 1.9.1.0.
Magento
Paso 3: Descarga e instalación de MAGENTO
Buscamos la versión “Full Release”
Es la última versión estable, por lo que Magento nos indica que va a funcionar
correctamente.
Es necesario registrarse para descargarlo.
Igual que hemos hecho con
Prestashop, vamos a
descomprimir el archivo RAR en
la carpeta que WAMP usará
como raíz de nuestro servidor
local, que por defecto es
C:/wamp/www/magento
Magento
Paso 3: Descarga e instalación de MAGENTO
Para comenzar las instalación,
accedemos desde nuestro navegador
al directorio
http://localhost/magento
En la siguiente pantalla escogemos el
idioma, la zona horaria y la moneda
por defecto
Magento
Paso 3: Descarga e instalación de MAGENTO
- Tipo de base de datos : MySQL.
- El host: localhost.
- Nombre base de datos: el que habíamos
creado.
- Usuario root y sin contraseña.
Magento
Paso 3: Descarga e instalación de MAGENTO
Introducimos
nombre,
apellidos y mail.
Y creamos un
usuario y
contraseña para
administrar el
backend.
Magento
Paso 3: Descarga e instalación de MAGENTO
TIENDA INSTALADA!!!!
Magento
FRONTED: http://localhost/magento
Al contrario que Prestashop,
la tienda está vacía.
Magento
BACKEND
Para entrar en el panel de control:
http://localhost/magento/index.php/admin
Usuario
Contraseña
Magento
BACKEND
COMPARATIVA
•Prestashop fue lanzado en 2007, siendo en la actualidad una de las soluciones de
comercio electrónico más populares en todo el mundo. Más de 4 millones de
descargas, 500.000 miembros en su comunidad, más de 150.000 tiendas online y se
utiliza en más de 150 países.
•Magento es una solución propiedad de eBay Inc. Su característica más notable es la
completa flexibilidad, robustez y control que ofrece al usuario, aunque eso implica
mayor dificultad de implantación, instalación y manejo. Habitualmente es la
solución de comercio electrónico preferida por las grandes marcas.
COMPARATIVA
Ventajas de Prestashop :
Ventajas de Magento:
- Sencillez en instalación y uso.
- BackOffice sencillo e intuitivo.
- Rapidez de carga de las páginas.
- Consume menos recursos por lo que no es
imprescindible contar con un hosting dedicado.
- Muy personalizable.
- La Comunidad de Prestashop es muy activa
-Un BackOffice muy completo y potente.
- Tiene soporte técnico.
- Sistema robusto y seguro.
- SEO onPage potente y sencillo.
- Sistema de compra más sencillo y
menos estricto.
- Gestión multitienda
COMPARATIVA
Desventajas de Prestashop :
Desventajas de Magento :
-La mayor parte de módulos y plantillas para
personalizar nuestra tienda, son de pago.
- Dificultad de implantación, instalación y
manejo.
- Demanda bastantes recursos por lo que se
hace casi imprescindible contratar un servidor
dedicado.
- Aunque dispone de soporte técnico, la
comunidad Magento en Español no es muy
numerosa.
- Costes de personalización más elevados
debido a la complejidad del sistema.
-No dispone de soporte técnico.
-SEO onPage no tan potente, aunque parece
que ha habido importantes cambios en la
versión 1.6
- No dispone de sistema multitienda.
COMPARATIVA
Conclusión: ¿Cuál es el más adecuado para mi tienda ?
Nos tenemos que preguntar:
¿Estoy decidido a tener un negocio online o quiero probar a ver si puede ser
una vía de negocio?
-‘Sí, lo he valorado y creo que mi futuro está en Internet‘
Magento.
- ‘Me gustaría probar si la venta online puede ser rentable’
Prestashop.
En general, las necesidades que se derivan de la primera opción (unir con
sistemas externos, una inversión mayor, grandes volúmenes de visitas, etc.)
pueden evitarse si sólo se quiere probar el comercio online.
En el segundo caso, normalmente el presupuesto disponible será menor y con
presupuestos bajos se puede sacar mayor partido a Prestashop, aunque para
proyectos grandes, puede quedarse un poco corto.
5
Casos de éxito:
63
CASOS DE ÉXITO
Tiendas online con Prestashop: www.roxy.es
CASOS DE ÉXITO
Tiendas online con Prestashop: www.jorgelarrañaga.com/es
CASOS DE ÉXITO
Tienda online con Magento: www.candydirect.com
CASOS DE ÉXITO
Tienda online con Magento: www.dyepaintball.com
6
ANEXO: Repositorios de aplicaciones de software
libre
68
REPOSITORIOS DE APLICACIONES
DE SOFTWARE LIBRE
Repositorios de aplicaciones de software libre
www.opencart.com
www.oscommerce.com
www.virtuemart.net
www.prestashop.com
www.zen-cart.com
www.magento.com