Utilisation de l’éditeur d’identité de marque dans Checkout Blocks

Vous pouvez utiliser l’éditeur d’identité de marque dans Checkout Blocks, optimisé par l’API Checkout Branding, pour personnaliser l’esthétique de vos pages de paiement et de comptes sans avoir à modifier de code.

Vous pouvez utiliser l’éditeur d’identité de marque pour modifier les couleurs et les éléments de la page de paiement pour n’importe quelle configuration de paiement. Les modifications que vous apportez au design de votre page de paiement à l’aide de l’éditeur d’identité de marque s’appliquent à toutes les pages de votre processus de paiement, y compris la page de remerciement, la page de statut de commande et les nouvelles pages de comptes clients.

Pour lancer l’éditeur d’identité de marque depuis votre interface administrateur Shopify, cliquez sur Applications > Checkout Blocks, puis sur Éditeur d’identité de marque.

Personnaliser les couleurs de la page de paiement

Dans la section Couleurs, vous pouvez personnaliser les couleurs de base de votre page de paiement. Vous pouvez également personnaliser jusqu’à 4 combinaisons de couleurs qui s’appliquent à des sections individuelles lorsque vous souhaitez apporter des modifications plus détaillées à votre design. Vous pouvez modifier des types de couleurs, y compris les couleurs d’accentuation (pour les éléments interactifs, tels que les liens) et les couleurs de la marque (utilisées pour des éléments tels que les boutons principaux et secondaires).

Étapes :

Personnaliser les éléments de la page de paiement

Dans la section Personnalisations de l’éditeur d’identité de marque, vous pouvez modifier les éléments suivants de votre page de paiement :

• Favicon : choisissez l’icône qui s’affiche pour les clients dans l’onglet du navigateur lors du paiement.
• Global : ajustez le rayon des angles pour tous les éléments (champs de formulaire, boutons et cartes).
• En-tête et logo : sélectionnez la position de l’en-tête sur la page de paiement, et choisissez d’afficher ou non un fil d’Ariane, un lien vers le panier et un logo.
• Contenu principal : appliquez des schémas de design à la zone de contenu principale de la page de paiement, y compris des images de fond, des largeurs de bordure et des combinaisons de couleurs.
• Résumé de la commande : appliquez des schémas de design à la barre latérale de la page de paiement contenant le résumé de la commande du client, y compris des images de fond, des largeurs de bordure et des combinaisons de couleurs.
• Pied de page : sélectionnez la largeur du pied de page sur la page de paiement, et choisissez d’afficher ou non les politiques de la boutique.
• Typographie : sélectionnez la taille, la famille et la graisse de la police, ainsi que le crénage et la casse pour un maximum de 3 niveaux d’en-têtes.
• Boutons : sélectionnez l’espacement, les bordures et les styles des boutons principaux et secondaires.
• Formulaires : personnalisez les styles des champs de formulaire de paiement, tels que les cases à cocher, les champs de texte et les options sélectionnées dans une liste.
• Vignettes de produits : ajustez les styles de bordure et de rayon des angles pour les images de produits sur la page de paiement.

Étapes :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Dans la section Personnalisations, cliquez sur l’un des éléments que vous souhaitez personnaliser, par exemple En-tête et logo.

4. À l’aide des options de personnalisation disponibles, ajustez l’élément de la page de paiement selon vos préférences.

5. Cliquez sur Enregistrer.

Changer de configuration de paiement

Lorsque vous ouvrez l’éditeur d’identité de marque, vous modifiez la configuration de paiement qui est actuellement Active par défaut. Cependant, vous pouvez changer la configuration de paiement que vous souhaitez modifier à l’aide de l’éditeur d’identité de marque, ainsi que créer de nouvelles configurations de paiement.

En savoir plus sur la gestion de vos configurations de paiement actives et provisoires.

Étapes :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Cliquez sur le nom de la configuration de paiement actuelle pour ouvrir un menu déroulant contenant une liste de la configuration active ainsi que de toutes les configurations provisoires, puis sélectionnez la configuration de paiement que vous souhaitez personnaliser :

   • Sélectionnez une configuration existante que vous souhaitez modifier.
   • Cliquez sur ⊕ Créer une nouvelle configuration pour être redirigé vers les paramètres de Paiement de votre interface administrateur Shopify.

Prévisualiser votre page de paiement

Vous pouvez prévisualiser à tout moment les modifications que vous apportez dans l’éditeur d’identité de marque en sélectionnant la configuration de paiement que vous souhaitez prévisualiser, puis en cliquant sur Aperçu. L’éditeur de la page de paiement et des comptes se lance dans un onglet distinct avec toutes vos modifications appliquées afin que vous puissiez prévisualiser leur affichage sur la page de paiement.

Étapes :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Apportez toutes les personnalisations que vous souhaitez ajuster aux couleurs ou aux éléments de la configuration de votre page de paiement.

4. Cliquez sur Aperçu.

Exportation et importation des configurations de paiement

Vous pouvez exporter et importer des configurations de paiement à l’aide de fichiers JSON.

Exporter une configuration de paiement :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Sélectionnez la configuration de paiement à laquelle des personnalisations ont été appliquées à l’aide de l’éditeur d’identité de marque.

4. Cliquez sur Autres actions > Exporter la configuration.

La configuration de paiement est téléchargée sous la forme d’un fichier .json sur votre appareil local.

Importer une configuration de paiement :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Sélectionnez la configuration de paiement à laquelle vous souhaitez appliquer le profil d’identité de marque importé.

4. Cliquez sur Autres actions > Importer la configuration.

5. Dans la boîte de dialogue Importer l’identité de marque de la page de paiement, chargez votre fichier JSON d’identité de marque :

   1. Cliquez sur Ajouter un fichier.
   2. Sélectionnez le fichier JSON approprié sur votre appareil.
   3. Cliquez sur Importer et continuer.

6. Examinez la configuration de personnalisation préchargée. Modifiez-la si nécessaire.

7. Cliquez sur Enregistrer.

Réinitialiser le style de votre page de paiement

Lorsque vous modifiez une couleur ou un élément de la page de paiement à l’aide de l’éditeur d’identité de marque, vous pouvez rétablir la valeur par défaut en cliquant sur Réinitialiser à côté de la couleur ou de l’élément que vous avez modifié.

Vous pouvez à tout moment réinitialiser l’identité de marque de votre configuration de paiement aux valeurs par défaut de Shopify. La réinitialisation de la configuration de paiement efface toutes les personnalisations sur toutes les pages de l’éditeur d’identité de marque. Cette action est irréversible.

Étapes :

1. Depuis votre interface administrateur Shopify, accédez à Applications > Checkout Blocks.

2. Cliquez sur Éditeur d’identité de marque.

3. Sélectionnez la configuration de paiement que vous souhaitez réinitialiser.

4. Cliquez sur Réinitialiser par défaut.

5. Dans la boîte de dialogue Réinitialiser les styles par défaut ?, cliquez sur Continuer.