WooCommerce: dividir la página de la tienda por categoría

Bueno, esto va a ser grande para ti. Cuando comienza a tener muchos productos y muchas categorías de productos, la página de la tienda se vuelve desordenada o poco representativa, porque puede mostrar solo los últimos 16 productos en la página 1 cuando tiene docenas de categorías y una gama mucho más amplia de productos...

Como de costumbre, hay complementos para eso, el primero que me viene a la mente es Diseño de categoría anidada de Skyverge , pero hoy quería ver qué tan factible era codificarlo y cuántas líneas de PHP se requerían.

Entonces, si desea cambiar la visualización de la página de la tienda de WooCommerce de "productos" a "un número determinado de productos para cada categoría principal", aquí está la solución. ¡Disfrutar!

Con los 3 fragmentos a continuación, la página de mi tienda ahora está dividida por categorías y se muestra un máximo de 4 productos en cada fila, junto con un separador, un encabezado y un enlace para ver más productos.

Fragmento(s) de PHP: mostrar productos por categoría en la página de la tienda

Fragmento 1: Ocultar bucle de producto predeterminado en la página de la tienda

Si deseamos mostrar productos por categoría, primero debemos ocultar la visualización del producto en la página de la tienda. Puede hacerlo con un fragmento que ya codificamos en https://www.businessbloomer.com/woocommerce-remove-loop-shop-page/

Fragmento 2: ocultar "No se encontraron productos que coincidan con su selección" en la página de la tienda

Tan pronto como le dice a WooCommerce que no muestre productos, aparece un mensaje de error ("No se encontraron productos que coincidan con su selección"). Afortunadamente, ya encontramos una solución para ocultarlo: https://www.businessbloomer.com/woocommerce-hide-no-products-were-found-matching-your-selection/

Fragmento 3: mostrar 4 productos por categoría en la página de la tienda

Además de eso, también agregué una fila con el nombre de la categoría del producto envuelto en un H2 y un enlace a "Ver todos los productos de la categoría", ya que puede haber más de 4 y los clientes pueden estar interesados ​​en refinar su búsqueda por categoría.

/**
 * @snippet       4 Products Per Category @ WooCommerce Shop
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 6
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */
 
add_action( 'woocommerce_no_products_found', 'bbloomer_show_4_products_per_category' );
 
function bbloomer_show_4_products_per_category() {
   $args = array(
      'parent' => 0,
      'hide_empty' => true,
      'taxonomy' => 'product_cat',
      'fields' => 'slugs',
   );
   $categories = get_categories( $args );
   foreach ( $categories as $category_slug ) {
      $term_object = get_term_by( 'slug', $category_slug , 'product_cat' );
      echo '<hr><h2>' . $term_object->name . '</h2>';
      echo do_shortcode( '[products limit="4" columns="4" category="' . $category_slug . '"]' );
      echo '<p><a href="' . get_term_link( $category_slug, 'product_cat' ) . '">View all ' . $term_object->name . ' products &rarr;</a>';
   }
}

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir