Comment trier et afficher les produits WooCommerce

0371354

WooCommerce Le tri et l'affichage des produits sont importants pour améliorer l'expérience du client et augmenter les conversions sur le site web. Lorsque les clients peuvent trouver rapidement ce qu'ils cherchent, ils sont plus enclins à acheter et à revenir, ce qui améliore l'expérience de l'utilisateur.

La bonne nouvelle, c'est que WooCommerce propose plusieurs façons de trier et d'afficher les produits, y compris des paramètres par défaut,Options de personnalisationdes plug-ins, etc.

Cet article aborde les différentes manières de trier et d'afficher les produits WooCommerce, y compris les paramètres de base et avancés, ainsi que les plugins indispensables. Les avantages et les inconvénients de chaque méthode seront ensuite explorés, afin que vous puissiez choisir l'option qui correspond le mieux à vos besoins.

Image [1] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Pourquoi trier et afficher les produits WooCommerce ?

Il y a deux raisons principales pour lesquelles les produits sont triés et présentés :

  1. Convertir les prospects en acheteurs
    Lorsque les produits sont triés selon des critères spécifiques, les clients ont plus de chances de trouver ce qu'ils recherchent, ce qui augmente les chances d'effectuer un achat.
  2. Offrir aux clients une expérience utilisateur de qualité
    Le tri permet de mieux organiser les magasins et de faciliter la navigation, ce qui améliore l'expérience d'achat des clients.

Réduisez l'encombrement de votre boutique et plus encore en contrôlant le tri des produits dans votre boutique WooCommerce. Par exemple, les produits peuvent être triés en fonction de leur popularité, de leurs ventes moyennes ou de catégories spécifiques telles que les vêtements pour hommes et pour femmes.

Image [2] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Comment trier et afficher les produits WooCommerce

Méthode 1 : Trier les produits en fonction des options par défaut de WooCommerce

WooCommerce comprend des options de tri intégrées. La façon la plus simple de trier les produits est d'utiliser ces méthodes par défaut, mais elles offrent un contrôle et une personnalisation limités.

Utilisation du personnalisateur

Dans la dernière version de WooCommerce, l'option de tri par défaut des produits ne se trouve pas dans les paramètres et n'est accessible que par le biais du Customiser.

Pour les versions antérieures :

  • commutateur àTableau de bord WooCommerce>mettre en place>offresTab.

Dans le menu déroulant, vous verrezTri des produits par défautLe site Web de la Commission européenne est un outil de travail qui se concentre sur différentes catégories, telles que le prix et la popularité.

Pour WooCommerce 3.3 et plus :

  • Dans le tableau de bord d'administration de WordPress, allez àétat extérieur>personnalisation.
Image [3] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Trouver dans le personnalisateurSection WooCommerce.
Image [4] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Sélectionnez une option de tri dans le menu déroulant(par exemple, par prix, par popularité, par note moyenne, par ordre de nouveauté ou par ordre alphabétique).
Image [5] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Cliquez sur "poste"pour sauvegarder.

Je l'utilise ici.Le sujet est Astra. Si vous utilisez le thème par défaut de WordPress, vous devrez peut-être aller dans la sectionéditeur (logiciel)et sélectionnezWooCommerce Product Archive Templatepour modifier la boucle d'interrogation du produit.Nos tutorielsTutoriel Astra Theme NannyCela pourrait vous aider.

Comment modifier l'ordre du menu pour chaque produit

Si vous souhaitez trier le menu enla personnalisation de la commande de produits individuels.Suivez les étapes ci-dessous :

  1. Cliquez sur n'importe quel produit de la"Editer".
  2. Faites défiler vers le bas jusqu'àDonnées sur le produitwidgets
  3. frappe (sur le clavier)"Options "avancéesun poste de contrôle
  4. adapterséquence de menuspour modifier la position du produit.

Au niveau du backend, cette opération est effectuée par la fonctionwoocommerce_catalog_orderGestion des crochets.

Image [6] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Avantages et inconvénients de cette approche

✓ Facile à mettre en place

✓ Aucun codage n'est nécessaire

✓ Fournir des options de tri de base (par exemple, par prix, par popularité, par date)

✗ Personnalisation limitée

✗ Ne convient pas aux exigences de triage complexes

Méthode 2 : Comment trier les produits dans WooCommerce (manuellement)

Avec WooCommerce, il est également possible de classer manuellement les produits. Cette fonction est utile pour créer des affichages de produits personnalisés et mettre en évidence les articles importants. Vous pouvez suivre les étapes ci-dessous :

  • Dans le tableau de bord de WordPress, allez à"Produit". > "Tous les produits".
Image [7] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Cliquez sur le boutonTrier.
Image [8] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Produits Glisser-Déposerpour définir l'ordre préférentiel.
Image [9] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

La commande personnalisée définie ici devient l'affichage par défaut pour les clients qui visitent la boutique.

Tri manuel de produits individuels :

Pour un meilleur contrôle des produits individuels :

  • Ouvrez le produit dans l'éditeur et descendez jusqu'à la sectionDonnées sur le produitPartie.
Image [10] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • avancéSous l'onglet, définissez l'optionséquence de menus(plus le nombre est faible, plus l'ordre d'affichage des produits est élevé).
Image [11] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Le réglage de l'ordre du menu est particulièrement utile si vous souhaitez affiner la position par une simple opération de glisser-déposer.

Avantages et inconvénients de cette approche

✓ Contrôle total de l'ordre d'affichage des produits

✓ Interface simple de type glisser-déposer

✗ Les inventaires importants prennent du temps

Des mises à jour périodiques sont nécessaires si les priorités du produit changent.

Méthode 3 : Comment personnaliser le tri par catégorie ou par attribut ?

Vous pouvez également regrouper les produits par catégorie ou par attribut, ce qui permet à vos clients de trouver facilement les articles d'un groupe spécifique. Cette fonction est particulièrement utile lorsque votre boutique comporte plusieurs lignes de produits.

Veuillez prendre les mesures suivantes :

  • cliquer (à l'aide d'une souris ou d'un autre dispositif de pointage)"Produit".puis dans la barre d'outils WooCommerce, choisissez"Catégorie
Image [12] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Ajoutez de nouvelles catégories ou gérez les catégories existantes en affectant des produits apparentés à chaque catégorie.
Image [13] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • Afficher les produits par catégorie :
    • partir pour"Apparence". > "Menu".Ajouter des liens vers des catégories à la navigation principale
    • utiliserCodes courts spécifiques à une catégoriepour obtenir plus de contrôle.

Affiche les codes courts des produits par catégorie :

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

volonté" catégorie-limite "est remplacé par le nom de la catégorie.

Trier par attribut :

WooCommerce peut également trier par attributs tels que la couleur, la taille ou la marque. La configuration est la suivante :

  1. commutateur à"Produit". > "Propriétés".pour créer ou gérer des propriétés.
  2. Données relatives aux produits sur la page d'édition de chaque produitCes attributs sont assignés à chaque produit de la section.
  3. dépense ou fraisune barre latérale (dans un logiciel)a fait moucheFiltrez les widgets ou utilisez des shortcodes spécifiques pour activer les fonctionnalités basées sur les attributs.

Avantages et inconvénients de cette approche

✓ Classer les produits par catégories ou attributs spécifiques (par exemple, couleur, taille)

✓ Idéal pour les magasins proposant plusieurs types de produits

Nécessité de définir les attributs exacts pour chaque produit

✗ Peut devenir complexe, avec de nombreuses catégories ou attributs

Méthode 4 : Comment utiliser le shortcode WooCommerce pour afficher les produits

Une autre façon de trier et d'afficher les produits dans votre boutique WooCommerce consiste à utiliser des shortcodes. Ces shortcodes peuvent être personnalisés avec des paramètres de tri par défaut (par exemple, par prix, par note, par date) et un ordre de tri - croissant ou décroissant.

Vous trouverez ci-dessous un exemple simple d'affichage du shortcode. L'affichage peut également être personnalisé à l'aide d'autres propriétés telles que les colonnes, les limites, les catégories, etc.

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

Vous trouverez ci-dessous des codes courts supplémentaires pour le tri et l'affichage des produits :

Exemple de code court indiquant le produit le plus vendu.

Pour ajouter

Shortcode pour afficher les produits les plus vendus dans votre boutique WooCommerce, suivez les étapes ci-dessous :

  • Naviguez vers "page web"puis sélectionnez "Toutes les pages" dans le panneau d'administration de WordPress (ou, si vous voulez l'ajouter à un article de blog, sélectionnez "Articles", " Tous les articles").
  • Sélectionnez la page ou l'article dans lequel vous souhaitez que le produit le plus vendu se trouve et cliquez sur ".compilateur". J'ai choisi la page d'accueil.
Image [105] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Dans l'éditeur WordPress, cliquez sur le bouton + pour ajouter un bloc.

Image [106] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Recherchez "Shortcode" dans la barre de recherche.

Image [107] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

C'est ici que vous ajoutez le code court. Collez le texte suivant :

Image [108] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

limiteDéterminez le nombre de produits les plus populaires qui sont affichés.

💡colonnesNombre de colonnes : Spécifie le nombre de colonnes utilisées pour l'affichage des produits.

  1. Appuyez maintenant sur "poste"Bouton.
  2. Parcourez la page d'accueil du site pour vous assurer que les produits les plus populaires sont correctement mis en avant.

Avantages et inconvénients de cette approche

Possibilité d'afficher des produits ou des catégories spécifiques sur n'importe quelle page

✓ Paramètres des numéros courts hautement personnalisables

✗ Personnalisation au niveau de la page uniquement

✗ Il peut être nécessaire de styliser certains thèmes

Méthode 5 : Comment utiliser le plugin pour trier et afficher

L'utilisation du plugin WooCommerce offre plus d'options avancées et de flexibilité.

contraindremontageen outreactiver WooCommerce Sort PluginSuivez les étapes ci-dessous :

  • Accédez à votreWordPressTableau de bord.
  • cliquer (à l'aide d'une souris ou d'un autre dispositif de pointage)plug-in (composant logiciel)>Ajouter un nouveau plugin.
Image [109] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !
  • rechercher qqch.Plug-ins souhaités.
  • cliquer (à l'aide d'une souris ou d'un autre dispositif de pointage)Installer maintenant.
Image [110] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Après l'installation, cliquez sur"Activer".pour activer le plug-in.

Image [111] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Dans ce tutoriel, j'ai installé le plugin gratuit pour WooCommerceOptions supplémentaires de tri des produits.

Vous trouverez plusieurs paramètres dans le panneau de personnalisation de WooCommerce.

Image [112] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Vous trouverez d'autres options de tri sur la page de la boutique.

Image [113] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Méthode 6 : Comment ajouter un tri personnalisé des produits WooCommerce (Avancé)

Si les filtres de tri disponibles ne répondent pas aux besoins des visiteurs du site, il est également possible de créer des options de tri personnalisées, qui seront affichées dans un menu déroulant sur la page de la boutique.

Cela permet un tri basé sur des champs personnalisés ou des métadonnées telles que l'emplacement, le point de vente ou d'autres attributs uniques.

Étape 1 : Ajouter des options de tri personnalisées

  • Ajoutez l'extrait de code suivant à la section fichier functions.phppour ajouter de nouvelles options de tri :
function add_custom_woocommerce_sort_option( $sort_options ) {
    $sort_options['custom_sort_order'] = 'Custom Sorting Order' ; // Étiquette pour l'option de tri
    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' ) ; }
function add_custom_woocommerce_sort_option( $sort_options ) {
    $sort_options['custom_sort_order'] = 'Custom Sorting Order' ; // Étiquette pour l'option de tri
    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' ) ; }
function add_custom_woocommerce_sort_option( $sort_options ) {
    $sort_options['custom_sort_order'] = 'Custom Sorting Order' ; // Étiquette pour l'option de tri
    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' ) ; }

Étape 2 : Définir la logique de tri

  • Utilisez le code suivant pour mettre en œuvre une logique de tri personnalisée. Placez l'élément " votre_clé_meta_personnalisée "est remplacé par la clé méta utilisée pour le tri :

function custom_product_sort ($ query) {

function custom_product_sort( $query ) {
    if ( ! is_admin() && $query->is_main_query() && is_shop() || is_product_category() ) { // Assurez-vous que cela n'affecte que la page de la boutique et les catégories de produits.
        if ( isset( $_GET['orderby'] ) && $_GET['orderby'] == 'custom_sort_order' ) {
            $query->set( 'meta_key', 'your_custom_meta_key' ) ; // Remplacez 'your_custom_meta_key' par votre clé méta réelle
            $query->set( 'orderby', 'meta_value_num' ) ; // Pour le tri numérique ; utilisez 'meta_value' pour le texte
            $query->set( 'order', 'DESC' ) ; // Définit l'ordre de tri (ASC ou DESC)
        }
    }
}
add_action( 'woocommerce_product_query', 'custom_product_sort' ) ; }
function custom_product_sort( $query ) {
    if ( ! is_admin() && $query->is_main_query() && is_shop() || is_product_category() ) { // Assurez-vous que cela n'affecte que la page de la boutique et les catégories de produits.
        if ( isset( $_GET['orderby'] ) && $_GET['orderby'] == 'custom_sort_order' ) {
            $query->set( 'meta_key', 'your_custom_meta_key' ) ; // Remplacez 'your_custom_meta_key' par votre clé méta réelle
            $query->set( 'orderby', 'meta_value_num' ) ; // Pour le tri numérique ; utilisez 'meta_value' pour le texte
            $query->set( 'order', 'DESC' ) ; // Définit l'ordre de tri (ASC ou DESC)
        }
    }
}
add_action( 'woocommerce_product_query', 'custom_product_sort' ) ; }
function custom_product_sort( $query ) {
    if ( ! is_admin() && $query->is_main_query() && is_shop() || is_product_category() ) { // Assurez-vous que cela n'affecte que la page de la boutique et les catégories de produits.
        if ( isset( $_GET['orderby'] ) && $_GET['orderby'] == 'custom_sort_order' ) {
            $query->set( 'meta_key', 'your_custom_meta_key' ) ; // Remplacez 'your_custom_meta_key' par votre clé méta réelle
            $query->set( 'orderby', 'meta_value_num' ) ; // Pour le tri numérique ; utilisez 'meta_value' pour le texte
            $query->set( 'order', 'DESC' ) ; // Définit l'ordre de tri (ASC ou DESC)
        }
    }
}
add_action( 'woocommerce_product_query', 'custom_product_sort' ) ; }

Comment trier et afficher des produits à l'aide de champs personnalisés

Vous pouvez ajoutervaleur en dollarspour que le filtre de tri contienne égalementnumériquerépondre en chantantTexte.

Pour faciliter la personnalisation du filtre, j'ajouterai deux options de tri :Trier par lieurépondre en chantantTrier par point de vente.

Attention :Placez le code suivant dans la sectionfichier functions.phpAu milieu.

// Étape 1 : Modifier les arguments de commande de WooCommerce pour prendre en charge les champs personnalisés pour le tri.
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 'points_awarded'.
            $args_sort_cw['orderby'] = 'meta_value_num' ;
            $args_sort_cw['order'] = 'DESC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'points' ; // Clé méta pour 'points' ; // Définit l'ordre de tri (ASC ou DESC).
            break ; // Meta key for 'points' ; // Meta key for 'points'.
        case 'location'.
            $args_sort_cw['orderby'] = 'meta_value' ;
            $args_sort_cw['order'] = 'ASC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'location' ; // Méta clé pour 'location'
            break ; }
    }
    return $args_sort_cw ;
}
add_filter('woocommerce_get_catalog_ordering_args', 'cw_add_postmeta_ordering_args' ) ;
// Etape 2 : Ajouter de nouvelles options de tri à la liste déroulante de WooCommerce
function cw_add_new_postmeta_orderby( $sortby ) {
    $sortby['location'] = __('Sort By Location', 'woocommerce' ) ;
    $sortby['points_awarded'] = __('Sort By Sale Point', 'woocommerce' ) ; return $sortby('points_awarded'] = __('Sort By Sale Point', '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' ) ; }
// Étape 1 : Modifier les arguments de commande de WooCommerce pour prendre en charge les champs personnalisés pour le tri.
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 'points_awarded'.
            $args_sort_cw['orderby'] = 'meta_value_num' ;
            $args_sort_cw['order'] = 'DESC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'points' ; // Clé méta pour 'points' ; // Définit l'ordre de tri (ASC ou DESC).
            break ; // Meta key for 'points' ; // Meta key for 'points'.
        case 'location'.
            $args_sort_cw['orderby'] = 'meta_value' ;
            $args_sort_cw['order'] = 'ASC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'location' ; // Méta clé pour 'location'
            break ; }
    }

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

// Etape 2 : Ajouter de nouvelles options de tri à la liste déroulante de WooCommerce
function cw_add_new_postmeta_orderby( $sortby ) {
    $sortby['location'] = __('Sort By Location', 'woocommerce' ) ;
    $sortby['points_awarded'] = __('Sort By Sale Point', 'woocommerce' ) ; return $sortby('points_awarded'] = __('Sort By Sale Point', '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' ) ; }
// Étape 1 : Modifier les arguments de commande de WooCommerce pour prendre en charge les champs personnalisés pour le tri.
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 'points_awarded'.
            $args_sort_cw['orderby'] = 'meta_value_num' ;
            $args_sort_cw['order'] = 'DESC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'points' ; // Clé méta pour 'points' ; // Définit l'ordre de tri (ASC ou DESC).
            break ; // Meta key for 'points' ; // Meta key for 'points'.
        case 'location'.
            $args_sort_cw['orderby'] = 'meta_value' ;
            $args_sort_cw['order'] = 'ASC' ; // Définit l'ordre de tri (ASC ou DESC)
            $args_sort_cw['meta_key'] = 'location' ; // Méta clé pour 'location'
            break ; }
    }

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

// Etape 2 : Ajouter de nouvelles options de tri à la liste déroulante de WooCommerce
function cw_add_new_postmeta_orderby( $sortby ) {
    $sortby['location'] = __('Sort By Location', 'woocommerce' ) ;
    $sortby['points_awarded'] = __('Sort By Sale Point', 'woocommerce' ) ; return $sortby('points_awarded'] = __('Sort By Sale Point', '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' ) ; }

Après avoir ajouté le code ci-dessus, le filtre de tri apparaîtra dans le champpage produitdans le menu déroulant. Cependant, il apparaît dans le menu de tri, mais l'article montre également comment afficher ces valeurs sur une page de produit unique.

Image [114] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Comment afficher les valeurs des champs personnalisés sur les pages de produits ?

Ajoutez l'extrait de code suivant pour afficher des champs tels que l'emplacement et le point de vente sur la page du produit. De même, tout champ personnalisé peut être affiché sur la page de la boutique en utilisant les mêmes valeurs méta.

function cw_shop_display() {
    global $product.
    // Obtenez des champs méta personnalisés pour chaque produit
    $location = get_post_meta( $product->get_id(), 'location', true ) ; $point_of_sale = get_post_meta( $product->get_id(), 'location', true )
    $points_of_sale = get_post_meta( $product->get_id(), 'points', true ) ;
    si ( ! empty( $location ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Lieu de travail.</span> ' . esc_html( $location ) . '</div>' ;
    }
    if ( ! empty( $point_of_sale ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Points de vente.</span> ' . esc_html( $point_de_vente ) . '</div>' ;
    }
    if ( $product->get_sku() ) {
        echo '<div class="product-meta">SKU : ' . esc_html( $product->get_sku() ) . '</div>' ;
    }
}
add_action('woocommerce_after_shop_loop_item', 'cw_shop_display', 9 ) ;
function cw_shop_display() {
    global $product.

    // Obtenez des champs méta personnalisés pour chaque produit
    $location = get_post_meta( $product->get_id(), 'location', true ) ; $point_of_sale = get_post_meta( $product->get_id(), 'location', true )
    $points_of_sale = get_post_meta( $product->get_id(), 'points', true ) ;

    si ( ! empty( $location ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Lieu de travail.</span> ' . esc_html( $location ) . '</div>' ;
    }
    if ( ! empty( $point_of_sale ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Points de vente.</span> ' . esc_html( $point_de_vente ) . '</div>' ;
    }

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

    // Obtenez des champs méta personnalisés pour chaque produit
    $location = get_post_meta( $product-&gt;get_id(), 'location', true ) ; $point_of_sale = get_post_meta( $product-&gt;get_id(), 'location', 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">Lieu de travail.</span> ' . esc_html( $location ) . '</div>' ;
    }
    if ( ! empty( $point_of_sale ) ) {
        echo '<div class="product-meta"><span class="product-meta-label">Points de vente.</span> ' . esc_html( $point_de_vente ) . '</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 ) ;

Chaque fois qu'un visiteur sélectionne une option de tri, la valeur correspondante change en conséquence. La capture d'écran suivante montre la fonctionTrier par lieu.

Image [115] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Par point de venteIl en va de même pour le tri.

Image [116] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

Si vous souhaitezModifier des produits individuelsvous devez définir un champ personnalisé pour le champValeur.

Image [117] - Aidez-moi à composer un titre SEO, des mots-clés SEO et une courte description SEO basée sur le contenu du blog, avec les mots-clés entre virgules !

En procédant ainsi, vous pouvez améliorer efficacement la fonctionnalité de tri et d'affichage des produits de votre boutique WooCommerce, améliorer l'expérience d'achat de vos clients et augmenter les taux de conversion. Vous pouvez choisir la méthode la plus appropriée pour optimiser l'affichage et le tri des produits en fonction de vos besoins et de la taille de votre boutique.


Contactez nous
Vous ne pouvez pas lire l'article ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
① Tel : 020-2206-9892
② QQ咨询：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
© Déclaration de reproduction
Cet article a été écrit par Banner1

Lien vers cet article :https://www.361sale.com/fr/28198
L'article est protégé par le droit d'auteur et doit être reproduit avec mention.

LA FIN
woocommerceTutoriel WordPressPlugin WooCommerce
# WooCommerce Plugin# page produit woocommerce# Tri des produits
Si vous l'aimez, soutenez-le.
félicitations54 partager (joies, avantages, privilèges, etc.) avec les autres
Banner1's avatar - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant
Recommandé
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires

Couvercle de l'utilisateur
Banner1's avatar - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant
文章目录
鲜嫩爽口大肥蛆的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

鲜嫩爽口大肥蛆4月21日 15:140

通过 FTP 禁用插件： 重命名 wordfence 插件文件夹，解除封锁。 后台解封 IP： 若能进入后台，去 Wordfence → Tools → Live Traffic 解封被拦 IP。 调整防火墙设置： 设置为“学习模式”，并将自己 IP 加入白名单。 必要时更换插件： 替换为 iThemes Security 或 All In One WP Security。
Le voleur sera l'avatar des tripes de rat - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant

lit. un voleur aura les tripes d'un ratBadge - Peu connu - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide18 avril 16:430

C'est un bon nom.
Kind rural people's avatar - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Des ruraux bienveillants18 avril, 11:390

Lorsqu'un plugin est en conflit avec un thème, ce qui entraîne un chargement lent de la page, vous pouvez vérifier les conflits en désactivant les plugins un par un, en mettant à jour les versions des plugins et des thèmes, en ajustant les paramètres des plugins pour réduire la consommation de ressources, en utilisant des outils de vérification de la compatibilité tels que "Health Check & Troubleshooting" pour résoudre le problème, et en activant les plugins de mise en cache et les outils d'optimisation pour améliorer les performances du site web et assurer la compatibilité des plugins et des thèmes ainsi que le chargement rapide du site. compatibilité des plugins et des thèmes et le chargement rapide du site.
Rouler sur l'avatar d'une grand-tante - Photon Fluctuations | Services professionnels de réparation de WordPress, dans le monde entier, réponse rapide

profiter de la grande tante et de l'oncle de qqn.17 avril 19:320

Lorsque WordPress affiche "Désolé, vous n'avez pas accès à cette page", c'est généralement parce que les autorisations du compte ont été modifiées de manière incorrecte. Il y a deux façons d'y remédier : si vous pouvez accéder à la base de données, vous pouvez modifier le champ des autorisations de l'utilisateur dans phpMyAdmin pour restaurer votre statut d'administrateur ; si vous ne pouvez pas vous connecter au backend ou manipuler la base de données, vous pouvez également ajouter temporairement un code au fichier functions.php du thème via FTP pour créer un nouveau compte d'administrateur afin de vous connecter au backend et de corriger les autorisations. Les deux méthodes peuvent restaurer efficacement les droits d'accès, il est recommandé de sauvegarder les données du site web avant l'opération.
Lexer's Avatar - Photon Flux Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Rexhausen16 avril 17:391

Si l'éditeur Elementor reste bloqué dans l'écran de chargement ou apparaît vide, ne vous inquiétez pas, c'est en fait assez commun et est généralement causé par la mise en cache, les conflits de plugin, les problèmes de thème ou le manque de mémoire. Vous pouvez essayer de le vérifier étape par étape : Tout d'abord, ouvrez le "Mode sans échec" d'Elementor pour voir s'il n'y a pas de conflit de plugin ou de thème. Désactivez temporairement le plugin de mise en cache, et videz le cache de votre navigateur et de votre site web en même temps. Essayez de remplacer votre thème par le thème par défaut de WordPress, tel que Twenty Twenty-Four, et testez si l'éditeur s'ouvre correctement. Vérifiez si la mémoire PHP dans Elementor > System Info est d'au moins 256M, si ce n'est pas le cas, demandez à votre administrateur de serveur de l'augmenter. Utilisez les outils de développement de votre navigateur (appuyez sur F12) pour voir s'il y a des erreurs rouges, ce qui vous aidera à localiser le problème plus rapidement. Assurez-vous qu'Elementor et les plugins que vous avez installés sont à jour, car les différences de version peuvent parfois causer des problèmes. Enfin, cliquer sur "Régénérer CSS" dans Elementor > Outils peut parfois résoudre les problèmes de chargement. Si vous avez essayé toutes ces choses et que cela ne fonctionne pas, vous devrez consulter les journaux d'erreurs de votre serveur ou envoyer votre site au support technique d'Elementor pour qu'il y jette un coup d'œil. La plupart du temps, ce problème est résolu, alors ne vous inquiétez pas trop.
Avatar d'un petit soldat - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

tirailleurs15 avril 16:170

Les raisons les plus courantes pour lesquelles l'éditeur WordPress perd du contenu après l'avoir sauvegardé sont les conflits de plugins ou de thèmes, les problèmes de cache, les échecs d'écriture dans la base de données, le blocage de l'API REST ou les interférences avec le navigateur. Il est recommandé de vérifier les plugins, de vider le cache, de changer le thème par défaut, de vérifier l'état du site et les journaux de débogage pour localiser le problème étape par étape.
Le voleur sera l'avatar des tripes de rat - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant

lit. un voleur aura les tripes d'un ratBadge - Peu connu - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide14 avril 17:590

Si les polices personnalisées ne fonctionnent pas dans WordPress, cela peut être dû à des chemins d'accès incorrects aux fichiers de police, à des sélecteurs CSS mal appliqués, à un formatage de police incompatible ou à des problèmes de priorité CSS. Assurez-vous que le fichier de police est chargé correctement et dans un format compatible, et vérifiez que les règles CSS sont appliquées correctement à l'élément cible. Si les paramètres du thème ont la priorité sur les polices personnalisées, ajustez également les paramètres correspondants. Videz également le cache et utilisez les outils de développement du navigateur pour vérifier si d'autres règles CSS remplacent les paramètres de police.
Zhejiang spotted hyena avatar - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Hyène tachetée du Zhejiang14 avril 17:111

Opération sur la base de données : Utilisez une requête SQL pour supprimer toutes les métadonnées liées à All in One SEO de la table wp_postmeta. Fonction de réinitialisation du plugin : Trouver l'option de réinitialisation ou d'effacement des données dans les paramètres du plugin All in One SEO. WordPress CLI : Utilisez l'outil de ligne de commande pour supprimer en masse les métadonnées liées au plugin. Suppression manuelle : Supprimez les informations SEO une par une via la page d'édition du backend de WordPress.