Intégration Framer
Ajouter un chat en direct à ton site Framer
Dans Framer, pas de prompt : tu colles une ligne dans le code personnalisé du site, et la bulle Hooky apparaît sur toutes tes pages dès la prochaine publication. Ensuite, tu réponds à tes visiteurs depuis ton téléphone.
Pourquoi un chat sur un site Framer
Un site Framer, c’est souvent une vitrine soignée : un studio, un freelance, une app qui se lance. Les visiteurs qui arrivent là ont une question précise (« vous êtes dispo en mars ? », « c’est combien pour un logo ? »). Une bulle de chat la capte au bon moment, sans formulaire. Framer cite d’ailleurs les chats en direct parmi les usages du code personnalisé.
Installer Hooky dans Framer
Crée ton compte Hooky (gratuit pour un site), déclare ton site avec son adresse (
mon-site.framer.websiteou ton domaine), et copie la balise<script>dans Sites.Ouvre les réglages du site dans Framer (Site Settings, appelés Project Settings dans les versions récentes) et va dans la section Custom Code.
Ajoute un script : Add Script (ou + s’il y en a déjà), nomme-le « Hooky », colle la balise, et choisis comme emplacement la fin de la balise <body>. Laisse-le sur toutes les pages ; si on te demande la fréquence d’exécution, choisis Once.
Publie le site. Le code personnalisé ne se charge pas dans l’aperçu du canevas : seule la version publiée affiche la bulle.
La balise à coller (la tienne contient la vraie clé de ton site) :
<script src="https://heyhooky.com/widget.js" data-site-key="TA_CLE_PUBLIQUE" async></script>Les noms exacts des menus changent de temps en temps chez Framer : si tu ne les retrouves pas, cherche « Custom Code » dans l’aide de Framer. L’important : un code au niveau du site (pas d’une seule page), placé en fin de <body>.
Vérifier que la bulle apparaît
Ouvre ton site publié dans un nouvel onglet : la bulle est en bas de l’écran. Navigue entre deux pages : elle reste là, et la conversation aussi. Un message de test arrive aussitôt dans Messages.
Rien ne s’affiche ? Vérifie que tu as bien republié, que le code est au niveau du site et en fin de <body>, et que l’adresse ouverte figure dans les adresses autorisées du site dans Hooky, si tu en as déclaré.
framer.website et ton domaine
Ton site a une adresse Framer, et souvent ton propre domaine. Déclare les deux dans la page du site, dans Hooky : une seule boîte de réception, les mêmes stats. www. est couvert automatiquement.
Accorder la bulle à ton design
Pas besoin de toucher à Framer pour ça : dans Hooky, page du site, choisis la couleur de la bulle, son côté (droite ou gauche) et ton message d’accueil, avec un aperçu en direct. Les changements s’appliquent sans republier.
Un bouton « Nous écrire » dans ton menu ? Ajoute-lui un lien qui appelle Hooky.open(), ou, plus simple dans Framer, laisse la bulle faire le travail.
Répondre à tes visiteurs
Une notif sur ton téléphone, et tu réponds depuis l’app Hooky (iPhone, iPad, Mac, Android) ou l’espace web. Ton visiteur peut joindre une photo ou un PDF (un brief, une maquette), et s’il quitte le site en laissant son e-mail, ta réponse lui arrive par e-mail avec un lien pour reprendre la conversation.
Questions fréquentes
Faut-il une offre payante de Framer ?
Framer ne précise pas d’offre minimale pour le code personnalisé dans son aide. Le domaine personnalisé, lui, demande une offre payante. Si la section Custom Code n’est pas disponible sur ton projet, regarde les conditions de ton offre chez Framer.
Je veux la bulle sur certaines pages seulement
Framer permet de limiter un script à certaines pages. Mais pour un chat, le plus utile reste de l’avoir partout : la conversation suit le visiteur d’une page à l’autre.
Pas de prompt pour Framer ?
Framer est un éditeur visuel : tu ne lui donnes pas de code à écrire, tu colles la balise toi-même. C’est une seule ligne, et tu ne la touches plus jamais.
Et les stats ?
Hooky.track s’appelle depuis du code : dans Framer, ça passe par un composant de code ou un override. Pour un simple site vitrine, la bulle suffit souvent. Voir la doc.
Les autres outils
Tes visiteurs ont des questions. Réponds-leur d’où tu es.
Gratuit pour un site, installé en un prompt. Ensuite, garde ton téléphone dans la poche.