CMS Woocommerce WordPress

[WooCommerce] Configurar número de productos a mostrar por fila

[WooCommerce] Cambiar el número de columnas para listar productos

Resumen de contenidos

  1. Por PHP
  2. Por CSS
  3. Por shortcode

Por PHP

Si estás creando un tema, puedes hacer uso de la siguiente función en el functions.php:

En el caso de que estés trabajando sobre un tema ya creado, es bastante posible que la función de arriba ya esté definida. Así que o bien la buscamos y la editamos, o la anulamos para volver a definirla:

 

Por CSS

El principal problema de aplicar CSS radica en que, aunque modifiquemos el porcentaje de ancho de las columnas para forzar que en lugar de, por ejemplo, 4 productos por fila, se muestren 3, esto hará que los productos se organicen de la siguiente manera:

Para evitar eso, hacemos uso de la propiedad CSS clear.

Esta propiedad es descrita por Mozilla de la siguiente forma: “La propiedad CSS clear especifica si un elemento puede estar al lado de elementos flotantes que lo preceden o si debe ser movido (cleared) debajo de ellos. La propiedad clear aplica a ambos elementos flotantes y no flotantes.

Por lo tanto, el código a aplicar ssería algo como lo siguiente:

 

Por shortcode

El shortcode es el siguiente:

Donde per_page indicará el número de productos a mostrar por página y columns el número de productos por fila.

Cristian Sarabia Martínez

Desde que a principios de los 90 mi padre desempolvó su Spectrum, no he dejado de probar y experimentar con la tecnología.

Enamorado del mundo web, Full Stack Developer de profesión y diseñador por devoción.

Ahora hago mis pinitos en esto del blogging para compartir con vosotros un poquito de todo lo que la comunidad me ha dado.

Escribir comentario

Haz clic aquí para dejar tu comentario