Comment installer ShareThis' Tools sur Shopify avec du code Javascript

Dans le cas où vous n'utilisez pas notre Application Shopify - Vous pouvez gérer les outils ShareThis sur Shopify à l'aide de l'onglet ShareThis Plate-forme, to do this, you will need to manually add the ShareThis <script> code inside the <head> of your site, simply follow the steps below:

  1. Connectez-vous ou  S'inscrire sur la plateforme ShareThis .
  2. Sélectionnez l'outil ShareThis que vous souhaitez utiliser et activez-le en cliquant sur le bouton<strong style="color: initial;"> Enable tool</strong> bouton. 
  3. Ensuite, personnalisez les boutons en sélectionnant votre réseaux sociaux, votre taille et votre forme.
  4. Sélectionnez le bouton Activer le code dans le coin supérieur droit. Dans la fenêtre pop-up, cliquez sur le bouton Copier le code.
  5. Connectez-vous à votre site Web Shopify.
  6. Dans la barre de navigation de gauche, sélectionnez Boutique en ligne > Thèmes, et dans la liste déroulante Actions, cliquez sur Modifier le code.
  7. À partir des différents fichiers et dossiers, allez dans Layout et cliquez sur theme.liquid.
  8. Copy and paste the unique ShareThis code that you copied from step 4 into the <head> section of your website.
  9. Si vous installez des outils en ligne, vous pouvez choisir entre :

Remarque : les outils en ligne nécessitent un bout de code supplémentaire pour fonctionner sur votre site. Si vous souhaitez installer nos boutons Boutons de partage en ligne ou Follow, vous devrez ajouter un code de placement en suivant les options ci-dessus à l'endroit où vous souhaitez que l'outil apparaisse

Avant de personnaliser votre thème, il est toujours recommandé de faire une sauvegarde. ces instructions pour dupliquer le thème afin de disposer d'une copie de sauvegarde au cas où vous voudriez revenir sur les modifications.


Ajout d'outils en ligne ShareThis à votre page de produits à l'aide d'un bloc liquide personnalisé

Vous pouvez utiliser l'éditeur de thème Shopify pour avoir un guide visuel lors du placement du code des boutons en ligne. Bien que cela ne soit pas limité à la page des produits, vous pouvez suivre ces instructions et la vidéo à la fin pour placer le code sur la description de votre produit.

  1. Accédez au tableau de bord de votre boutique en ligne.
  2. Cliquez sur Thèmes, puis sur le bouton vert intitulé Personnaliser.
  3. Rendez-vous sur la page où vous voulez que les boutons apparaissent en cliquant sur l'aperçu en direct.
  4. Placez votre souris à l'endroit où vous voulez insérer les boutons, un petit bouton bleu apparaîtra avec une étiquette Ajouter une section.
  5. Sélectionnez Liquide personnalisé dans la liste.
  6. Copiez et collez le code de placement correspondant dans la barre latérale gauche qui vient d'apparaître.
    1. Code de placement de Share Buttons :
    2. Suivez le code de placement des boutons :
  7. Cliquez sur Enregistrer dans le coin supérieur droit.

Pour vous faciliter la tâche, voici un aperçu :


Ajout d'outils Inline ShareThis à votre page produit en modifiant le code du thème

  1. Dans la barre de navigation de gauche, sélectionnez Boutique en ligne > Thèmes , puis cliquez sur Actions > Modifier le code.
  2. Dans la barre latérale gauche, descendez jusqu'au dossier Sections et sélectionnez main-product.liquid (si vous utilisez un ancien thème, allez dans Templates et localisez le fichier product.liquid ). Ensuite, trouvez le code suivant :
    {{ product.description }}
    Remarque: Vous pouvez utiliser Control + F pour rechercher le mot "description" (veillez à cliquer sur l'intérieur du fichier pour pouvoir rechercher le contenu dans l'éditeur de code), essayez de placer les boutons sur une nouvelle ligne après la ou les sections qui portent ce nom. Une section/élément est délimitée par le caractère "}" à la fin de celle-ci.

  3. Copiez et collez le code de placement correspondant au-dessus ou au-dessous de la description de votre produit.
    1. Code de placement de Share Buttons :
    2. Suivez le code de placement des boutons :

Pour vous faciliter la tâche, voici un aperçu :


Pour ajouter l'outil ShareThis à votre page ou blog

  1. Dans la barre de navigation de gauche, sélectionnez Boutique en ligne > Pages. Ensuite, cliquez sur la page sur laquelle vous souhaitez afficher vos boutons. 
  2. Cliquez sur le bouton Afficher HTML <> dans la section Contenu .
  3. Copiez et collez le code de placement approprié ci-dessous à l'endroit où vous souhaitez que l'outil ShareThis apparaisse.
    1. Code de placement de Share Buttons :
    2. Code de placement de Follow Buttons