Aller au contenu principal

Shopify Widgets

attention

Shopify a désactivé l'ancienne application de widget privée/non publiée Sezzle. Si vous utilisez actuellement l'application Sezzle, veuillez mettre à jour l'application publique Sezzle Widget maintenant.

But

Augmentez l'AOV et les conversions en faisant la promotion de Sezzle sur votre vitrine. Installez facilement des ressources sur les pages de produits et de panier avec l'application Sezzle Widget.

Aperçu

  1. Installez l'application Sezzle Widget.
  2. Activez les widgets.
  3. Activez le bouton de paiement.

Conditions préalables

  1. Vous devez disposer d'un compte marchand Sezzle approuvé.
  2. Installez et configurez l'application Sezzle Payments.

Commencer

  1. Connectez-vous à l'administrateur Shopify de votre site Web.

  2. Installez l'application Sezzle Widget.

  3. Cliquez sur Installer.

    Autoriser

  4. Dans l'application Sezzle Widget, entrez votre clé API publique et cliquez sur Lier le compte Sezzle.

    • Pour la plupart des commerçants, nous sommes en mesure de pré-remplir la clé API publique en fonction de l'URL de la boutique Shopify.
    • Pour saisir la clé API manuellement, copiez-la depuis la page Clés API dans le Paramètres du tableau de bord marchand Sezzle.

    LinkAccount

Installation

Veuillez sélectionner UNE des méthodes d'installation suivantes :

Assistant d'installation

  1. Sélectionnez le thème que vous souhaitez modifier, puis cliquez sur Suivant.

❗️ Ce champ n'est pas par défaut votre thème en direct - vous devez faire une sélection.

AccountVerified

  1. Sélectionnez l'actif que vous souhaitez installer, puis cliquez sur Suivant.

    SelectAsset

  2. Sélectionnez la page sur laquelle vous souhaitez installer, puis cliquez sur Terminer.

    SelectPage

  3. Cliquez sur le bouton Activer.

❗️ Vous devez cliquer sur Activer pour que les modifications prennent effet.

Confirmer

  1. Personnaliser comme vous le souhaitez, puis cliquez sur Enregistrer.

Aller au dépannage

Installation en tant que blocs intégrés (manuel)

Si vous n'êtes pas déjà dans l'application, vous pouvez également activer les produits Sezzle directement à partir de la fenêtre de personnalisation de votre thème.

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur Personnaliser pour le thème que vous souhaitez modifier.

    Thèmes

  3. Dans le coin supérieur gauche, cliquez sur la troisième icône App Embeds.

  4. Recherchez Sezzle et activez le(s) produit(s) que vous souhaitez installer, puis personnaliser comme vous le souhaitez et cliquez sur Enregistrer.

    Activate-Widget-Embed

Aller au dépannage

Installation en tant que blocs d'application

Les blocs d'applications permettent aux commerçants de contrôler le placement des produits. Compatible avec les thèmes 2.0 uniquement.

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur Personnaliser pour le thème que vous souhaitez modifier.

    Thèmes

  3. Dans la barre d'outils supérieure, assurez-vous que la troisième icône Activer l'inspecteur est activée.

Installation du blocage d'application de widget sur la page produit

  1. Accédez à une page de produit.

  2. Passez la souris sur la zone où vous souhaitez afficher le widget.

  3. Si des blocs d'application peuvent y être placés, + ou Ajouter un bloc apparaîtra. Cliquez, puis sélectionnez Sezzle Widget sous l'onglet Applications.

    • Vous pouvez également ouvrir l'onglet Sections et cliquer sur Ajouter un bloc. Sous l'onglet Applications, sélectionnez Sezzle Widget. Faites glisser et déposez le bloc à l'emplacement souhaité dans le menu de contenu.

    Activer-PDP-Blocks

  4. Personnaliser comme vous le souhaitez, puis cliquez sur Enregistrer.

Installation du blocage d'application du widget et du bouton de paiement sur la page du panier

  1. Ajoutez un produit au panier.

  2. Accédez à la page du panier.

  3. Passez la souris sur la zone où vous souhaitez afficher un produit Sezzle.

  4. Si des blocs d'application peuvent y être placés, + ou Ajouter un bloc apparaîtra. Cliquez, puis sous l'onglet Applications, sélectionnez le produit.

    • Vous pouvez également ouvrir l'onglet Sections et cliquer sur Ajouter un bloc. Sous l'onglet Applications, sélectionnez Sezzle Widget. Faites glisser et déposez le bloc à l'emplacement souhaité dans le menu de contenu.
  5. Répétez les deux étapes précédentes pour l'autre produit, si vous le souhaitez.

    Activer-Cart-Blocks

  6. Personnaliser comme vous le souhaitez, puis cliquez sur Enregistrer.

Aller au dépannage

Personnalisations

La section suivante couvre les options de personnalisation disponibles via l'application.

Options de personnalisation des widgets

Personnaliser-Widgets

Taille de police

Par défaut : 14 px
Plage : 9 - 18 px
Étape : 0,5

Famille de polices

Par défaut : hériter
Options : (voir liste déroulante)

Options de personnalisation du bouton de paiement

Personnaliser-Bouton

Modèle

Par défaut : payer avec Sezzle
Alternative : Payer avec Sezzle

Thème

Par défaut : Lumière
Alternative : sombre

Rembourrage (gauche et droite uniquement)

Par défaut : 9 px
Plage : 0 - 30 px
Étape : 0,5

Marges (contrôlées individuellement)

Par défaut : 0
Plage : -20 - 20
Étape : 0,5

Largeur

Par défaut : auto
Alternatives : fit-content, 100 %

Emplacement par défaut
  • Si coché, le bouton de paiement Sezzle sera placé après le bouton de paiement natif et héritera des styles de page.
  • Si cette case n'est pas cochée, le bouton sera placé comme indiqué par l'emplacement du bloc d'application. Les styles peuvent également être affectés, en fonction de l'emplacement sélectionné.

CSS personnalisé

Si vous êtes familier avec CSS et souhaitez des personnalisations de style supplémentaires, vous pouvez les écrire directement dans votre thème.

  1. Dans le coin supérieur gauche, cliquez sur la deuxième icône Paramètres du thème.

  2. Développez la section CSS personnalisé et rédigez votre extrait personnalisé, puis cliquez sur Enregistrer.

    Personnaliser-Button-CSS

Dépannage

Besoin de mettre à jour la clé API

  • Vous devrez désinstaller et réinstaller l'application.

Duplication des widgets

  • Si vous utilisez des blocs d'applications et qu'il y a plusieurs éléments de prix sur la page, tous les widgets correspondants seront regroupés à l'emplacement du bloc d'applications. Pensez à passer aux blocs intégrés ou à [contacter le support Sezzle] (#demander-de-laide) pour mettre à jour le remplacement de la configuration.

Impossible de voir le widget

  • Les widgets ne s'afficheront que pour les adresses IP aux États-Unis et en Californie. Si vous regardez depuis un autre pays, veuillez utiliser un VPN.
  • Par défaut, les widgets s'affichent uniquement sur les produits jusqu'à 2 500 $.
  • Confirmez qu'une seule méthode d'installation est utilisée. De plus, n’utilisez qu’un seul bloc d’application de chaque produit par page.
  • Si vous utilisez des blocs d'applications, vérifiez que le widget n'a pas été placé plus bas sur la page.
  • Si vous utilisez un thème personnalisé ou un générateur de pages, les blocs d'application peuvent fonctionner là où les blocs d'intégration ne fonctionnent pas. Sinon, contactez le support Sezzle pour une configuration personnalisée.
  • Si vous aviez déjà implémenté des widgets avec un remplacement de configuration, veuillez contacter le support Sezzle pour mettre à jour le remplacement.
  • Si vous avez déjà ajouté du CSS ou du Javascript personnalisé pour masquer ou supprimer le widget Sezzle, assurez-vous de supprimer ces extraits de votre thème.

Impossible de voir le bouton de paiement

  • Si le bouton de paiement natif de Shopify n'a pas l'attribut attendu, les blocs d'application avec Placement par défaut décoché peuvent fonctionner.
  • Dans tous les autres cas, nous avons généralement recours à l'installation d'un [extrait de code manuel] (#checkout-button-manual-theme-code-snippet-installation). Contactez le support Sezzle si vous souhaitez de l'aide.

Problèmes de contenu ou d'emplacement

  • Si vous avez remarqué un bug dans le widget ou le bouton de paiement, veuillez contacter le support Sezzle pour nous informer du problème. Nous pouvons ensuite déterminer s'il s'agit d'un problème pour tous les commerçants ou pour votre thème spécifique et travailler pour le résoudre en conséquence.

Personnalisation

  • Nous proposons quelques options de personnalisation sélectionnées. Veuillez contacter l'assistance Sezzle pour demander l'un des éléments suivants :
    • Logo en niveaux de gris
    • Refléter le minimum de paiement dans le widget
    • Double widget Reflect Sezzle/Afterpay
    • Changements de style et de position
      • Pour les changements de position, vous devez utiliser l'option de bloc d'intégration.
    • Rendu conditionnel pour abonnement, cartes cadeaux, etc.
    • Rendu conditionnel au dessus d'un certain seuil de prix

Remarque : La mise en œuvre de personnalisations peut empêcher l'affichage des widgets sur des thèmes non publiés et nécessitera l'aide de l'équipe Sezzle pour mettre à jour les widgets lorsqu'un nouveau thème est publié.

Demander de l'aide

Si l'application Sezzle Widget n'est pas en mesure d'installer automatiquement le widget Sezzle ou le bouton de paiement sur votre vitrine, veuillez utiliser le formulaire de demande d'aide dans l'application pour contacter l'équipe Sezzle Merchant Integrations.

Le formulaire de demande d'aide dans l'application Sezzle Widget est destiné uniquement à l'aide des widgets et des boutons de paiement. Pour toute question concernant votre compte ou des problèmes avec l'option de paiement Sezzle lors du paiement, veuillez contacter Merchantsupport@sezzle.com.

L'équipe Sezzle Merchant Integrations ne répond pas aux demandes de renseignements. Si vous demandez une réponse ou si nous devons vous contacter concernant votre demande, nous transmettrons la réponse via notre équipe d'assistance aux commerçants.

Request-Help

Installation manuelle d'extraits de code de thème

Les installations qui nécessitent des modifications de code directement sur le thème ne sont pas recommandées, sauf si votre site utilise un CMS sans tête, et doivent être utilisées en dernier recours.

Installation manuelle de l'extrait de code du thème du widget

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur puis sur Modifier le code pour le thème que vous souhaitez modifier.

    Thèmes

  3. Dans l'Explorateur de Code, allez dans le dossier Layout et sélectionnez le fichier theme.liquid.

  4. Copiez+collez le script tout en bas du fichier

    Modèle de script à insérer dans votre page web :

    <script src="https://widget.sezzle.com/v1/javascript/price-widget?uuid={sezzle_merchant_uuid}"></script>
  5. Remplacez {sezzle_merchant_uuid} (y compris les accolades) dans le modèle de script par l'ID marchand de votre site, qui se trouve dans le Paramètres professionnels du tableau de bord des marchands Sezzle.

    Exemple avec la valeur de l'ID marchand mise à jour :

    <script src="https://widget.sezzle.com/v1/javascript/price-widget?uuid=12a34bc5-6de7-890f-g123-4hi5678jk901"></script>
  6. Cliquez sur Enregistrer.

Bouton de paiement Installation manuelle de l'extrait de code du thème

Pour installer le bouton de paiement directement sur le code de votre thème, veuillez vous référer à la documentation et à l'extrait sur Github.

Désinstallation

Désinstallation des blocs intégrés

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur Personnaliser pour le thème que vous souhaitez modifier.

    Thèmes

  3. Dans le coin supérieur gauche, cliquez sur la troisième icône App Embeds.

  4. Basculez le(s) bloc(s) d'intégration souhaité(s) en position OFF, puis cliquez sur Enregistrer.

    Désinstaller-Embed

Désinstallation des blocs d'application

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur Personnaliser pour le thème que vous souhaitez modifier.

    Thèmes

  3. Accédez à une page de produit.

  4. Dans le coin supérieur gauche, cliquez sur la première icône Sections.

  5. À côté du bloc Sezzle Widget, cliquez sur l'icône de la corbeille Supprimer, puis cliquez sur Enregistrer.

  6. Accédez à la page du panier et répétez l'étape précédente pour chaque produit, puis cliquez sur Enregistrer.

    Désinstaller-Block

Désinstallation de l'extrait de code du thème manuel

Vous ne devriez avoir besoin d'effectuer cette étape que si l'ancienne application privée Sezzle est installée ou si vous avez installé les produits manuellement.

  1. Dans Shopify Admin, accédez à Canaux de vente, puis à Boutique en ligne.

  2. Sous Thèmes, cliquez sur puis sur Modifier le code pour le thème que vous souhaitez modifier.

    Thèmes

  3. Consultez le fichier layout/theme.liquid pour tout extrait de code Sezzle. Supprimez-les, puis cliquez sur Enregistrer.

    • Répétez l'opération pour tous les fichiers contenant produit et panier dans le nom.
  4. Une fois toutes les références supprimées, recherchez également les fichiers contenant sezzle dans le nom et supprimez-les.

Désinstallation de l'application

  1. Allez dans Applications puis Sezzle Widget.
  2. Dans le coin supérieur droit, cliquez sur l'icône Menu, puis sélectionnez Paramètres de l'application.
  3. Cliquez sur Supprimer l'application.

La suppression de l'application supprimera automatiquement tous les blocs d'application et intégrera les blocs de tous les thèmes. Toute installation de changement de code ne sera pas supprimée automatiquement.

Désinstallation-Block