Mostrar  uno o varios productos en una sola página es muy fácil con el uso de un shortcode de WooCommerce

Este será el primero de una serie de tutoriales dedicados a los shortcodes de WooCommerce.

WooCommerce nos provee de una serie de shortcodes que muchas veces ignoramos y que nos pueden ser de gran utilidad.

Los iremos viendo uno a uno con algún ejemplo.

Qué vamos a conseguir

Aunque le podemos dar más juego a esto, en esta ocasión vamos a intentar mostrar una página que crearemos nosotros para que sólo se muestre un producto.

Eso puede ser de mucha utilidad si queremos darle un trato especial a un producto en concreto de nuestra tienda.

Esto será lo que conseguiremos:

Mostrar uno o varios productos de WooCommerce en una página - dinapyme

La idea es esta, tener un sólo producto en una sola página.

Para ello creamos una página nueva en en apartado “paginas” de nuestro WordPress. Para este ejemplo le he dado el nombre “Producto Especial” a esta pagina.

El shortcode y sus opciones

El shorcode que vamos a utilizar es:


Este shortcode así no nos sirve por lo que debemos utilizar alguna de sus opciones, que son:

  • id
  • sku

Por tanto, un ejemplo de uso de cada uno sería:

Ejemplos

Para ver el funcionamiento de este shortcode, lo mejor es utilizarlo.

Como vamos a obtener el mismo resultado, basta con que identifiquemos un producto y su “id” y/o su “sku“.

El “id” de un producto lo podemos ver directamente en la lista de productos:

Mostrar uno o varios productos de WooCommerce en una página - dinapyme

En la imagen anterior vemos que el “id” de este producto es “67“.

También podemos saber o establecer el “sku” desde la edición de un producto, dentro del apartado “inventario” como se puede observar en la siguiente imagen:

Mostrar uno o varios productos de WooCommerce en una página - dinapyme

Para ver el resultado, vamos a crear una página nueva y vamos a introducir los dos shortcodes que acabamos de mencionar. Es decir:

Y el resultado de esto debería ser una página con dos productos. Bueno de hecho el producto es el mismo pero nos sirve para nuestro ejemplo.

En primer lugar vemos la imagen del contenido de la pagina en edición:

Mostrar uno o varios productos de WooCommerce en una página - dinapyme

Y a continuación el resultado: