Ayúdeme a elaborar un título SEO, palabras clave SEO y una breve descripción SEO basada en el contenido del blog, ¡con las palabras clave entre comas!

WooCommerce Clasificar y mostrar los productos es importante para mejorar la experiencia del cliente y aumentar las conversiones del sitio web. Cuando los clientes pueden encontrar rápidamente lo que buscan, es más probable que compren y vuelvan a por más, mejorando así la experiencia del usuario.

La buena noticia es que WooCommerce ofrece varias formas de ordenar y mostrar los productos, incluida la configuración predeterminada,Opciones de personalización, complementos, etc.

Este artículo cubrirá una variedad de formas de ordenar y mostrar los productos de WooCommerce, incluyendo configuraciones básicas y avanzadas, así como plugins imprescindibles. A continuación, se analizarán las ventajas y desventajas de cada método, para que pueda elegir la opción que mejor se adapte a sus necesidades.

¿Por qué ordenar y mostrar los productos de WooCommerce?

Existen dos razones principales para clasificar y exponer los productos:

Convertir clientes potenciales en compradores
Cuando los productos se clasifican por criterios específicos, es más probable que los clientes encuentren lo que buscan, lo que aumenta las posibilidades de realizar una compra.
Proporcionar a los clientes una experiencia de usuario de calidad
La clasificación hace que las tiendas estén más organizadas y sean más fáciles de navegar, proporcionando así una mejor experiencia de compra a los clientes.

Reduzca el desorden de la tienda y mucho más controlando la clasificación de los productos en su tienda WooCommerce. Por ejemplo, los productos pueden ordenarse en función de su popularidad, el promedio de ventas o categorías específicas como ropa de hombre y de mujer.

Cómo ordenar y mostrar los productos de WooCommerce

Método 1: Ordenar los productos según las opciones predeterminadas de WooCommerce

WooCommerce incluye opciones de ordenación incorporadas. La forma más sencilla de ordenar los productos es utilizar estos métodos predeterminados, pero ofrecen un control y una personalización limitados.

Uso del personalizador

En la última versión de WooCommerce, la opción Ordenación de productos por defecto no se encuentra en Configuración, y sólo se puede acceder a ella a través del Personalizador.

Para versiones anteriores:

cambiar aPanel de control de WooCommerce>establecer>ofertasTab.

En el menú desplegable, veráClasificación de productos por defecto, centrándose en diferentes categorías como el precio y la popularidad.

Para WooCommerce 3.3 y superior:

En el panel de administración de WordPress vaya aestado exterior>personalización.

Buscar en el personalizadorSección WooCommerce.

Seleccione una opción de clasificación en el menú desplegable(por ejemplo, por precio, popularidad, valoración media, más reciente u orden alfabético).

Haga clic en "escriba a" para guardar.

Lo utilizo aquí.El tema es Astra. Si está utilizando el tema predeterminado de WordPress, es posible que tenga que ir a la seccióneditor (software)y seleccionePlantilla WooCommerce Archivo de Productospara editar el bucle de consulta del producto.Nuestros tutorialesAstra Theme Nanny TutorialPuede que le ayude.

Cómo cambiar el orden del menú para cada producto

Si desea ordenar el menú enpersonalizar el pedido de productos individuales.Siga los pasos que se indican a continuación:

Haga clic en cualquier producto de la"Editar".
Desplácese hastaDatos del productowidgets
golpe (en el teclado)"Opciones "avanzadasun puesto de control
adaptesecuencia del menúpara cambiar la posición del producto.

En el backend, esta operación se realiza mediante la funciónwoocommerce_catalog_orderGestión de ganchos.

Ventajas y desventajas de este enfoque

✓ Fácil de instalar

✓ No requiere codificación

✓ Proporcionar opciones básicas de clasificación (por ejemplo, por precio, popularidad, fecha)

✗ Personalización limitada

✗ No es adecuado para requisitos de clasificación complejos

Método 2: Cómo ordenar productos en WooCommerce (manualmente)

Con WooCommerce, también es posible ordenar manualmente los productos. Esto es útil para crear visualizaciones personalizadas de los productos y destacar los artículos importantes. Puede seguir los pasos que se indican a continuación:

En el panel de control de WordPress, vaya a"Producto". > "Todos los productos".

Pulse el botónClasificar.

Arrastrar y soltar productospara establecer el orden preferente.

El pedido personalizado establecido aquí se convierte en la pantalla por defecto para los clientes que navegan por la tienda.

Clasificación manual de productos individuales:

Para un mejor control de los productos individuales:

Abra el producto en el editor y desplácese hasta la secciónDatos del productoParte.

avanzadoEn la pestañasecuencia del menú(cuanto menor sea el número, mayor será el orden en el que se muestren los productos).

El ajuste del orden del menú es especialmente útil si desea ajustar la posición con una simple operación de arrastrar y soltar.

Ventajas y desventajas de este enfoque

✓ Control total sobre el orden en que se muestran los productos

✓ Sencilla interfaz de arrastrar y soltar

✗ Los grandes inventarios llevan mucho tiempo

✗ Se requieren actualizaciones periódicas si cambian las prioridades del producto

Método 3: Cómo personalizar la clasificación por categoría o atributo

También puede agrupar los productos por categoría o atributo, lo que ayuda a sus clientes a encontrar fácilmente los artículos de un grupo específico. Esto funciona mejor cuando tiene varias líneas de productos en su tienda.

Por favor, siga los siguientes pasos:

hacer clic (con un ratón u otro dispositivo señalador)"Producto".y luego en la barra de herramientas de WooCommerce, elija"Categoría

Añada nuevas categorías o gestione las existentes asignando productos relacionados a cada categoría.

Mostrar productos por categoría:
- salir para"Apariencia". > "Menú".Añadir enlaces de categorías a la navegación principal
- hacer uso deCódigos cortos específicos de la categoríapara obtener un mayor control.

Muestra los códigos abreviados de los productos por categoría:

[product-category="category-slug" orderby="date" order="asc"]

voluntad" categoría-slug " se sustituye por el nombre real de la categoría.

Ordenar por atributo:

WooCommerce también puede ordenar por atributos como el color, la talla o la marca. La configuración es la siguiente:

cambiar a"Producto". > "Propiedades".para crear o gestionar propiedades.
Datos del producto en la página de edición de cada productoEstos atributos se asignan a cada producto de la sección.
gasto o desembolsouna barra lateral (en software)ha dado en el clavoFiltre los widgets o utilice shortcodes específicos para habilitar la funcionalidad basada en atributos.

Ventajas y desventajas de este enfoque

✓ Clasificar los productos por categorías o atributos específicos (por ejemplo, color, tamaño).

✓ Ideal para tiendas con múltiples tipos de productos

✗ Necesidad de establecer los atributos exactos para cada producto

✗ Puede llegar a ser complejo, con muchas categorías o atributos

Método 4: Cómo utilizar el shortcode de WooCommerce para mostrar productos

Otra forma de ordenar y mostrar los productos en su tienda WooCommerce es utilizar shortcodes. Estos shortcodes pueden personalizarse con parámetros de clasificación predeterminados (por ejemplo, por precio, valoración, fecha) y orden de clasificación: ascendente o descendente.

A continuación se muestra un ejemplo sencillo de visualización del shortcode. La visualización también puede personalizarse utilizando otras propiedades, como columnas, límites, categorías, etc.

[products limit="8" columns="4"]

A continuación encontrará códigos abreviados adicionales para clasificar y mostrar los productos:

Un ejemplo de código corto que muestra el producto más vendido.

Para añadir

Shortcode para mostrar los productos más vendidos en su tienda WooCommerce, siga los siguientes pasos:

Navegue hasta "página web" y, a continuación, seleccione "Todas las páginas" en el panel de administración de WordPress (o, si desea añadirlo a una entrada del blog, seleccione "Entradas", " Todas las entradas").
Seleccione la página o la entrada en la que desea que esté el producto más vendido y haga clic en "compilador". Elegí la página de inicio.

En el editor de WordPress, haga clic en el botón + para añadir un bloque.

Busque "Shortcode" en la barra de búsqueda.

Aquí es donde debe añadir el código corto. Pegue lo siguiente:

limitar: Determine cuántos de los productos más populares se muestran.

💡columnas: Especifica el número de columnas utilizadas para mostrar los productos.

Ahora, pulse "escriba a"Botón
Navegue por la parte frontal del sitio para confirmar que los productos más populares se promocionan correctamente.

Ventajas y desventajas de este enfoque

✓ Flexibilidad para mostrar productos o categorías específicas en cualquier página.

✓ Parámetros de código corto altamente personalizables

✗ Sólo personalización a nivel de página

✗ Puede necesitar un estilo para algunos temas

Método 5: Cómo utilizar el plugin para ordenar y mostrar

El uso del plugin WooCommerce proporciona opciones más avanzadas y flexibilidad.

coaccionarmontajeademásactive Plugin WooCommerce Sortsiga los pasos que se indican a continuación:

Vaya a suWordPressCuadro de mandos.
hacer clic (con un ratón u otro dispositivo señalador)plug-in (componente de software)>Añadir nuevo plugin.

buscar algoPlug-ins deseados.
hacer clic (con un ratón u otro dispositivo señalador)Instalar ahora.

Tras la instalación, pulse"Activar".para activar el complemento.

En este tutorial, he instalado el plugin gratuito para WooCommerceOpciones adicionales de clasificación de productos.

Encontrará múltiples ajustes en el panel de personalización de WooCommerce.

Encontrará más opciones de clasificación en la página de la tienda.

Método 6: Cómo añadir ordenación personalizada de productos WooCommerce (Avanzado)

Si los filtros de clasificación disponibles no satisfacen las necesidades de los visitantes del sitio, también se pueden crear opciones de clasificación personalizadas, que se mostrarán en un menú desplegable en la página de la tienda.

Hacerlo permite la clasificación basada en campos personalizados o metadatos como la ubicación, el punto de venta u otros atributos únicos.

Paso 1: Añadir opciones de clasificación personalizadas

Añada el siguiente fragmento de código a la sección del tema archivo functions.phppara añadir nuevas opciones de clasificación:

function add_custom_woocommerce_sort_option( $sort_options ) {
    $sort_options['custom_sort_order'] = 'Custom Sorting Order'; // Etiqueta para la opción de ordenación
    return $sort_options;
}
add_filter( 'woocommerce_default_catalog_orderby_options', 'add_custom_woocommerce_sort_option' ); }
add_filter( 'woocommerce_catalog_orderby', 'add_custom_woocommerce_sort_option' ); }

Paso 2: Definir la lógica de clasificación

Utilice el siguiente código para implementar una lógica de ordenación personalizada. Coloque el icono " su_clave_meta_personalizada " se sustituye por la meta clave real utilizada para la clasificación:

function ordenar_productos_personalizados (consulta $) {

function ordenar_productos_personalizados( $query ) {
    ¡si ( ! is_admin() && $query->is_main_query() && is_shop() || is_product_category() ) { // Asegúrese de que sólo afecta a la página de la tienda y a las categorías de productos
        if ( isset( $_GET['orderby'] ) && $_GET['orderby'] == 'custom_sort_order' ) {
            $query->set( 'meta_key', 'your_custom_meta_key' ); // Sustituya 'your_custom_meta_key' por su meta clave real
            $query->set( 'orderby', 'meta_value_num' ); // Para ordenación numérica; utilice 'meta_value' para texto
            $query->set( 'order', 'DESC' ); // Establezca el orden de clasificación (ASC o DESC)
        }
    }
}
add_action( 'woocommerce_product_query', 'custom_product_sort' ); }

Cómo ordenar y mostrar productos utilizando campos personalizados

Puede añadirvalor en dólarespara que el filtro de clasificación contenga tambiénnuméricoresponder cantandoTexto.

Para facilitar la personalización del filtro, añadiré dos opciones de clasificación:Ordenar por ubicaciónresponder cantandoOrdenar por punto de venta.

Atención:Coloque el siguiente código en el tema hijo dearchivo functions.phpMedio.

// Paso 1: Modificar los argumentos de ordenación de WooCommerce para que admitan campos personalizados para la ordenación
function cw_add_postmeta_ordering_args( $args_sort_cw ) {
    $cw_orderby_value = isset( $_GET['orderby'] ) ? wc_clean( $_GET['orderby'] ) :
        apply_filters( 'woocommerce_default_catalog_orderby', get_option( 'woocommerce_default_catalog_orderby' ) ).

    switch( $cw_orderby_value ) {
        case 'puntos_adjudicados'.
            $args_sort_cw['orderby'] = 'meta_value_num';
            $args_sort_cw['order'] = 'DESC'; // Establecer el orden de clasificación (ASC o DESC)
            $args_sort_cw['meta_key'] = 'points'; // Meta clave para 'points'; // Establezca el orden de clasificación (ASC o DESC).
            break; // Meta clave para 'puntos'; // Meta clave para 'puntos'.
        case 'ubicación'.
            $args_sort_cw['orderby'] = 'meta_valor';
            $args_sort_cw['order'] = 'ASC'; // Establecer el orden de clasificación (ASC o DESC)
            $args_sort_cw['meta_key'] = 'location'; // Meta clave para 'location'
            break; }
    }

    return $args_sort_cw;
}
add_filter( 'woocommerce_get_catalog_ordering_args', 'cw_add_postmeta_ordering_args' );

// Paso 2: Añadir nuevas opciones de ordenación al desplegable de WooCommerce
function cw_add_new_postmeta_orderby( $sortby ) {
    $sortby['ubicación'] = __( 'Ordenar por ubicación', 'woocommerce' );
    $sortby['points_awarded'] = __( 'Ordenar por punto de venta', 'woocommerce' ); return $sortby('points_awarded'] = __( 'Ordenar por punto de venta', 'woocommerce' ); }
    return $sortby;
}
add_filter( 'woocommerce_default_catalog_orderby_options', 'cw_add_new_postmeta_orderby' );
add_filter( 'woocommerce_catalog_orderby', 'cw_add_new_postmeta_orderby' ); }

Después de añadir el código anterior, el filtro de ordenación aparecerá en la ventanapágina de productosen el menú desplegable. Sin embargo, aparece en el menú de ordenación, pero dentro del artículo también se muestra cómo mostrar estos valores en una página de un solo producto.

Cómo mostrar los valores de los campos personalizados en las páginas de productos

Añada el siguiente fragmento de código para mostrar campos como la ubicación y el punto de venta en la página del producto. Del mismo modo, cualquier campo personalizado puede mostrarse en la página de la tienda utilizando los mismos metavalores.

function cw_shop_display() {
    global $product.

    // Obtener campos meta personalizados para cada producto
    $location = get_post_meta( $product-&gt;get_id(), 'ubicación', true ); $point_of_sale = get_post_meta( $product-&gt;get_id(), 'ubicación', true )
    $points_of_sale = get_post_meta( $product-&gt;get_id(), 'points', true );

    ¡si ( ! empty( $location ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Ubicación.</span> ' . esc_html( $location ) . '</div>';
    }
    ¡if ( ! empty( 1TP4Punto_de_venta ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Puntos de venta.</span> ' . esc_html( 1TP4Punto_de_venta ) . '</div>';
    }

    if ( $product-&gt;get_sku() ) {
        echo '<div class="product-meta">SKU: ' . esc_html( $product-&gt;get_sku() ) . '</div>';
    }
}
add_action( 'woocommerce_after_shop_loop_item', 'cw_shop_display', 9 );

Cada vez que un visitante selecciona una opción de clasificación, el valor correspondiente cambia en consecuencia. La siguiente captura de pantalla muestra elOrdenar por ubicación.

Por punto de ventaLa clasificación es igual.

Si deseaEditar productos individualesnecesita establecer un campo personalizado para elValor.

De este modo, podrá mejorar eficazmente las funciones de clasificación y visualización de productos de su tienda WooCommerce, mejorar la experiencia de compra de sus clientes y aumentar las tasas de conversión. Puede elegir la forma más adecuada de optimizar la visualización y clasificación de productos en función de sus necesidades y del tamaño de su tienda.

Contacte con nosotros
¿No puede leer el artículo? ¡Póngase en contacto con nosotros para obtener una respuesta gratuita! Ayuda gratuita para sitios personales y de pequeñas empresas
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres