Shortcodes WooCommerce : toutes les informations que vous devez connaître

Publié: 2021-07-05

Vous voulez en savoir plus sur les shortcodes WooCommerce ?

Nous avons ce qu'il vous faut!

Maintenant, si vous pensez que les codes courts ont quelque chose à voir avec le codage.

Alors il n'y a rien de tel.

Vous n'avez pas à écrire de code long et long.

Les shortcodes, comme leur nom l'indique, sont de petits morceaux de code mais peuvent faire plusieurs fonctionnalités.

C'est parfaitement bien si vous n'avez jamais rencontré les "shortcodes" auparavant.

Parce que nous sommes là pour vous donner des informations complètes sur les shortcodes WooCommerce et sur la manière dont vous pouvez les mettre en œuvre.

Vous pouvez placer les Shortcodes sur votre page produit, vos barres latérales, votre widget, etc.

Ce qu'ils font, c'est qu'ils peuvent simplifier l'expérience d'achat, améliorer les flux d'achat des utilisateurs et optimiser votre boutique en ligne pour les conversions.

Non seulement cela, mais vous pouvez également afficher les meilleurs produits sur la page d'accueil, les produits associés, mettre en évidence les produits en vedette, etc.

Dans ce guide, nous allons partager avec vous toutes les informations relatives aux Shortcodes WooCommerce.

Vous saurez comment ils peuvent vous aider à offrir de meilleures expériences utilisateur, leurs avantages, comment vous pouvez les utiliser efficacement et bien plus encore.

Passons directement à nos "WooCommerce Shortcodes" sans perdre plus de temps.

Contenu afficher
  • Que sont exactement les codes abrégés ?
  • Que sont les codes courts WooCommerce ?
  • Les shortcodes sont-ils utiles ?
  • Quels sont les avantages des codes courts ?
  • Comment utiliser les codes courts WooCommerce ?
  • Liste des codes abrégés WooCommerce
    • Codes abrégés des pages :
    • Codes abrégés des produits :
    • Code abrégé de la page produit :
    • Shortcodes de produits associés :
    • Ajouter au panier Shortcode :
    • Code abrégé de plusieurs produits :
    • Code abrégé du champ de recherche de produits :
  • Plugins de codes courts WooCommerce
  • Savez-vous comment fonctionnent les codes courts WooCommerce ?
  • Comment réparer si les codes courts ne fonctionnent pas ?
  • Que devez-vous savoir d'autre sur les codes abrégés WooCommerce ?

Que sont exactement les codes abrégés ?

Il est évident d'en venir à cette question « qu'est-ce que c'est que les Shortcodes ? quand on n'y connait pas grand chose.

Ainsi, les shortcodes sont des codes spéciaux dans WordPress qui sont représentés par des crochets [shortcodes] pour ajouter plusieurs fonctionnalités à votre boutique de commerce électronique.

Cela contribue à rendre votre magasin plus agréable et vos clients peuvent le trouver plus intuitif à utiliser.

De plus, vous pouvez utiliser des codes abrégés pour rendre votre page d'accueil plus personnalisée et plus intéressante pour les utilisateurs.

Que sont les codes courts WooCommerce ?

Maintenant, les shortcodes WooCommerce ne sont pas une nouveauté.

WooCommerce est l'une des plateformes de commerce électronique les plus utilisées que les autres.

Il a également une grande variété de shortcodes.

Par exemple, si vous souhaitez afficher les produits associés au bas de la page du produit.

Au lieu de compter sur les développeurs, vous pouvez utiliser vous-même le shortcode du produit associé.

En utilisant Shortcodes, il y aura beaucoup plus de facilité et de commodité.

Cependant, ajouter des produits connexes est beaucoup plus facile.

Disons que si vous voulez voir les 5 produits associés, appliquez alors le shortcode :

 [related_products per_page="5"]

Vous pouvez utiliser ce code partout où vous souhaitez afficher les produits associés.

Produit connexe

Les shortcodes sont-ils utiles ?

Si vous pensez toujours que les codes courts ne sont pas utiles, voici ce que vous devez savoir.

Les codes courts vous permettent de faire beaucoup plus de choses, ce qui signifie que vous pouvez afficher librement vos produits, ajouter un bouton d'appel à l'action où vous souhaitez les afficher.

Les shortcodes sont utiles, ils vous libéreront des codes complexes plus longs.

En dehors de cela, les codes abrégés sont très utiles lorsque vous gérez une boutique de commerce électronique.

Vous pouvez offrir à votre client un peu plus que vos concurrents.

COMMENT?

Vous pouvez les attirer avec des shortcodes, vous pouvez également augmenter vos conversions avec des shortcodes.

Vous pouvez rapidement ajouter un bouton d'appel à l'action sur votre site à l'aide de Shortcodes.

Les shortcodes sont limités à cela, mais ils peuvent même vous aider à créer une grille d'articles en vente à montrer aux clients.

Il n'y a presque aucune limite avec les codes courts lorsqu'il s'agit de personnaliser votre boutique.

Quels sont les avantages des codes courts ?

Oui, il y a certains avantages à utiliser les Shortcodes.

Le premier facteur important est la flexibilité , ce qui signifie que vous pouvez modifier l'apparence de votre boutique en utilisant des codes abrégés.

Vous pouvez facilement personnaliser le thème et l'utiliser pour offrir une expérience meilleure et plus personnalisée à vos clients.

Quoi de plus intéressant ?

Les codes abrégés élimineront complètement le besoin d'écrire de longs codes et, par conséquent, ils vous feront gagner du temps.

De plus, vous pouvez effectuer plusieurs transactions à la fois.

Comment utiliser les codes courts WooCommerce ?

Comme nous vous l'avons dit à plusieurs reprises ci-dessus, les shortcodes sont un petit morceau de code que vous pouvez placer n'importe où sur votre site.

De plus, vous n'avez pas besoin d'apprendre le codage pour utiliser des codes abrégés.

Ici, nous allons vous dire que vous pouvez utiliser des shortcodes :

Ajoutez simplement le shortcode dans l'éditeur de texte de WordPress ou vous pouvez également utiliser le bloc de shortcode (si vous utilisez Gutenberg ou Elementor ou tout autre constructeur de page).

De plus, plusieurs shortcodes peuvent être combinés et affichés sur une seule page.

Vous pouvez vérifier la capture d'écran ci-dessous pour voir à quoi cela ressemble d'avoir deux codes abrégés sur la même page.

Liste des codes abrégés WooCommerce

Voici la liste de tous les shortcodes essentiels de WooCommerce.

Voyons ce que chacun de ces Shortcodes a à offrir et comment vous pouvez les utiliser.

Codes abrégés des pages :

Cependant, WordPress est livré avec quatre pages par défaut qui fournissent des codes abrégés, vous n'aurez donc pas à les ajouter manuellement.

Si dans certains cas, vous n'obtiendrez pas les shortcodes, vous recréez les pages avec les shortcodes.

  • Chariot
  • Vérifier
  • Mon compte
  • Suivi de commande

1.1. Panier WooCommerce :

Code abrégé du panier
 Shortcode : [woocommerce_cart]
Code abrégé du panier

Le panier d'achat WooCommerce vous permet de représenter le panier d'achat du client sur le front-end de votre site Web.

Vous pouvez utiliser ce code pour l'ajouter à des pages ou des publications WordPress ou l'afficher dans des zones widgetisées (comme la barre latérale).

Lorsque vous installez et activez WooCommerce sur votre site Web, il créera automatiquement des pages par défaut qui incluent la page Panier, qui utilise ce shortcode.

Code abrégé du panier

Le shortcode peut être utilisé pour connecter le panier à d'autres parties de votre site.

1.2. Page de paiement WooCommerce :

Page de paiement WooCommerce
 Shortcode : [woocommerce_checkout]

En utilisant ce shortcode sur votre site, vous pouvez créer une page de paiement complète sur votre site de commerce électronique.

Cette page est également créée automatiquement lorsque vous installez WooCommerce.

Page de paiement WooCommerce

Le shortcode de paiement WooCommerce comprend souvent des informations de facturation, des informations de commande et la possibilité d'expédier à une adresse différente.

1.3. Mon compte:

 Shortcode: [woocommerce_my_account]
Mon compte WooCommerce

MAINTENANT, WooCommerce créera également automatiquement ma page de compte dès que vous l'installerez.

WooCommerce Mon compte 2

De plus, cette section comprend vos informations personnelles telles que votre nom, votre adresse e-mail, votre numéro de téléphone et toutes les autres informations nécessaires pour créer un compte sur la boutique WooCommerce.

1.4. Formulaire de suivi de commande :

 Shortcode: [woocommerce_order_tracking]
Shortcode de suivi des commandes WooCommerce

Cependant, cette page est différente des trois autres mentionnées ci-dessus.

Cette page n'est pas générée automatiquement. Vous devez créer la page en ajoutant le shortcode dans l'éditeur de texte pour faire le vôtre.

Maintenant, ce qui va se passer, c'est que vos clients peuvent voir et suivre l'état de leurs commandes en cours.

Codes abrégés des produits :

Les codes abrégés des produits vous offriront des fonctionnalités puissantes lorsqu'ils seront implémentés dans votre magasin.

Lorsque vous l'ajouterez, la page d'accueil et les pages de produits de votre boutique changeront radicalement.

Ce code affiche les catégories de produits ainsi qu'une liste modifiée ou un type de liste.

Vous permet d'afficher l'identifiant, le SKU, le nom, les balises et le tri aléatoire d'un produit, entre autres.

Vous n'aurez plus besoin de mettre à jour les attributs de produit une fois que vous leur aurez ajouté un shortcode.

Les données de la page précédente seront automatiquement récupérées.

Jetons un coup d'œil aux différents shortcodes disponibles pour vos produits.

2.1. Afficher les produits dans un ordre spécifique

Commande de produit WooCommerce

Si vous souhaitez afficher vos produits dans un ordre bien précis, alors voici le shortcode à utiliser :

 Shortcode: [products ids="23, 13, 12, 11, 24, 16" orderby="post__in"]

2.2. Produits recents

Vous savez peut-être que chaque boutique WooCommerce propose des options pour votre quête récente afin de vous rappeler ce que vous recherchiez auparavant.

Produits récents Shortcode
 Shortcode: [recent_result per_page=”8″ columns=”4″ orderby=”date” order=”ASC/DESC”]

2.3. Articles de vente au hasard

Utilisez le shortcode ci-dessous pour afficher les articles de vente aléatoires.

Vente aléatoire Shortcode
 Shortcode: [result limit=”n” columns=”n” orderby=”most-approved” class=”sale” on_sale=”true/false”]

2.4. Produit de catégorie supérieure

Si vous souhaitez afficher les produits de la catégorie de niveau supérieur, envisagez d'utiliser ce shortcode.

Du côté de la vitrine, ce code affichera tous les produits de la catégorie de niveau supérieur.

produit de catégorie supérieure
 Shortcode: [result_categories number=”0″ parent=”0”]

2.5. Produit d'une étiquette particulière

Utilisez ce shortcode simple pour afficher les balises du produit.

balise particulière
 Shortcode: [result tag=”t-shirt”]

Soit résultat = produit

Code abrégé de la page produit :

Il s'agit d'un autre type de shortcode WooCommerce que vous pouvez utiliser pour présenter différentes pages de produits en utilisant deux attributs :

  • ID de produit et SKU.
Code abrégé de la page produit

Voici les deux shortcodes que vous pouvez utiliser :

 Shortcode: [product_page]
 Shortcode: [product_page sku="hoodie"]

Shortcodes de produits associés :

Un shortcode très précieux et utile.

Vous devez utiliser ce shortcode car chaque fois que votre client se trouve sur votre page produit, il est plus susceptible d'explorer les produits associés.

Tout comme Amazon, vous aurez les produits associés juste en dessous de votre produit actuel.

Comment va-t-il booster vos conversions ?

Disons que quelqu'un fait des recherches sur le "sac de sport", ce qui signifie que votre client pourrait avoir besoin d'autres produits liés à la salle de sport.

C'est pourquoi montrer le produit associé aide à augmenter vos ventes.

 Shortcode: [related_products per_page="5"]
Produit associé

Si vous souhaitez afficher 6 produits associés, changez simplement la valeur en 6.

Ajouter au panier Shortcode :

L'utilisation du shortcode "Ajouter au panier" est un autre moyen formidable d'améliorer l'expérience de votre utilisateur.

Comment est-ce Google pour vous aider à augmenter vos ventes ?

Par exemple, vous pouvez utiliser ce shortcode sur votre blog ou toute autre page où votre client peut directement ajouter des produits à son panier.

Shortcode WooCommerce pour ajouter au panier
 Shortcode: [add_to_cart sku="loafers"]

De plus, si vous souhaitez rediriger vos acheteurs vers une autre URL au lieu d'ajouter un article au panier.

Shortcode WooCommerce pour ajouter au panier

Vous pouvez utiliser ce raccourci pour modifier le bouton Ajouter au panier de WooCommerce.

 Shortcode: [add_to_cart_url]

Code abrégé de plusieurs produits :

Il est maintenant trop facile d'utiliser plusieurs produits à l'aide de codes abrégés.

 Shortcode: [products ids=”1, 2, 3, 4, 5″]
 Shortcode: [products ids=”1, 2, 3″ orderby=”date” columns=”3″ order=”desc”]

Vous pouvez afficher les multiples produits (sélectionnés) sur une page ou publier avec des boutons d'affichage rapide.

Cependant, vous pouvez modifier le shortcode en fonction de vos besoins.

Code abrégé du champ de recherche de produits :

Un autre shortcode encore utile.

 Shortcode: [woocommerce_product_search]

Vous pouvez utiliser ce shortcode pour ajouter des fonctionnalités de recherche et de filtrage en direct à votre page ou à votre section de blog.

Plugins de codes courts WooCommerce

En ce qui concerne les plugins, il existe des tonnes de plugins Shortcode.

Mais qu'est-ce qui sera le mieux pour vous ?

Cependant, nous vous recommandons d'utiliser le plugin de codes courts WooCommerce de WooThemes.

Et la bonne nouvelle est que son utilisation est entièrement gratuite.

Après avoir activé le plugin, vous verrez un bouton déroulant vers l'éditeur de texte WordPress.

Cela vous donnera un accès rapide à tous les codes abrégés WooCommerce intégrés.

Non seulement cela, mais cela élimine également le besoin de copier et coller les codes abrégés.

Savez-vous comment fonctionnent les codes courts WooCommerce ?

Maintenant que vous en savez beaucoup sur les Shortcodes, découvrons également comment fonctionnent les Shortcodes.

Bien que les shortcodes semblent simples, ils sont aussi les plus robustes.

Vous savez comment les shortcodes sont écrits, un seul mot ou un ensemble de mots liés à des traits de soulignement.

Voici les échantillons :

  • [exemple_shortcode]
  • [get_recent_comments]
  • [woocommerce_product_search]

Les shortcodes fonctionnent différemment, certains shortcodes fonctionnent seuls, tandis que d'autres fonctionnent avec certains paramètres.

Paramètres

Maintenant, comment fonctionnent les paramètres ?

Paramètres également appelés arguments, le travail des paramètres est qu'ils sont les
des lignes supplémentaires qui rendent l'action du shortcode plus spécifique.

La fonction des paramètres est qu'ils sont des lignes supplémentaires qui rendent l'action du shortcode plus spécifique.

Cependant, il faut savoir que les paramètres sont utilisés par la majorité des shortcodes WooCommerce, ils ne sont pas utilisés par tous.

Comment réparer si les codes courts ne fonctionnent pas ?

Si parfois, les shortcodes WooCommerce ne fonctionnent pas correctement.

Vous devez savoir comment vous pouvez le résoudre.

Ce qui se passe, c'est que vous collez le bon shortcode WooCommerce dans l'éditeur de texte, mais il ne s'affiche pas correctement ou vous donne une mauvaise sortie.

Ici, ce que vous devez faire, c'est vous assurer que le shortcode n'a pas été intégré par erreur dans les balises pre>.

Vous pouvez toutefois supprimer ces balises à l'aide de l'éditeur de texte HTML.

Que devez-vous savoir d'autre sur les codes abrégés WooCommerce ?

Nous avons à peu près terminé avec les codes abrégés WooCommerce ici.

Les codes courts vous éviteront d'avoir à écrire de longs codes et vous aideront à personnaliser votre boutique.

Nous pouvons voir que les codes abrégés WooCommerce sont des extraits de fonctionnalités incroyablement utiles qui aideront tout propriétaire de magasin qui utilise cette plate-forme.

Ils sont également extrêmement utiles et pratiques lorsqu'il s'agit d'améliorer l'expérience de votre acheteur ou de rationaliser la navigation et le paiement de votre magasin.

Alors combien et comment allez-vous utiliser les shortcodes WooCommerce ?