> Composeur de bracelets Shopify sans application : tuto
Loch Ness · Le journal
Ajouter le composeur de bracelets à votre boutique Shopify en 5 minutes
Par Camille G., fondatrice de Loch Ness · Publié le 12 juillet 2026 · Lecture ≈ 6 min
capture pwa
À propos de l'autrice
Camille G. crée des bijoux artisanaux et symboliques depuis 2013. Développeuse full-stack, elle conçoit et code elle-même le composeur présenté ici, avec plusieurs contributions à des projets open source à son actif. Ce double regard — artisanal et technique — lui permet de maîtriser aussi bien l'expérience client que la solution qui la fait tourner. Chercheuse et artisane d'art, elle publie ses travaux sous l'identifiant ORCID 0009-0009-0364-6396. Cet article s'appuie à la fois sur cette expérience de terrain et sur la documentation officielle Shopify, citée en fin de page.
Vous vendez des bracelets en pierres et vous aimeriez que vos clients composent le leur, en direct, sur votre boutique ? Bonne nouvelle : sur Shopify, cela se fait sans installer aucune application et sans toucher au code de votre thème. Ce tutoriel vous montre, étape par étape, comment ajouter le composeur Loch Ness à votre site en quelques minutes.
1. Ce dont vous avez besoin avant de commencer
L'intégration repose sur une méthode simple et éprouvée : le composeur est chargé dans votre page via un cadre sécurisé (une « iframe »). Concrètement, le composeur reste hébergé sur nos serveurs et s'affiche chez vous : vous n'avez rien à héberger, rien à mettre à jour, et vous bénéficiez automatiquement des dernières améliorations.
Deux choses seulement sont nécessaires : votre identifiant abonné (fourni par Loch Ness à l'activation de votre compte, par exemple ma-boutique), et un thème Shopify récent. Tous les thèmes édités depuis 2021 — dont Dawn, le thème par défaut — intègrent d'origine le bloc nécessaire.
2. Ajouter le composeur, pas à pas
Rendez-vous dans votre administration Shopify, puis suivez ces cinq étapes :
1. Allez dans Boutique en ligne → Thèmes, puis cliquez sur Personnaliser.
2. Ouvrez la page où vous voulez afficher le composeur (une page dédiée « Composez votre bracelet », ou une fiche produit).
3. Cliquez sur Ajouter une section (ou Ajouter un bloc), et choisissez Contenu Liquid personnalisé.
4. Collez le code de la section 3 ci-dessous, en remplaçant VOTRE-IDENTIFIANT par le vôtre.
5. Cliquez sur Enregistrer. Le composeur apparaît immédiatement dans l'aperçu.
En pratique. Beaucoup de créatrices préfèrent créer une page dédiée intitulée « Composez votre bracelet » et la mettre dans le menu principal. Le composeur y respire mieux qu'au milieu d'une fiche produit, et le lien est facile à partager sur Instagram ou par message.
3. Le code à coller
Copiez le bloc ci-dessous et collez-le dans le champ Contenu Liquid personnalisé. Pensez simplement à remplacer VOTRE-IDENTIFIANT par l'identifiant que Loch Ness vous a communiqué.
<div class="ln-composeur" style="max-width:900px;margin:0 auto;background:#f7f5f0;border:1px solid #d8d4c8;border-radius:12px;overflow:hidden;"> <iframe src="https://visual.scaleyourshop.app/?client=VOTRE-IDENTIFIANT" style="width:100%;height:900px;border:0;display:block;" loading="lazy" title="Composeur de bracelet" allow="clipboard-write"></iframe> </div> <style>@media (max-width:768px){.ln-composeur iframe{height:680px;}}</style>
Pour copier : cliquez dans le cadre sombre ci-dessus, faites Ctrl+A (ou ⌘+A sur Mac) pour tout sélectionner, puis Ctrl+C (ou ⌘+C) pour copier.
Astuce : évitez de coller ce code dans la description d'un produit via l'éditeur de texte classique. Shopify y filtre parfois les cadres iframe. Le bloc « Contenu Liquid personnalisé », lui, n'applique aucun filtre.
4. Version anglaise et questions fréquentes
Vous vendez à l'international ? Pour afficher le composeur en anglais, remplacez simplement l'adresse par : https://visual.scaleyourshop.app/index-en.html?client=VOTRE-IDENTIFIANT. Le reste du bloc ne change pas.
Le composeur s'adapte-t-il à ma charte ? Oui. Vos couleurs, votre logo, vos prix et votre sélection de pierres sont liés à votre identifiant. Il suffit de nous transmettre vos préférences et nous configurons le composeur à votre marque.
Et sur mobile ? Le composeur est pensé pour le tactile et s'affiche parfaitement sur téléphone. La hauteur s'ajuste automatiquement grâce au code fourni.
Faut-il installer une application depuis l'App Store Shopify ? Non, et c'est voulu : pas d'app à installer, pas de ralentissement de votre boutique. Un simple bloc suffit.
Offrez à vos clients le bracelet qu'ils imaginent
Testez le composeur gratuitement, puis activez-le sur votre boutique Shopify avec votre propre identité. Nous vous accompagnons à chaque étape.
Découvrir les formules Nous écrire
Sources
1. Shopify — Ajouter du contenu Liquid personnalisé à un thème (documentation officielle) — help.shopify.com
2. Shopify — Thèmes Online Store 2.0 et sections dynamiques — help.shopify.com
3. MDN Web Docs — L'élément iframe et l'attribut loading — developer.mozilla.org
Article rédigé par Loch Ness. Les données citées appartiennent à leurs auteurs respectifs et sont reproduites à titre informatif, avec lien vers la source d'origine.