Enrique J. Ros

WooCommerce como catálogo

Ya he hablado numerosas veces de la potencia y flexibilidad de WooCommerce como sistema de comercio electrónico, y son precisamente esas virtudes las que hacen que se instale para un amplio rango de usos, algunos de ellos en situaciones para las que no está pensado. Como por ejemplo usar WooCommerce como catálogo.

Las características de WooCommerce hacen que sea muy cómodo para introducir un catálogo online, estructurarlo gracias a las categorías y las etiquetas, y hacerlo navegable y fácilmente accesible, incluso permitiendo añadirle características especiales recurriendo a algún plugin.

Pero en este caso el problema sería otro: habría que quitar algunas de las características de WooCommerce. En concreto todas las que tienen que ver con el proceso de compra, desde el botón Añadir al carrito hasta el checkout.

Para ello contamos con diversas opciones. Los propios autores de WooCommerce, WooThemes, facilitan una de ellas: el plugin premium Catalog Visibility Options. Sin embargo disponemos también de varias alternativas gratuitas y de igual valor añadido. Vamos a verlas.

WooCommerce Catalog Enquiry

La primera de estas alternativas es WooCommerce Catalog Enquiry, un plugin que no sólo te permite convertir WooCommerce en un catálogo sino que tiene algunas opciones muy interesantes que lo hacen único, e imprescindible si buscas alguna de estas características.

Por ejemplo la posibilidad de añadir un botón para que el visitante envíe una consulta sobre el artículo desde la propia ficha de producto. Es decir, puedes hacer desaparecer el botón Añadir al carrito o bien transformarlo en un botón (con el texto y el estilo que tú configures) que abre una ventana modal para enviar una consulta, solicitar cotización del producto, o cualquier otra cosa que el cliente quiera solicitar o tú quieras ofrecer en función de tu modelo de negocio, transformando radicalmente la ficha de producto:


WooCommerce en modo normal (izquierda) y en modo catálogo (derecha)

Interesante, ¿verdad? Al activar este plugin nos aparece una nueva pantalla de opciones en WooCommerce > WC Catalog Enquiry. Y opciones no le faltan a este plugin. La primera de todas activa o desactiva el modo catálogo en toda la tienda. Así de fácil, con un sólo click.

Además cuenta con otras pequeñas joyas verdaderamente útiles, como la opción de presentar la tienda en modo catálogo sólo a visitantes sin identificar, sólo a identificados o a ambos. De esta forma puedes, por ejemplo, mostrar los precios sólo a clientes con cuenta, por poner uno de los ejemplos más solicitados en este tipo de situaciones.

En cuanto al tema de los precios, también incluye la interesante opción de mostrarlos u ocultarlos a elección. Al igual que el botón para petición de información o de cotización (totalmente configurable), que también puede activarse o desactivarse con un click.

También incluye la utilísima opción de deshabilitar las páginas de carrito y de checkout, haciendo que redirijan a la home si intentas acceder a ellas. Lo que no hace, como puedes ver en la imagen, es ocultarlas si tu plantilla las incluye en ciertos lugares (cosa que suelen hacer los temas de WooThemes). De todos modos la última parte del artículo te explico cómo puedes conseguirlo fácilmente.

Por último quiero destacar de entre la gran cantidad de opciones de incluye (en serio, muchas) las listas de inclusión y exclusión, es decir, la posibilidad de elegir individualmente o por roles de usuario (por tipo de cuenta) qué usuarios pueden ver el modo tienda y cuáles el modo catálogo.

YITH WooCommerce Catalog Mode

La segunda alternativa es de unos chicos que ya conocemos por su extenso catálogo de utilísimos plugins para WooCommerce. Ya he repasado algunos en el blog, por ejemplo cuando hablaba de implementar una lista de deseos en WooCommerce o de cómo mejorar las imágenes de producto.

En este caso vamos a fijarnos en su plugin YITH WooCommerce Catalog Mode, gratuito como el anterior y también muy útil a pesar de su mayor sencillez.

Al activarlo podrás acceder a la sección de configuración en YITH Plugins > Catalog Mode, donde encontrarás (literalmente) cuatro opciones:

Como ves es mucho más sencillo que WooCommerce Catalog Enquiry, lo que no quiere decir que sea menos útil: si este plugin se adapta a lo que necesitas, te resultará mucho más útil que tener que lidiar con las decenas de opciones que tiene el anterior.

¿Su gran carencia? Que no permite ocultar el precio. O, mejor dicho, que sólo permite hacerlo en la versión premium, que se puede adquirir en YITHemes por 49$. Demasiado para algo que queda resuelto con una simple línea en nuestro archivo de CSS:

.price {display:none;}

En su defensa hay que decir que la versión premium también permite la inclusión de un formulario de solicitud de cotización o información (algo que, recuerda, ya hacía el anterior plugin que hemos visto y que, en cualquier caso, es sencillo de implementar), un botón personalizado (lo mismo), la opción de deshabilitar el sistema de opiniones sobre los productos, listas de exclusión y algunas otras.

Convertir WooCommerce en catálogo de productos con unas líneas de código

No siempre hace falta un plugin para todo. A veces, si nuestras necesidades son muy específicas, es más conveniente introducir los cambios en forma de código. Así evitamos que el sitio web de vea sobrecargado por el uso de un número excesivo de plugins y de una cantidad de código, de javascripts y de estilos (los incluidos en los plugins) que en realidad no necesitamos.

Éste puede ser perfectamente uno de esos casos. Si lo que necesitamos es «esconder» algunas de las características de WooCommerce no hace falta que instalemos plugins. Sólo tenemos que introducir las funciones adecuadas en el archivo functions.php o en tu plugin propio de funciones personalizadas. Aquí te dejo las líneas de código que necesitas:

Quitar el botón «Añadir al carrito»

remove_action ('woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
remove_action ('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
remove_action ('woocommerce_simple_add_to_cart', 'woocommerce_simple_add_to_cart', 30 );
remove_action ('woocommerce_grouped_add_to_cart', 'woocommerce_grouped_add_to_cart', 30 );

Esas cuatro acciones eliminan el botón Añadir al carrito de todos los sitios de la tienda, tanto fichas de producto como páginas de archivo (es decir, tienda, categorías, etiquetas, resultados de búsqueda, etc). Si tú, como administrador de la tienda, quieres seguir viéndolo de la forma normal pero que el resto de visitantes lo vean así, puedes cambiarlo de esta forma:

if (!current_user_can ('manage_options')) {
	remove_action ('woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
	remove_action ('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
	remove_action ('woocommerce_simple_add_to_cart', 'woocommerce_simple_add_to_cart', 30 );
	remove_action ('woocommerce_grouped_add_to_cart', 'woocommerce_grouped_add_to_cart', 30 );
	}

De la misma forma se pueden incluir modificaciones para que se muestre la tienda o el catálogo dependiendo si es cliente registrado o visitante, del tipo de cuenta, etc.

Ocultar el precio

Si además de quitar el botón de compra necesitas ocultar el precio, sólo tienes que añadir lo siguiente a tu hoja de estilos (bien al archivo style.css de tu plantilla o a tu plugin de CSS, como por ejemplo Simple Custom CSS), como ya hemos visto más arriba:

.price {display:none;}

Ocultar el carrito y el checkout

Para terminar de redondearlo, podríamos ocultar (e incluso deshabilitar) las opciones de acceso al carrito y al checkout de donde aparezcan. Para ello podemos usar los siguientes estilos:

.cart, .checkout {display:none !important;}

Así las páginas quedan ocultas, pero si se introduce la dirección directamente en el navegador sigue siendo posible acceder a ellas. También es posible (y relativamente sencillo) hacer que tanto la página de carrito como la de checkout redirijan a cualquier página que elijas (como la página de inicio o de la tienda) modificando el archivo .htaccess, pero no es recomendable que toques ese archivo si no sabes lo que estás haciendo.

Si necesitas algo así y quieres que te ayude, no tienes más que contactarme.

Incluir un formulario de petición de información o de cotización

Ya, para terminar de redondear nuestra transformación a medida, también sería muy sencillo crear las modificaciones necesarias para que en la ficha de producto, junto a las pestañas «Descripción» y «Comentarios», muestre otra titulada «Solicitud de información» o «Petición de cotización» o como quieras que incluya un formulario.

De hecho en este artículo te explico, paso a paso y con capturas de pantalla, cómo hacer exactamente eso: crear una pestaña adicional en la ficha de producto con un formulario para que los clientes puedan consultar lo que necesiten sobre el artículo que están viendo en ese momento.

Con eso tendríamos nuestro WooCommerce convertido en catálogo sin necesidad de haber instalado nada, sólo con la cantidad de código imprescindible para conseguir lo que necesitamos. ¿Lo ves complicado o no tienes tiempo de ponerte a ello? Pues no hay problema, siempre tienes los plugins. 😉

Como de costumbre, te invito a dejar un comentario o a contactarme si tienes cualquier duda o consulta sobre este o sobre cualquier otro tema relacionado con WordPress o con WooCommerce.

Salir de la versión móvil