1. Code
  2. WordPress
  3. Plugin Development

Cómo Crear una Web de eCommerce Usando WordPress: Parte 2

Scroll to top
7 min read

Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)

Esta es la segunda parte y el final del tutorial sobre eCommerce con WordPress. En esta parte revisaremos los últimos pasos necesarios para completar tu sitio web de eCommerce. Te mostraremos el proceso para añadir un producto a tu web,  cómo usar distintos widgets para mejorarla, cómo usar diferentes informes para llevar un seguimiento de las ventas y a usar shortcodes.

Ya hemos terminado con los ajustes de eCommerce, hemos añadido productos y empezar a vender es como un juego de niños.


Antes de Avanzar

Antes de profundizar en el proceso, echemos una vistazo a algunos de los cambios que hemos realizado en nuestro sitio de eCommerce desde la primera parte de este tutorial.

1. hemos instalado la última versión del tema Liquorice, es decir, Liquorice 2.2 de Nudge Design.

2. Hemos actualizado WordPress a la última versión.

3. Dentro de Ajustes > Tienda > Envío, hemos editado la opción Precio fijo y hemos introducido 0,00 $ en todos los campos. Esto lo hacemos así porque vamos a usar distintas tasas para diferentes productos (sin ninguna tarifa base). Al indicar como precio 0,00 $, mantenemos la funcionalidad habilitada. Si quieres mantener un Precio base que sea añadido al coste de envío de cada producto individualmente, deberías introducir aquí tu Precio de base.

Ahora nuestro sitio web tiene el siguiente aspecto…


Añadir Productos

Veamos algunas útiles opciones antes de añadir nuestro primer productos.

1. La página WooCommerce > Cupones nos permite añadir cupones con un descuento especial a los productos. Aquí puedes indicar el Código del cupón, el Tipo de descuento, la Fecha de caducidad y otras condiciones según precises.

2. La opción Producto > Variaciones te permite añadir variantes u opciones disponibles de tu producto.

Imagina que estás vendiendo camisetas y que quieres especificar las tallas y los colores disponibles. Esta opción te permite definir primero un Conjunto de variaciones y después especificar cada una de las variaciones que contienen. También puedes especificar un precio para cada una de las variaciones.

3. Las opciones que se encuentran dentro de Producto > Etiquetas de producto, te permiten definir, valga la redundancia, las etiquetas para cada producto. Las etiquetas son útiles para las búsquedas de productos que realizamos con el Widget de Etiquetas de producto.


Añadir Categorías de Producto

Antes de añadir un producto, añadamos nuestras categorías de producto desde la página Productos > Categorías.

Cuando añades una categoría tienes que especificar el Nombre, la Categoría padre (si la hay) y una Descripción. Puedes también especificar una imagen destacada y también restringir el acceso a esta categoría según países. Nosotros hemos añadido tres categorías, Flowers (flores), Confectioneries (Confiterías) y Chocolates.


Añadir Tu Primer Producto

La opción Productos > Añadir nuevo te permite añadir productos a tu web de eCommerce.

Aquí tienes que especificar Nombre del producto, Descripción del producto, Etiquetas del producto y categorizar tu producto bajo una de las Categorías creadas. La opción Variaciones te permite añadir las variaciones creadas a este producto.

Ahora tienes que añadir el Precio, Inventario, e Impuesto (si es necesario) del producto. Al añadir el Precio, también puedes especificar un Precio rebajado que se mostrará a los clientes, de esta forma aumentarás su interés.

La opción Descargable se emplea cuando vas a vender productos descargables.

Sube una imagen de producto pulsando el enlace Imagen del producto. Desde aquí puedes cargar la imagen desde tu disco local o seleccionar una imagen de la Biblioteca de medios. También puedes Arrastrar y soltar la imagen directamente sobre esta página.

La parte más importante es en la que se especifican las opciones de envío. Primero debes indicar el Peso del producto y después seleccionar la Clase de envío en el desplegable. Debes haber creado previamente estas clases.

Tras realizar todos los cambios pulsa Publicar.

Ahora tu producto aparece en la sección que se abre desde el menú Productos > Productos. Desde ella puedes editar o eliminar cualquier producto de tu tienda.

Vamos a añadir ahora dos productos más a tu tienda online. 

Efecto Lightbox en la imagen de los productos.

Existe otra forma para añadir productos a tu tienda. Puedes usar la opción de importación de Productos de WooCommerce (CSV) que encontrarás dentro del menú de WordPress Herramientas > Importar. Con esta herramienta puedes cargar múltiples productos a la vez desde un archivo en formato CSV (texto sin formato separado por comas). Después de añadir los productos podrás subir las imágenes e insertar los detalles adicionales.


Usar Algunos Widgets Esenciales

Dentro de Apariencia > Widgets, encontrarás gran número de útiles widgets. Solo tienes que arrastrar y soltar sobre la sección del área de página en la que quieres que aparezca cada uno. Veamos más detenidamente algunos de ellos.

1. Productos recientes - muestra los últimos productos añadidos a tu tienda en la barra lateral (sidebar) o en cualquier otra área en la que lo coloques.

2. Categorías de los productos - este widget mostrará todas tus categorías de producto en la columna lateral. El cliente podrá buscar así fácilmente los productos según la categoría a la que pertenezcan.

3. Productos en oferta - este widget muestra aquellos productos que están en oferta actualmente en tu tienda online.

4. Etiquetas de producto - este widget muestra las etiquetas de producto especificadas en tu columna lateral de forma que el cliente pueda afinar su búsqueda mediante estos términos.

5. Filtrar productos por precio - este widget añade el rango de precios de los productos en tu columna lateral a través del cual el cliente podrá buscar productos según rangos de precios.

6. Carrito - Si has seleccionado este widget, podrás usarlo para mostrar el carrito de compra en tu columna lateral.

7. Texto - Este widget es muy útil si quieres mostrar cualquier anuncio en tu sitio web. También puedes copiar fragmentos de html en él.


Informes

Una vez se hayan vendido productos, podrás ver los informes de ventas Anuales, El mes pasado, Este mes, Últimos 7 días y Personalizado. Dentro del Sumario de ventas podrás conocer las ventas totales realizadas en cada uno de los periodos, así como las Ventas netas. Las ventas Anuales muestran las ventas de cada mes del año y las ventas del Último mes muestra las ventas de El mes pasado con un gráfico por días.

Si abres el panel Pedidos ( menú WooCommerce > Pedidos), verás un listado con todas las ventas del mes actual. A través de este panel podrás ver los detalles de cada venta y procesar los pedidos. Puedes cambiar el Estado del pedido y también añadir un nuevo ID de seguimiento a cada uno de los productos. Pulsando sobre Detalles > Facturación podrás ver los detalles de facturación. También podrás enviar un email al cliente con la factura desde esta misma página.

Ya está, tu web de eCommerce está lista para realizar tu primera venta. Al finalizar la compra, el sistema solicitará al usuario sus datos de Inicio de Sesión o de Registro si es un cliente nuevo.


La Importancia de los Shortcodes

Introducción

Un shortcode en WordPress es un código específico que te permite hacer cosas estupendas con muy poco esfuerzo. A los shortcodes también se les denomina Shortcuts, con ellos podrás incrustar archivos o crear objetos usando simplemente un fragmento de código en lugar de un montón de código ininteligible para los no expertos.

Aquí tienes los detalles de algunos shortcodes importantes que usamos en nuestro sitio web.

El shortcode productspage te ayuda a mostrar un listado completo de los productos y su presentación en la web. Es un shortcode muy importante en los eCommerce de WordPress que se usa en las Páginas de productos, las Categorías de productos y en las Plantillas de un solo producto (single product templates).

El shortcode shoppinhgcart muestra la página o plantilla de finalización de compra en la web.

El shortcode transactionresults muestra la página de pago que muestra los datos del cliente y el sumario del pedido.

El shortcode userlog muestra en la web la página Mi cuenta. Se usa para que los clientes que ya están registrados vean la información relacionada con el historial de sus compras, descargas y otros detalles de su cuenta.

Algunos otros ejemplos de shortcodes:

[wpsc_products product_id='288'] - Muestra el producto cuyo ID es 288
[buy_now_button product_id='198'] - Muestra un botón comprar ahora para el producto cuyo ID es 198.
[add_to_cart=112] - Muestra un botón añadir al carrito para el producto cuyo ID es 112.


Conclusión

Espero que hayas disfrutado ambos tutoriales sobre eCommerce. Esta es solo la punta del iceberg de todo lo que se puede hacer con el plugin Wp eCommerce. En el futuro intentaré crear más tutoriales sobre eCommerce con WordPress.