Shortcodes para WooCommerce

shortcodes-para-woocommerce

En este tutorial vamos a ver que son los shortcodes y que shortcodes para WooCommerce tenemos disponibles. Aprenderemos los diferentes tipos con ejemplos para que veáis las posibilidades que nos brindan.

¿Qué es un shortcode?


Un shortcode es una palabra o grupo de ellas escritas entre corchetes que en algunos casos tiene etiqueta de apertura y otra de cierre y otras muchas pueden llevar parámetros extra como veremos a continuación.

Ejemplos:

[shortcode]

[shortcode][/shortcode]

[products ids="457, 458, 459"]

Estos shortcodes hacen que cuando los escribas en un post o página y la visualicemos observaremos que realiza una función específica que nos devuelve algún tipo de información. En este caso vamos a ver que funciones realizan algunos de los shortcodes de WooCommerce.

 

Guía de shortcodes para WooCommerce


Dentro de la gran variedad de shortcodes de que dispone WooCommerce podemos clasificarlos en diferentes tipos:

  • Los que nos permiten visualizar productos, categorías, etc…
  • Los que nos permiten visualizar páginas internas de WooCommerce o partes de ellas.
  • Los que nos permiten integrar botones de compra en cualquier sitio

 

1 – Shortcodes de visualización productos en WooCommerce


– Visualizar un producto en concreto en cualquier sitio:

[product id="467"] – Muestra el producto con el id 467

– Visualizar la página de producto:

[product_page id="467"] – Muestra la página de producto con el “id” 467.

– Si quiseramos hacer lo mismo pero usando el sku:

[product_page sku="8435416203349"] – Muestra la página de producto con el “sku”8435416203349.

– Listado con varios productos:

[products ids="467, 588, 244"] – Listado de 3 productos con “id” 467, 588 y 244.

[related_products]– Listado de productos relacionados.

[top_rated_products] – Listado de los productos mejor valorados.

[best_selling_products] – Listado de los productos más vendidos.

[sale_products] – Listado de productos rebajados.

[featured_products] – Listado de productos destacados.

[recent_products] – Listado de los últimos productos.

– Listado de productos por categoría:

[product_category category="bombillas"] – Listado de productos de categoría “bombillas”.

– Listado de las categorías de producto de nuestra tienda:

[product_categories] – Listado de las categorías de la tienda.

– Mostrar productos según atributos:

[product_attribute attribute='talla' filter='m'] – Listado de los productos de la talla M.

Los shortcodes de listados de productos tienen dos atributos:
“orderby” y “order”

El atributo “orderby” permite indicar el criterio de ordenación de los productos. Tenemos los siguientes tipos:

  • title: El nombre del artículo, alfabéticamente
  • menu_order: El número que se ha elegido en la ficha de producto
  • date: La fecha de publicación del producto
  • rand: Orden aleatorio
  • id: El identificador del producto

El atributo “order” nos permite elegir entre ordenar de forma ascendente o descendente.

  • asc: Orden ascendente
  • desc: Orden descendente

Ejemplos:

[product_category category="bombillas" orderby="date" order="desc"]: Mostrará los productos de la categoría “bombilla” ordenados por fecha, desde los más nuevos a los más antiguos.

[recent_products orderby="id" order="desc"]: Mostrará los productos ordenados por id de manera descendiente.

[product_category category="futbol" orderby="title" order="desc"]: Mostrará los productos de la categoría “futbol” ordenados por título de más nuevos a más antiguos.

 

2 – Shortcodes de las páginas de woocommerce:


Cuando instaláis WooCommerce se generan una serie de páginas que precisamente lo único que tienen en su interior son uno de estos 4 shortcodes:

  • [woocommerce_my_account] – Muestra la página “Mi Cuenta”.
  • [woocommerce_cart]– Muestra la página “Carrito”.
  • [woocommerce_checkout] – Muestra la página de pago.
  • [woocommerce_order_tracking] – Muestra el estado del pedido.

Puedes insertarlos en cualquier otra página y funcionarán exactamente igual que en sus páginas originales de WooCommerce.

 

3 – Shortcodes del carro de compra


Con este tipo de shortcode de WooCommerce podremos introducir el “Añadir al carro” de cualquier producto en cualquier sitio. ¡Esta opción la utilizaréis mucho!

  • [add_to_cart id="467"] – Este shortcode muestra un botón para añadir al carrito el producto 467, lo podemos poner donde queramos..
  • – Este shortcode mostrará una URL que si se visita, añadirá al carrito el producto 467.

 

Plugins de shortcodes para WooCommerce


Si no te aclaras con los shortcodes directos tienes el plugin WooCommerce Shortcodes que añade nuevas opciones en la barra del editor de WordPress . Con este plugin tendrás más a mano los shortcodes para WooCommerce.

shortcode woocommerce plugin

configurar shortcode woocommerce plugin