QR Manager crée des QR codes dynamiques sur votre site Webflow. Chaque code contient une adresse permanente de votre site, comme votresite.com/qr/menu. Cette page lit la destination du moment dans votre CMS et y envoie le visiteur : vous pouvez donc changer où mène un code imprimé à tout moment.
1. Installer et connecter
- Installez QR Manager depuis la Marketplace Webflow, ou via ce lien d'installation.
- Sur l'écran d'autorisation Webflow, choisissez votre site et cliquez sur Authorize.
- Ouvrez le Designer, ouvrez le panneau Apps dans la barre d'outils de gauche et lancez QR Manager.
Seule la personne qui installe l'app l'autorise. Les membres de l'équipe qui travaillent sur le site l'ouvrent simplement.
2. Assistant de mise en place
À la première ouverture sur un site, un assistant vous guide en cinq étapes. Chaque étape se débloque quand la précédente est terminée, et l'app les vérifie elle-même.
- Connecter le site : autorisez l'app dans l'onglet qui s'ouvre. La connexion est détectée automatiquement.
- Créer la collection : un clic crée la collection CMS « QR Codes », ou ajoute les champs manquants à une collection existante.
- Choisir le domaine imprimé dans vos codes. Prenez le domaine de production : il ne pourra plus changer une fois imprimé.
- Préparer la page de redirection : l'app configure la page modèle de la collection et construit la carte de redirection. Si la page est introuvable juste après la création de la collection, rechargez le Designer : l'app revérifie toute seule.
- Publier le site avec le bouton Publish du Designer. L'app détecte la nouvelle publication.
Si votre équipe utilise déjà l'app sur le site, l'assistant est passé. Vous pouvez le relancer depuis Réglages → Assistant de mise en place.
3. Créer un QR code
- Dans l'onglet QR codes, cliquez sur le bouton rond + en bas à droite.
- Saisissez un Nom (pour vous uniquement). Le Slug en est déduit : il devient l'adresse
/qr/slugimprimée dans le code. - Saisissez l'URL de destination, là où les visiteurs doivent arriver aujourd'hui.
- Ajoutez si besoin une Catégorie et activez les Paramètres UTM (voir Suivi UTM).
- Dès que l'adresse est valide, l'aperçu apparaît avec le choix du Style juste en dessous.
- Cliquez sur Créer le QR code. Le code est enregistré dans votre CMS et publié.
Une fenêtre vous propose alors de Voir le QR code, de copier son adresse, de le Tester ou de le télécharger en PNG (2048 px, pour l'impression et les documents) ou en SVG (vectoriel, pour les graphistes et les grands formats).
4. Gérer vos codes
L'onglet QR codes liste chaque code avec l'adresse imprimée dedans (votresite.com/qr/slug). Les codes sont regroupés par catégorie si vous en utilisez. Le bouton rond + en bas crée un nouveau code.
- Recherchez par nom, slug, destination ou catégorie, et filtrez par statut ou par modèle.
- L'interrupteur met un code en pause ou le réactive. Un code en pause affiche un message « inactif » au lieu de rediriger.
- Le menu ⋯ propose : Modifier, Dupliquer, Tester le lien, Copier l'URL, Télécharger PNG / SVG, Archiver et Supprimer.
- Pendant une action, la ligne indique ce qui se passe (« Activation et publication… »).
La fiche d'un code
Cliquez sur un code pour ouvrir sa fiche. Rien ne change tant que vous ne cliquez pas sur Modifier. La fiche montre le code, son adresse (copier, tester), les téléchargements et tous les détails : statut, destination dans chaque langue, paramètres UTM, style, catégorie, et qui a généré l'image et quand.
Pas encore publié
Un code enregistré mais pas publié mène à une page 404 quand on le scanne. La liste le signale par une bande jaune et un bouton Publier sur la ligne, et un bandeau compte ces codes.
Catégories
Donnez une Catégorie à un code dans son formulaire (Menus, Événements, Emballage…) : les catégories existantes sont proposées. Elles sont stockées dans un champ « Category » de votre collection CMS, ajouté automatiquement la première fois.
Dupliquer
Ouvre le formulaire de création avec une copie du code (nom « (copie) », slug slug-2, destinations, style, catégorie). Rien n'est créé avant que vous cliquiez sur Créer le QR code.
Archiver, restaurer, supprimer
- Archiver retire la page du code de votre site en ligne, sans supprimer le code. Il passe dans le filtre Archivés.
- Restaurer le remet en ligne et le republie, à la même adresse.
- Supprimer efface définitivement l'item CMS. Les exemplaires imprimés mèneront à une page 404.
Image obsolète signifie que l'image stockée dans le CMS ne correspond plus au domaine ou au modèle :Régénérer dans le bandeau la met à jour. Les codes imprimés fonctionnent dans tous les cas.
5. Espace client et statistiques
Depuis l'espace client
Tout se gère aussi depuis votre espace client, sans ouvrir le Designer : créer, modifier, activer, archiver ou supprimer un QR code, télécharger ses images, suivre les statistiques et gérer l'abonnement. Les changements sont écrits dans le CMS de votre site et publiés aussitôt, comme depuis l'extension.
Statistiques de scans
- Chaque scan d'un code publié est compté : le total s'affiche dans la liste et sur la page du code, pour toutes les offres.
- Avec Premium : scans par jour sur 30 jours, 90 jours ou un an, par pays et par type d'appareil (mobile, tablette, ordinateur).
- Le comptage est anonyme : ni cookie, ni stockage sur l'appareil du visiteur, ni adresse IP conservée. Seuls des totaux par jour, pays et appareil sont enregistrés (13 mois maximum). Les robots et aperçus de liens ne sont pas comptés.
- Pour l'arrêter : Réglages → Compter les scans. Le réglage vaut pour tout le site.
6. Styles et modèles
- Options : couleurs des modules, des coins et du fond (ou fond transparent), forme des modules (carrés, arrondis, points, losanges), forme des coins (carrés, arrondis, ronds), un logo au centre et le niveau de correction d'erreur (passé à H avec un logo).
- Les modèles (Réglages → Modèles) sont des styles réutilisables, partagés avec toute l'équipe du site. Les modifications s'enregistrent automatiquement. Le modèle par défaut s'applique aux nouveaux codes.
- Dans le formulaire, choisissez un modèle ou cliquez sur Personnaliser pour donner à un code son propre style. Enregistrer comme modèle en fait un modèle.
- Quand un modèle change, ses codes sont marqués Image obsolète : Régénérer les met à jour en un clic.
- L'app vous prévient si des couleurs rendent un code difficile à scanner. Gardez un bon contraste et testez une impression avant un gros tirage.
7. Suivi UTM
Les paramètres UTM sont ajoutés à la destination : les visites venant d'un scan apparaissent comme une campagne à part dans Google Analytics, Webflow Analytics ou tout autre outil de statistiques. QR Manager, lui, ne suit rien.
- Dans le formulaire, activez Paramètres UTM et renseignez
utm_source,utm_mediumetutm_campaign. utm_campaignreprend le slug tant que vous ne saisissez pas votre propre valeur.- Réglages → UTM automatiques définit la source et le medium par défaut, et peut activer les UTM pour chaque nouveau code. Ces valeurs sont gardées dans votre navigateur.
- Les paramètres sont aussi ajoutés aux destinations propres à une langue.
Par exemple, le code d'un sticker de vitrine peut mener à :
https://votresite.com/menu?utm_source=qr-code&utm_medium=sticker&utm_campaign=vitrine
8. Import et export CSV
L'icône d'envoi en haut de la liste QR codes donne accès à Exporter en CSV et Importer un CSV.
Export
Télécharge tous les codes, archivés compris, dans un fichier qui s'ouvre dans Excel, Numbers ou Google Sheets.
Import
- Partez d'un export, ou d'un fichier avec au moins les colonnes
nameetdestination_url. - Choisissez le fichier. L'app indique combien de codes seront créés, mis à jour ou ignorés, avec la raison de chaque erreur.
- Cliquez sur Importer. Les codes sont enregistrés et publiés un par un, avec une barre de progression.
| Colonne | Contenu |
|---|---|
name | Obligatoire. |
destination_url | Obligatoire. URL complète commençant par https://. |
slug | Facultatif (déduit du nom). Un slug qui existe déjà met à jour ce code. |
active | Facultatif : true / false (ou oui / non, 1 / 0). Vide : l'état actuel est conservé. |
template | Facultatif : nom d'un modèle du site. Vide : le style actuel est conservé. |
destination_en, destination_de… | Sites multilingues : URL spécifique pour cette langue. Vide : suit la destination principale. |
Les autres colonnes de l'export (archived, draft, qr_url) sont ignorées à l'import. La virgule et le point-virgule (Excel en français) sont acceptés comme séparateurs. Un code archivé n'est pas modifié par un import : restaurez-le d'abord.
9. Sites multilingues
Avec Webflow Localization :
- Chaque code est créé, publié et supprimé dans toutes les langues du site. Le code imprimé contient l'adresse de la langue principale.
- Par défaut, toutes les langues utilisent la même destination. URL spécifique pour : + langue, sous la destination, en ajoute une pour une langue ; retirez-la pour revenir à la principale.
- Les visiteurs sont d'abord envoyés vers la page dans leur langue (grâce à vos liens
hreflangou aux dossiers de langue), puis vers la destination de cette langue. - Les textes de la page de redirection que vous n'avez pas traduits le sont au chargement (7 langues). Vos propres traductions sont conservées.
- Langue ajoutée après coup ? Cliquez sur Créer dans toutes les langues dans la liste, puis Réglages → Collection et redirection → Mettre à jour le design, et publiez.
- La structure de la page ne peut être modifiée que sur la langue principale du site ; ailleurs, l'app grise ces boutons.
10. Offre gratuite, Premium et Premium Équipe
- Gratuit : 3 nouveaux QR codes par compte sur 24 heures glissantes, avec toutes les fonctions. Modifier, mettre en pause, archiver et télécharger les codes existants n'est jamais limité.
- Premium : 79 € par an (4 mois offerts) ou 10 € par mois, QR codes illimités et statistiques avancées sur tous les sites de votre compte. Il soutient le développement de l'app.
- Premium Équipe : 349 € par an ou 39 € par mois. Tout Premium, et des membres illimités sur vos sites : dans l'espace client ou l'app, Sites → Membres, invitez une personne par e-mail en admin (réglages du site, modèles, membres) ou en éditeur (QR codes et statistiques). Elle se connecte avec cette adresse et crée sous votre abonnement.
- L'en-tête de la liste affiche votre utilisation (Gratuit · 1/3). Une fois la limite atteinte, l'app indique quand le prochain code gratuit sera possible.
- Les duplications et les codes créés par un import CSV comptent comme de nouveaux codes.
- Code d'accès : si vous avez reçu un code (QRM-XXXX-XXXX), saisissez-le dans Réglages → Abonnement → J'ai un code d'accès. Votre compte passe en Premium à vie, sans abonnement.
S'abonner, gérer, résilier
- Réglages → Abonnement → Passer à Premium ouvre une page de paiement Stripe sécurisée dans un nouvel onglet.
- De retour dans le Designer, l'app passe en Premium toute seule en quelques secondes.
- Gérer l'abonnement ouvre le portail Stripe : factures, moyen de paiement, résiliation. Après résiliation, Premium reste actif jusqu'à la fin de la période payée.
11. Ce que l'app ajoute à votre site
- Une collection CMS QR Codes (slug
qr) avec les champs Name, Slug, Destination URL, QR image et Active. Chaque code est un item. - Sur sa page modèle, modifiable dans le Designer : une carte centrée avec un état de chargement, un bouton Continuer, un message « inactif ». Le script de redirection est installé dans l'en-tête de cette seule page via l'API Custom Code de Webflow (visible dans les réglages de la page) ; sur les sites autorisés avant cette version, il se trouve dans un Code Embed de la page. Il redirige vers la destination et envoie un signal anonyme pour le compteur de scans.
- Des classes préfixées
qrm-(qrm-page,qrm-card,qrm-button…). Restylez-les librement : reconstruire la page n'écrase jamais une classe existante. - Les images QR sont stockées dans l'item CMS, en SVG. L'envoi passe par un asset temporaire supprimé aussitôt : votre panneau Assets reste propre.
12. Autorisations
| Scope | Pourquoi |
|---|---|
cms:read, cms:write | Créer la collection et gérer les items QR code dans toutes les langues. |
assets:read, assets:write | Envoi temporaire de l'image du QR, supprimée aussitôt. Vos autres assets ne sont jamais lus. |
sites:read | Nom du site, langues et date de dernière publication (assistant de mise en place). |
authorized_user:read | Vérifier qui utilise l'app dans le Designer, et relier vos sites à votre compte QR Manager. |
custom_code:read, custom_code:write | Installer le script de redirection (et le retirer à la déconnexion). |
pages:read, pages:write | Appliquer ce script à la seule page modèle QR Codes. Aucune autre page n'est modifiée. |
13. Déconnecter et désinstaller
- Réglages → Connexion → Déconnecter le site retire le site de votre compte QR Manager, supprime ce que l'app stocke pour lui (modèles partagés, logos, réglages et statistiques de scans) et retire le script de redirection de la page modèle (effectif à la prochaine publication). L'app reste installée : Reconnecter le site le rétablit en un clic.
- Pour retirer à l'app l'accès au site, désinstallez-la dans Webflow (Paramètres du site → Apps & Integrations). Webflow révoque alors l'autorisation et retire le script appliqué par l'app (à la prochaine publication), et l'app supprime ses données stockées pour le site.
- Vos codes restent dans votre CMS. Sans le script, leur page affiche le bouton Continuer vers la destination au lieu de rediriger toute seule. Pour tout retirer, supprimez la collection QR Codes et les classes
qrm-; les codes imprimés cesseront alors de fonctionner.
14. Dépannage et FAQ
Un code mène à une page 404
Publiez votre site, puis vérifiez dans Réglages → Collection et redirection que la page modèle est prête. Si le code est archivé, restaurez-le. Sur un site multilingue, cliquez sur Créer dans toutes les langues si la liste le propose.
« Le Designer ne voit pas encore la page de la collection »
Une collection créée par l'app n'apparaît qu'après un rechargement du Designer. Rechargez-le (Cmd + R ou Ctrl + R) et rouvrez QR Manager : l'assistant reprend où il en était.
Une erreur de permission en construisant la page
Passez le Designer sur la langue principale du site et en mode Design, avec un rôle autorisé à modifier le design.
« Impossible de joindre QR Manager »
Vérifiez votre connexion et réessayez. Les codes imprimés ne sont pas touchés : les redirections ne passent jamais par nos serveurs.
Les codes imprimés dépendent-ils de QR Manager ?
Non. C'est votre site Webflow qui redirige. L'app ne sert que pendant que vous modifiez vos codes.
Les codes stylisés se scannent-ils ?
Chaque combinaison proposée par l'app est lue par les lecteurs standards dans nos tests. Gardez un bon contraste et testez une impression.
Puis-je utiliser l'app sur plusieurs sites ?
Oui. Chaque site a sa propre collection, ses modèles et son autorisation.
Toujours bloqué ? Consultez le Support et contact.