Qu'est-ce que les codes courts WooCommerce

Publié: 2021-10-04

Les shortcodes WooCommerce peuvent ne pas être familiers à certains utilisateurs. Même si vous avez une boutique WooCommerce, il peut s'agir d'une fonctionnalité que vous n'avez jamais vue auparavant et dont vous ignorez à quel point elle peut être bénéfique pour saupoudrer des références de produits et acheter des boutons d'appel à l'action sur votre site.

Cet article sera un guide complet des Shortcodes WooCommerce .

Masquer le contenu
1 Shortcodes WooCommerce
2 raisons pour lesquelles vous devriez utiliser les codes courts WooCommerce
3 Fonctionnement des codes courts WooCommerce
3.1 Code abrégé
3.2 Paramètres
4 Liste des codes abrégés WooCommerce
4.1 [woocommerce_cart]
4.2 [woocommerce_checkout]
4.3 [woocommerce_mon_compte]
4.4 [woocommerce_order_tracking]
4.5 [produits]
5 Personnalisez la mise en page à l'aide des codes courts WooCommerce
5.1 1. colonne
5.2 2. commande
5.3 3. commander par
5.4 4. classe
6 Apprenez les codes abrégés de dépannage
6.1 Le shortcode est situé entre les balises < pre >
6.2 Les guillemets sont courbés plutôt que droits
7 Résumé

Codes courts WooCommerce

Les shortcodes WooCommerce vous permettent d'afficher les données de votre boutique de manière nouvelle et attrayante. WooCommerce est pré-chargé avec des codes abrégés, et vous pouvez en ajouter d'autres en installant des plugins.

Les shortcodes WooCommerce sont de minuscules extraits de code qui peuvent être utilisés n'importe où sur votre site pour afficher des produits WooCommerce ou des appels à l'action comme les boutons "Acheter maintenant" . Il existe de nombreuses applications pour celles-ci, et nous avions l'intention d'inclure d'excellents exemples directement dans notre thème Shoptimizer WooCommerce . Bien entendu, ils doivent également être compatibles avec tout thème fourni pour WooCommerce.

Raison pour laquelle vous devriez utiliser les codes courts WooCommerce

Les shortcodes sont un moyen simple de personnaliser votre boutique WooCommerce. Vous pouvez créer le site de commerce électronique de votre choix en collant un shortcode.

Vous contrôlez quels produits sont affichés, comment ils sont disposés et combien apparaissent sur chaque page. Vous pouvez également inclure des boutons Ajouter au panier à des endroits stratégiques, par exemple vers la conclusion de vos publications.

Fonctionnement des shortcodes WooCommerce

Bien qu'ils semblent simples, les shortcodes sont assez puissants ! Passons en revue les différents composants d'un shortcode.

Petit code

Les shortcodes WooCommerce sont des mots simples ou des groupes de mots liés par des traits de soulignement, comme ceci :

  • [des produits]
  • [woocommerce_order_tracking]

Alors que certains shortcodes peuvent être utilisés sans aucun paramètre, certains le font. Jetons un coup d'œil aux paramètres WooCommerce pour les shortcodes.

Paramètres

Les paramètres ou arguments sont des lignes supplémentaires qui rendent le fonctionnement du shortcode plus précis. La plupart des shortcodes WooCommerce, mais pas tous, utilisent des paramètres.

Liste des codes courts WooCommerce

Jetons un coup d'œil à certains des codes courts WooCommerce les plus essentiels.

Liste des codes courts WooCommerce

[woocommerce_cart]

La fonctionnalité de panier WooCommerce est ajoutée à la page en utilisant ce shortcode. En d'autres termes, il affichera tous les produits que le client a placés dans son panier. Ce shortcode n'a aucun paramètre.

[woocommerce_checkout]

Ce shortcode affiche la page de paiement. Parce qu'il s'agit d'un élément essentiel de votre organisation, assurez-vous que la page est correctement paramétrée. Après tout, si un consommateur ne trouve pas la caisse, il n'achètera rien.

Il n'y a pas de paramètres supplémentaires pour la page de paiement comme il y en a pour [woocommerce cart] .

[woocommerce_my_account]

Celui-ci affiche la page Mon compte, qui comprend toutes les informations du client et les commandes antérieures de votre entreprise. Le nombre de commandes affiché par défaut est fixé à 15. En changeant le nombre à -1, vous pouvez le forcer à afficher toutes les commandes.

[woocommerce_order_tracking]

Ce shortcode génère une page de "suivi de commande" , permettant aux consommateurs de voir l'état actuel de leurs commandes. Il n'y a pas d'autres contraintes.

[des produits]

Le prochain sur notre liste est le shortcode [products], l'un des shortcodes les plus puissants et les plus couramment utilisés de WooCommerce. Il, comme vous vous en doutez, montre vos articles. Cependant, vous pouvez utiliser plusieurs facteurs pour modifier les types et les quantités d'articles proposés.

Pour ajouter un paramètre, saisissez son nom entre guillemets, suivi du signe égal et de la valeur souhaitée. Assurez-vous que cela se trouve dans le shortcode [productss] .

Personnalisez la mise en page à l'aide des codes courts WooCommerce

Personnalisez la mise en page à l'aide des codes courts WooCommerce

Quelques réglages vous permettent de modifier la mise en page de vos pages produits.

1. colonne

Cette option spécifie le nombre de colonnes. Il est défini sur 4 par défaut, cependant, sur mobile, il se réduit généralement à un nombre inférieur.

Par exemple : [colonnes de produits = "3"]

2. commande

Cela contrôle si l'ordre sera croissant (ASC) ou décroissant (DESC) en fonction du paramètre orderby . Il est défini sur ASC par défaut.

F ou Exemple : [commande de produits =" ASC »]

3. commander par

Ce paramètre offre de nombreux choix pour personnaliser la disposition de vos marchandises. Par défaut, ils seront triés par le titre du produit.

Vous pouvez inclure plusieurs options en les séparant par un seul espace.

  • date : cela organise les marchandises en fonction de la date de publication (nouveau premier)
  • id : cette option commande des marchandises en fonction de leur ID de poste
  • ordre du menu : cela commandera les produits en fonction de l'ordre du menu (numéros inférieurs en premier)
  • popularité : les marchandises seront commandées en fonction du nombre d'achats (le plus important en premier)
  • rand : Affiche les marchandises dans un ordre aléatoire. Les sites qui utilisent des plugins de mise en cache peuvent avoir des problèmes.
  • rating : Cela triera les marchandises en fonction de leur note moyenne, du plus élevé au plus bas.

Par exemple : [produits orderby="date"]

4. classe

Cela ajoute une classe wrapper HTML à l'élément, vous permettant de le styliser avec CSS.

Par exemple : [classe de produits = "élément personnalisé"]

Apprenez les codes abrégés de dépannage

Passons en revue certaines des difficultés les plus courantes qui empêchent les shortcodes de fonctionner.

Le shortcode est situé entre les balises < pre >

Lorsque vous ajoutez un shortcode à un site Web, assurez-vous qu'il ne se trouve pas dans les balises <pre>, qui sont destinées à afficher (plutôt qu'à exécuter) le code.

Les guillemets sont courbés plutôt que droits

Une autre erreur typique est lorsque les guillemets (utilisés avec des paramètres) sont inclinés, ou "bouclés", plutôt que droits. Les guillemets bouclés ne fonctionneront pas avec les paramètres.

Résumer

Voilà, nous espérons que vous avez tout appris sur les étapes faciles pour la suppression des logiciels malveillants WordPress , et pour le visiteur qui nous a demandé d'écrire un article sur les étapes faciles pour la suppression des logiciels malveillants WordPress . nous avons un article dédié à ce sujet.

En essayant de répéter notre discussion, voici quelques points clés :

  • Codes courts WooCommerce
  • Raison pour laquelle vous devriez utiliser les codes courts WooCommerce
  • Fonctionnement des shortcodes WooCommerce
  • Liste des codes courts WooCommerce
  • Personnalisez la mise en page à l'aide des codes courts WooCommerce
  • Apprenez les codes abrégés de dépannage

Si vous avez apprécié cet article, abonnez-vous à nos didacticiels vidéo WordPress sur la chaîne YouTube . N'oubliez pas de nous suivre sur Pinterest.

Nous acceptons toutes sortes de suggestions de visiteurs, car elles nous motivent continuellement à nous améliorer. N'hésitez pas à commenter ci-après.