1. Code
  2. WordPress
  3. Plugin Development

Guía para Iniciarte Con WooCommerce: Configuración Inicial

El eCommerce se ha convertido en un fenómeno masivo, muchos de nosotros lo usamos y ls ventas globales de eCommerce en el 2013 han alcanzado los $1,25 trillones. Durante los últimos años ha sido fácil crear tu primer tienda de eCommerce con productos como ZenCart, Open Cart, OSCommerce y Magento. WordPress tiene varias opciones para el comercio electrónico, pero ninguna ha destacado como un sistema de suficiente calidad para las empresas que necesitan vendedor en serio.
Scroll to top
This post is part of a series called Getting Started With WooCommerce.

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

El eCommerce se ha convertido en un fenómeno masivo, muchos de nosotros lo usamos y ls ventas globales de eCommerce en el 2013 han alcanzado los $1,25 trillones. Durante los últimos años ha sido fácil crear tu primer tienda de eCommerce con productos como ZenCart, Open Cart, OSCommerce y Magento. WordPress tiene varias opciones para el comercio electrónico, pero ninguna ha destacado como un sistema de suficiente calidad para las empresas que necesitan vendedor en serio.

Hoy te voy a hablar de un producto que ha cambiado esto y que ha puesto a WordPress a la cabeza como fuerte competidor dentro de las plataformas para eCommerce. Dile Hola a WooCommerce En las dos primeras partes de esta serie vimos la instalación y la configuración inicial a través de las diferentes opciones disponibles. En nuestro segundo tutorial vamos a ver cómo añadir nuestros primeros productos así como a aplicar un tema y estilos a WooCommerce.


Dile Hola a WooCommerce

WooCommerce es un plugin de código abierto de e-commerce para WordPress creado por los chicos de WooThemes. Ofrece una plataforma estable y segura construida sobre el Núcleo de WordPress que consigue que sea muy fácil personalizarlo conforme a tus necesidades. Lanzado en el 2012, y ha alcanzado alrededor de más de tres millones de instalaciones activas y se está convirtiendo en el plugin de elección para muchos desarrolladores WordPress, entre los que me incluyo.

Say Hello to WooCommerceSay Hello to WooCommerceSay Hello to WooCommerce

WooCommerce adopta un enfoque "gratuito", el núcleo del plugin se ofrece de forma completamente gratuita, aunque algunas de las extensiones para WooCommerce se venden a un determinado precio. Este modelo funciona bastante bien ya que te permite ponerte en funcionamiento con un plugin que contiene practicamente todo los que la mayoría de los usuarios necesita, y sólo se cobra por extensiones más complejas como podrían ser funciones adicionales o pasarelas de pago. Personalmente he construido varios sitios que usan WooCommerce durante el último año y sólo he necesitado una extensión "premium" en un par de ocasiones.

Sin más preámbulos vamos a saltar y comenzar, sólo voy a mirar el núcleo del plugin para empezar y tratar de demostrar lo fácil que es comenzar a usar este plugin de código abierto.


Instalación y Configuración Inicial

La instalación es tan sencilla como la de cualquier otro plugin para WordPress. Tienes 2 opciones:

  • Subir los Archivos Vía FTP o SFTP
    1. Visita el la Página del Plugin WooCommerce en el Repositorio WordPress.org y haz clic en descargar. Esto iniciará la descarga de la última versión en tu equipo local.
    2. Extrae el archivo zip descargado y descomprímelo usando tu aplicación preferida.
    3. Conecta con tu sitio WordPress mediante FTP o SFTP (SFTP FTW!) y dirígete a wp-content/plugins/.
    4. Carga el plugin woocommerce extraído a la carpeta wp-content/plugins/.
  • El Escritorio de WordPress
    1. Inicia sesión en el Escritorio de tu WordPress.
    2. Desplázate hasta Plugins -> Agregar Nuevo.
    3. Búsca "WooCommerce".
    4. Los primeros resultados deberían ser "WooCommerce - excelling eCommerce". Pulsa instalar ahora.
    5. Dependiendo de tu configuración puede que te pida tu nombre de usuario y su contraseña de FTP.
    Installing WooCommerceInstalling WooCommerceInstalling WooCommerce
  • Activación del Plugin
    • Si subiste tus plugin vía FTP/SFTP ahora tendrás que navegar hasta "Instalar Plugins" en el Escritorio de WordPress. Encuentra WooCommerce en la lista y haga clic en activar.
    • Si descargaste el plugin a través del Escritorio de WordPress verás el mensaje "El plugin WooCommerce - excelling eCommerce 1.6.6 ha sido correctamente instalado." (¡La versión puede variar dependiendo de cuando estés leyendo esto!), simplemente haz clic en activar el Plugin. (Si ya estás lejos de esta página puedes sencillamente seguir el paso anterior, navegando por tu página de Plugins instalados para activarlo.)
  • Configuración de las Páginas - deberías ver un bonito banner color magenta "Bienvenido a WooCommerce, estás casi listo para empezar a vender :)". WooCommerce necesita crear algunas páginas para funcionar, él puede crearlas de forma automática por ti, simplemente haz clic en "Instalar las Páginas de WooCommerce". (Puedes cambiar los nombres de las página más adelante si quieres).

Eso es todo, ¡Ya tienes WooCommerce instalado! Ahora deberías revisar la página de configuración de WooCommerce. Aquí es donde configurarás tu tienda. Vamos a ver todos los pasos de la configuración inicial.

Configuración General

Lo primero que debemos hacer es configurar donde estamos (ubicación) y nuestra moneda. Se trata de simples menús desplegables y también verás un tercer menú desplegable para limitar los países a los que deseas realizar envios. Actualmente sólo puedes establecer una moneda, lo que puede constituir un problema para algunos vendedores internacionales, sin embargo, hay una extensión para realizar la conversión de moneda dinámicamente en tu tienda utilizando Open Source Currency Exchange API. Esto sólo servirá como guía para los visitantes, pero los pagos todavía se realizarán en la moneda base establecida en la configuración general. Se trata también una extensión de pago.

WooCommerce SettingsWooCommerce SettingsWooCommerce Settings

A continuación tenemos algunas opciones para los procesos de pago y la cuenta. Aquí puedes configurar cosas como permitir desprotecciones de los invitados (de forma que no necesiten registrar una cuenta en tu web), puedes forzar en uso de SSL para las páginas de pago (especialmente útil si tu pasarela de pago requiere este certificado), si deseas activar cupones (veremos mejor esto más adelante). También puedes configurar algunas funciones para las cuentas, como permitir el registro a los usuarios sin la necesidad de realizar ningún pedido, si deseas utilizar los emails como nombres de usuario y si quieres o no ocultar el panel de administración de WordPress a los clientes. Todo esto depende de tus preferencias personales y podrás añadir o quitar estas opciones siempre que quieras. Las opciones por defecto son un buen punto desde el que empezar, yo por ejemplo nunca permito el acceso del cliente a la administración de WordPress.

Más abajo tenemos algunas opciones de estilo y scripts. Puedes activar el CSS predeterminado de WooCommerce y realizar modificaciones al estilo a partir de ahí o deshabilitarlo por completo. Veremos los detalles sobre esto más adelante. También te tienes un par de opciones para la interfaz de usuario incluyendo un agradable efecto Lightbox que yo generalmente habilito.

Por último en esta página tenemos nuestras opciones para las descargas digitales. Con WooCommerce  podrás vender fácilmente productos virtuales y descargables, y estas opciones te permiten definir cómo deben ser gestionados y cómo conceder acceso a los mismos. Las opciones se explican por sí mismas bastante bien, como casi todas las configuraciones de WooCommerce.

Configuración del Catálogo

La mayoría de estas opciones se comprenden fácilmente, pero una que vale la pena revisar con calma es la opción "Mostrar" para las subcategorías. Estas tres casillas de verificación pueden afectar realmente el aspecto final de tu tienda. Si activas estas casillas tu página principal mostrará las categorías en lugar de los productos. Esto es realmente útil ya que hace que el sitio tenga un aspecto más propio de un e-commerce, mostrar simplemente un montón de productos uno tras otro puede dificultar bastante la navegación entre las categorías o tipos de producto y te obligaría a depender del uso de widgets de WooCommerce para mostrarlas.

WooCommerce Catalog SettingsWooCommerce Catalog SettingsWooCommerce Catalog Settings

La información del producto es una sección que también es importante revisar, te ofrece la opción para mostrar u ocultar algunos campos en tus productos, te toca decidir si necesitas esos campos y activar o desactivarlos según tus necesidades. Asimismo, debajo están las opciones para ocultar las valoraciones. De nuevo, la decisión de permitir comentarios sobre los productos depende de ti, pero no cabe duda de que es una buena idea que WooCommerce te dé la opción de activar o desactivarlos.

Si saltamos a la parte inferior veremos las opciones para la imagen. Aquí puedes ajustar las dimensiones de la imagen de tus productos, se trata en esencia de los tamaños de imagen para el tipo de entrada personalizada del producto que WooCommerce crea para ti. Las imágenes del catálogo hacen referencia al estilo de las páginas de archivo que muestran una sola imagen por producto y las miniaturas de los mismos que son exactamente lo que dicen ser. Si cambias el tamaño de la imagen después de haber agregado los productos, necesitarás regenerar tus imágenes usando un plugin como Regenerate Thumbnails ya que al igual que sucede co todos los demás medios en WordPress, los tamaños de imagen adicionales se crean durante la carga basandose en estos valores.

Otros Ajustes

Ahora voy a repasar más rápidamente otras opciones ya que la mayoría se explican bastante bien por sí mismas. Te recomiendo que configures tu sitio WordPress en local y juegues durante un rato con WooCommerce para revisar las diferentes opciones.

  • Ajustes de Página - ¿Recuerdas que durante la activación del plugin creamos algunas páginas? Bien, pues aquí es donde puedes cambiarlas. Puede sencillamente actualizar las páginas ya creadas (que encontrarás junto con todas las demás páginas de tu sitio) o puedes crear unas nuevas páginas y enlazarlas desde aquí. También puedes desde aquí cambiar su estructura de los enlaces permanentes de la tienda, aunque personalmente nunca he tenido esa necesidad.
  • Ajustes de Inventario - Otra pequeña y sencilla página. Básicamente, ¿deseas habilitar la gestión del stock o no? Si lo haces, dispones de algunas opciones sobre qué hacer en el momento en el que estés bajo de stock, etcétera.
  • Ajustes para Impuestos - Define las reglas de tus impuesto a través de múltiples clases para los mismos, así como para los impuestos locales. Particularmente útil cuando vendes a nivel internacional. Como sucede con todos los ajustes puede que lo necesites o no, deshabilitarlo es tan simple como desmarcar la casilla de verificación.

Así que afortunadamente ya tenemos WooCommerce instalado y hemos revisado los ajustes de instalación inicial. Aunque todavía nos falta realizar un poco de trabajo antes de que podamos comenzar a añadir nuestros productos.


Configuración de los Envíos

WooCommerce viene con una gama de opciones de envío integradas e incluso te da la opción de desactivarlos completamente en el caso de que vendas por ejemplo productos descargables o virtuales. Las opciones de envío principales permiten definir una tasa fija para los costos de entrega local, nacional e internacional y te permite especificar distintas clases de entrega por ejemplo, Día Siguiente, Envío Prioritario, etcétera  mediante el uso de lo que se llaman clases de envío. Puede indicar fácilmente a que zonas de envío, países o áreas se aplican los diferentes métodos de envío y serás capaz de tener preparada y funcionando tu tienda rápidamente utilizando estos métodos básicos.

Selecting Shipping MethodsSelecting Shipping MethodsSelecting Shipping Methods

Veamos cómo configurar un método de envío. Supón que en mi tienda quiero cobrar una tarifa plana para todas las entregas al Reino Unido y otra tarifa plana distinta para los envíos internacionales. Desde mis opciones de envío he desactivado todos los métodos a escepción de "Tarifa plana" (Flat Rate) y "Transporte Internacional" (International Shipping). En mi página principal para las opciones de envío he marcado "Activar envío" y "Ocultar los gastos de envío hasta que se introduzca una dirección". No quiero que la calculadora de envío se muestre así que he desmarcado esto (esta opción es más útil cuando usas reglas de envío más sofisticadas y cargos a la entretega). Como no me importa hacer la entrega del envío a una dirección de facturación distinta a la de la entrega, estoy permitiendo esta característica, aunque establezco la dirección de la facturación como la dirección de envío predeterminada. Puedes ver mi configuración a continuación.

Ahora nos centramos en los pagos. En primer lugar vamos a ver mi tarifa plana; He activado y modificado el "Método de Título" de la entrega para el Reino Unido (esto es lo que se verá en la parte pública de la tienda onbline). He establecido que este método esté disponible sólo para unos países concretos y he indicado España en el siguiente cuadro. Las personas con una dirección de envío española serán capaces de usar este método de envío. A continuación he definido el "Tipo de Cálculo" a Según Pedido y he dejado Imponible. El valor Predeterminado de mi costo está establecido en 4.99, no voy a cobrar una tarifa.

UK Shipping SetupUK Shipping SetupUK Shipping Setup

Ahora para mis Envíos Internacionales. Lo he habilitado, el nombre por defecto es "Envíos Internacionales", lo que tiene todo el sentido. En esta ocasión he ajustado la disponibilidad con la opción "Excluir los países seleccionados" y he indicado el Reino Unido. Todo lo demás lo dejo igual que en la entrega para España, excepto el precio que he puesto a 7.99. Ahora cualquiera que realice pedidos cuya dirección de entrega pertenezca a España debería ver el precio del Envío y cualquier persona con una dirección de entrega fuera de España verá nuestro precio internacional.

Esta configuración de envío es obviamente una muy básica. Podrías hacer mucho más empleando extensiones de envío premium. Puedes utilizar Table Rate Shipping Extension para crear reglas de envío complicadas basadas en el peso y las dimensiones de un producto o cobrar una precio fijo para el primer producto y una cuota menor para los artículos que se añadan después al carro (es una extensión es muy bien elaborada y te da un sinfín de opciones para establecer tus gastos de envío). También puedes obtener extensiones para enlazar con APIs de servicios de mensajería populares como UPS, FedEx y USPS con lo que podrías obtener los precios de envío correctos en tiempo real del servicio que uses. Con esta fórmula pagarás por los métodos adicionales del envío pero ten en cuenta que el pequeño coste adicional debe estar bien alineado con los beneficios que esté generando tu tienda gracias al uso de la extensión, con un valor promedio que suele ser de alrededor $ 49.


Configurar Tus Pasarelas de Pago

Bien, ya tenemos configurada la instalación inicial. Tenemos ajustados los métodos de envío. ¡Ahora tenemos que conseguir algo de dinero de nuestros clientys! Al igual que con los métodos de envío, tienes varias opciones básicas para las pasarelas de pago que vienen ya integradas. Muchos de ellos no son útiles para la mayoría de tiendas e-commerce, cosas como las Transferencias Directas al Banco, los Cheques, o el Pago en Efectivo a la Entrega. Tienes PayPal que si podría servir para la mayoría de las personas que estén creando un proceso de pago similar al de Mijireh. Mijireh es un procesador de pagos que se ha asociado con WooCommerce, y por lo tanto se incluye gratis. Mijireh Checkout cumple completamente con las normas legales, por lo que constituye una forma segura para recoger y transmitir la información de las tarjetas de crédito en tu pasarela de pago y que te permite un control total sobre el diseño de tu sitio. Mijireh es compatible con muchas pasarelas de pago: Stripe, Authorize.net, PayPal, eWay, SagePay, Braintree, PayLeap y más. Obviamente necesitarás tener una cuenta en una de las pasarelas de pago admitidas y del mismo modo que tendrás que realizar los pagos derivados de tus pasarela, en Mijireh tendrás un cargo por transacción de $0,50. Yo en persona no lo he utilizado, ya que al igual que ocurre con las extensiones adicionales para los envíos, prefiero hacer un único y pequeño desembolso por alguno de los módulos en lugar tener que realizar pagos periódicos. La elección es tuya.

WooCommerce Payment GatewaysWooCommerce Payment GatewaysWooCommerce Payment Gateways

En nuestro tutorial vamos a empezar con la configuración de PayPal. No es de extrañar, ya que ¡es una instalación muy simple! Actívala e introduce tu dirección de correo electrónico de PayPal y ya lo tienes. Tienes algunas otras opciones que puedes ajustar, como el prefijo para las facturas de PayPal, también puedes especificar el estilo de la página de PayPal. Puedes incluso activar o desactivar el entorno de modo en pruebas o "sandbox" de PayPal (activo por defecto) ¡excelente para realizar las comprobaciones del funcionamiento del proceso de pago de la tienda antes de publicarla! Esto es todo, probablemente la configuración de una pasarela de pago es la configuración más fácil de todas las que hay que realizar en WooCommerce.


Conclusión

De modo que ya tenemos WooCommerce instalado y la instalación inicial configurada, no fue tan doloroso, ¿no? Hemos configurado nuestros métodos de envío y también nuestras pasarelas de pago con muy poco tiempo y esfuerzo. En nuestro segundo artículo recorreremos lo pasos necesarios para añadir productos y hablaremos sobre los diferentes tipos de productos existentes en WooCommerce, veremos cómo aplicar estilo y modificar un tema para WooCommerce y hablaremos de los pasos a seguir para ampliar WooCommerce.

Enlaces Útiles: Plugins para WooCommerce en CodeCanyon.