Comment créer des pages de destination B2B dynamiques avec Clay & Webflow

Qu'est-ce qui vous empêche de transformer un prospect en client ?

Dans la plupart des cas, il s'agit de la page d'accueil générique que vous envoyez à tout le monde. Le type de page d'accueil unique ne fonctionne plus.

Vous pourriez passer des heures à créer le parfait e-mail à froid. Vous effectuez des recherches sur l'entreprise, son secteur d'activité et ses défis.

Mais tous ces efforts échouent lorsque le prospect clique sur votre lien et atterrit sur une page générique qui ne s'adresse à personne en particulier.

Les entreprises ne veulent pas simplement une solution ; elles veulent une solution adaptée à leur activité. Une solution qui répond à leurs besoins et qui tient compte de leurs secteurs d'activité.

Pendant des années, les spécialistes du marketing ont essayé de résoudre ce problème en créant des pages de destination personnalisées pour chaque prospect.

Le problème, c'est le coût.

L'embauche de concepteurs et de développeurs, la gestion de plusieurs pages et leur maintenance au fil du temps ne sont pas pratiques pour les individus ou les petites équipes.

Mais cette limite a maintenant disparu.

Grâce à l'intégration de Clay et Webflow, vous pouvez générer une page de destination B2B dynamique conçue spécifiquement pour chaque prospect.

Imaginez ceci : vous envoyez un e-mail à Stripe, celui-ci clique sur le lien de la page d'accueil et l'utilisateur accède à la page qui répond à ses besoins.

Un e-mail similaire est envoyé à Uber, ciblant leur secteur d'activité.

Ce n'est pas de la magie, mais des pages de destination dynamiques. Et aujourd'hui, vous pouvez créer l'intégralité de ce moteur avec seulement deux outils : Clay et Webflow.

Ce guide vous expliquera comment créer des pages de destination B2B dynamiques avec Clay.

Nous passerons en revue l'architecture, l'intégration et l'exécution technique pour vous aider à démarrer.

Qu'est-ce qu'une page de destination dynamique ?

Une page de destination dynamique est un modèle d'URL unique.

Par exemple, yourdomain.com/companname est l'URL.

Cette page d'accueil est personnalisée pour chaque visiteur qui la visite. Cette page aura un contenu variable comme des titres, des images, des témoignages, un logo.

Ces pages extraient des informations de bases de données et déterminent ce qu'il faut montrer au visiteur. Par exemple :

Si un prospect d'Airbnb consulte le lien, la page peut indiquer :

« Aidez Airbnb à rationaliser la communication avec les clients grâce à l'IA. »

Si un prospect de Slack visite le site, la même structure d'URL est modifiée comme suit :

« Aidez Slack à réduire le taux de désabonnement des entreprises grâce à l'IA. »

L'architecture du moteur dynamique

Pour générer des pages dynamiques, nous avons besoin d'un moteur.

Nous ne créons pas les pages une par une.

Nous avons donc besoin d'un modèle de page qui extrait les informations de la base de données et construit des milliers de pages à partir de celles-ci.

C'est ce que fera notre moteur dynamique.

Pour cela, nous avons besoin de trois éléments : le cerveau, le corps et le système nerveux du moteur.

1. Le cerveau : Le cerveau du moteur sera Clay. Il récupère les données du prospect ou de l'entreprise. Clay peut trouver des personnes, des entreprises, des emplois et des entreprises locales.

Vous pouvez importer des données depuis un CRM ou un CMS. Clay trouvera et enrichira les données. Une fois cela fait, AI rédigera une copie personnalisée pour chaque page.

2. Le corps : Le corps du moteur est essentiellement un CMS, et pour cela, nous utiliserons Webflow.

À l'aide de Webflow, nous allons concevoir une page qui sera le modèle principal. Webflow utilisera les données de Clay pour chaque prospect et créera une page de destination qui répondra aux besoins de chacun.

3. Le système nerveux : La dernière partie du moteur que nous sommes en train de construire est le système nerveux.

Il s'agit d'une intégration entre Clay et Webflow.

Ce système nerveux recherchera toute nouvelle donnée dans le cerveau, c'est-à-dire Clay, et pour chaque nouveau point de données, il créera une nouvelle page Web à l'aide de Webflow.

Stratégie de création de pages de destination dynamiques

Nous allons créer nos pages de destination à l'aide du moteur dynamique. Notre approche préférée sera de faire la distinction entre les éléments statiques et dynamiques de la page.

Habituellement, 80 % de la page Web sera statique, tandis que les 20 % restants seront dynamiques (modification du contenu en fonction du prospect).

Le maintien de ce ratio garantira la pertinence et la confiance des clients. Cela garantit que le produit cible les besoins de l'entreprise sans avoir l'impression d'être une arnaque.

Éléments statiques de la page Web

Les éléments statiques resteront cohérents sur toutes les pages. Cela rend votre marque cohérente et professionnelle.

Les éléments de page statiques incluent généralement les détails de la marque et les mises en page.

1. Barre de navigation : La barre de navigation pour la navigation dans les menus restera la même pour toutes les pages que nous créons à l'aide du moteur.
2. Caractéristiques principales du produit : La proposition de valeur de votre marque qui rend votre produit original ne doit être modifiée dans aucun des changements. La description des fonctionnalités restera la même, mais elle ne doit pas exagérer les fonctionnalités que vous ne proposez pas.
3. Tarification : La tarification des pages restera également statique. En tant que propriétaire de marque, vous ne pouvez pas continuer à faire fluctuer les prix pour les prospects.
4. Pied de page : L'élément suivant qui reste statique est le pied de page, qui contient les informations telles que les droits d'auteur, les conditions générales, la politique de confidentialité, etc. Ces informations doivent être cohérentes sur toutes les pages de destination.

Éléments dynamiques de la page Web

Les éléments dynamiques des pages Web ne cesseront de changer à tous égards.

Ces éléments doivent être choisis de manière stratégique, en tenant compte des exigences du prospect à qui vous envoyez un e-mail.

1. Titres et sous-titres : Les titres et les sous-titres constituent la partie la plus importante du prospect. Ils sont adaptés à l'industrie et répondent à un problème spécifique.
2. Logo et image du héros : Une chose courante sur une page de destination est le logo de votre marque et de la leur avec un signe plus entre eux.

Votre logo restera le même, mais celui de l'autre marque changera à chaque proposition que vous envoyez.

De plus, l'image du héros joue un rôle crucial dans la perspective.

Par exemple, pour une marque de café, il peut s'agir de l'image du barista, alors que pour une entreprise technologique, il peut s'agir d'une image d'ordinateurs. Cela changera constamment pour chaque proposition que vous envoyez.

3. Preuve sociale : Cela inclut des études de cas et des témoignages pour le secteur en question. L'étude de cas d'un cabinet d'avocats n'aura pas d'importance pour une entreprise technologique, et ce sera un facteur décisif pour elle.

Pour un cabinet d'avocats, votre page de destination devrait plutôt inclure une étude de cas d'un cabinet d'avocats.

4. Calculateur de retour sur investissement : Si vous prévoyez d'inclure le calculateur de retour sur investissement sur la page de destination, cela peut varier pour chaque prospect que vous comptez contacter.

En dehors de cela, d'autres sections qui peuvent être dynamiques sont la pile technologique, la section questions-réponses, les CTA, les comparaisons, les critiques, etc.

Créez des pages de destination B2B dynamiques avec Clay : guide étape par étape

Tout d'abord, nous allons commencer par définir une destination pour vos données, c'est-à-dire votre corps. Cela inclut la création d'un modèle pour la page de destination.

Ensuite, nous importerons les données dans Clay.

Dans la dernière étape, nous intégrerons Clay et Webflow. Voici le guide détaillé étape par étape sur la façon de procéder.

Prérequis

Il y a deux prérequis pour continuer à suivre le guide :

1. Vous avez besoin d'un compte Clay pour commencer.
2. Vous avez également besoin d'un compte Webflow pour créer le modèle

Étant donné que vous possédez déjà ces deux comptes, nous pouvons poursuivre le guide à l'avance.

Étape 1 : Création d'une collection CMS dans Webflow

Tout d'abord, nous devons créer une collection CMS dans Webflow. Voici comment procéder :

1. Accédez à Flux Web sur votre navigateur.
2. Maintenant, cliquez sur Nouveau site bouton.

1. Après cela, vous aurez trois options :
   
   1. Constructeur de site AI- Vous pouvez utiliser l'IA de Webflow pour générer un site avec votre invite de texte.
   2. Modèle- Vous verrez une collection de modèles (gratuits et payants) que vous pouvez utiliser pour votre site.
   3. Site vide- Vous devrez créer un site personnalisé à partir de zéro.
2. Pour l'instant, choisissons un site vierge.

1. Entrez le nom de votre site (par exemple, Page d'accueil B2B), puis cliquez sur Créer un site.
2. Maintenant, cliquez sur SCG onglet.

1. Cliquez sur Création d'une collection.

1. Entrez le Nom de la collection (comme Pages de destination).

1. Cliquez maintenant Ajouter un nouveau champ.
2. Ensuite, vous devrez choisir le type de champ. Voici les champs que nous utiliserons :
   
   1. Informations de base sur l'entreprise :
      
      1. Nom de l'entreprise (Texte brut) - obligatoire
      2. Logo de l'entreprise (Image) - pour la section des héros
      3. URL du site Web (Texte brut) - lien vers leur site
      4. L'industrie (Texte brut) - pour la segmentation
   2. Contenu de la page de destination :
      
      1. Titre du héros (Texte brut) - « Accélérez les ventes grâce à l'IA. »
      2. Sous-titre (Texte brut) - texte de support
      3. Proposition de valeur (Rich Text) - copie des principaux avantages
      4. Texte principal du CTA (Texte brut) - texte du bouton tel que « Obtenir une démo ».
   3. Données de personnalisation :
      
      1. CRM principal (Texte brut) - HubSpot, Salesforce, etc.
      2. Taille de l'entreprise (Texte brut) - Entreprises, entreprises de taille intermédiaire, start-up
      3. Couleur de la marque (Couleur) - la couleur de leur marque pour l'accent
      4. Texte du témoignage (Rich Text) - preuve sociale pertinente
   4. Pour Clay Sync :
      
      1. Identifiant Clay (Texte brut) - identifiant unique de Clay
      2. Limace (champ Texte brut ou Slug) - pour la génération d'URL

Remarque- Ce ne sont que des exemples ; vous pouvez ajouter des champs selon votre choix.

11. Pour l'instant, ajoutons Nom de l'entreprise. Pour cela, sélectionnez Texte brut.

11. Entrez les informations suivantes :
    
    1. Libellé- Nom de l'entreprise
    2. Texte d'aide- Nom officiel de l'entreprise.

11. Une fois terminé, cliquez sur Enregistrer le champ.

11. De même, vous pouvez ajouter tous les champs que nous avons mentionnés ci-dessus.
12. Une fois que tout cela est fait, cliquez sur Enregistrer Recueil.

Maintenant, après cela, vous devez tester l'élément de collection. Cela vous permet de vérifier que la liaison fonctionne avant que Clay ne transmette des données réelles.

Voici comment procéder :

1. Cliquez sur votre Nom de la collection, c'est-à-dire Pages de destination.
2. Maintenant, cliquez Créer un nouvel article.

1. Vous verrez un formulaire avec les champs. Remplissez ce formulaire et cliquez Créer un brouillon.

1. Cela créera un élément de test pour voir si la liaison fonctionne ou non.

Étape 2 : Concevez votre modèle de page de destination

Une fois votre CMS configuré, vous devez créer et concevoir votre nouveau modèle de page de destination.

Pour ce faire, suivez les étapes ci-dessous :

1. Accédez au Design onglet en haut.

1. Dans le volet de gauche, cliquez sur Des pages.

1. Vous verrez le Modèle de pages de destination ici ; cliquez sur + bouton situé à côté.

1. Deux options s'offrent maintenant à vous :
   
   1. Créez une nouvelle page de landing pages : Avec cette option, vous devrez créer la page de destination à partir de zéro.
   2. Générez une nouvelle page de landing pages : Si vous sélectionnez cette option, AI générera un modèle de page de destination pour vous.
2. Je recommande d'utiliser le Générer une nouvelle page de landing pages option.

1. Maintenant, cliquez sur le »Générez sans invite » bouton.

1. Cela va maintenant créer un modèle de page de destination ; sélectionnez-le.
2. Cliquez maintenant Ajouter une mise en page.

1. Vous verrez maintenant des options de mise en page telles que
   
   1. Navigation
   2. Héros
   3. L'équipe
   4. Logos
   5. Galerie
   6. Caractéristiques
   7. Tarification
   8. Témoignage
   9. Pied de page, etc.
2. Pour l'instant, sélectionnez l'un des Héros Mises en page pour commencer.
3. Sélectionnez maintenant le Titre du héros (qui sera le titre).

1. Dans le volet droit, sélectionnez Réglages.
2. Dans le coin supérieur gauche de IDENTIFIANT, vous verrez un petit point violet; cliquez dessus.

1. Maintenant, dans le menu déroulant, sélectionnez Titre du héros.

1. Maintenant, de la même manière, ajoutez ces sections et liez-les aux autres Champs de collecte nous avons économisé plus tôt dans Étape 1
2. Vous devrez ajouter les sections suivantes au modèle :
   
   1. Sous-titre
   2. Proposition de valeur
   3. Caractéristiques
   4. CTA
   5. Navigation
   6. Pied de page, etc.
3. Une fois terminé, cliquez sur Publier pour le publier.

Remarque- Nous ne parlons pas de la partie design ici. Vous pouvez ajouter et organiser des sections selon vos besoins.

Notre objectif principal est de vous aider à créer des pages dynamiques avec des données variables.

Étape 3 : Configuration de Clay (recherche et enrichissement des données)

Dans cette partie de notre guide, nous allons configurer Clay et l'utiliser pour récupérer les données des entreprises ou, en d'autres termes, les prospects souhaités.

Voyons d'abord comment vous pouvez trouver les données à l'aide de Clay :

1. Connectez-vous à votre Argile compte sur le navigateur.
2. Cliquez maintenant sur Nouveau bouton.

1. Sélectionnez Cahier d'exercices.

1. Donnez un nom au classeur : Entreprises de pages de destination.

1. Cliquez ensuite sur Trouvez des entreprises option. Il va maintenant falloir paramétrer les filtres.

1. Définissez vos filtres :
   
   1. Industries à inclure : (par exemple, développement de logiciels)
   2. Secteurs à exclure : (facultatif, par exemple, santé, SaaS, finances)
   3. Taille de l'entreprise : (par exemple, 51 à 200 employés)
   4. Lieu : (États-Unis, par exemple)
   5. Revenus annuels : (facultatif, par exemple, 10 à 25 millions de dollars)

1. Il y aura beaucoup de filtres, alors définissez-les selon vos besoins.
2. Une fois que vous aurez défini les filtres, Clay vous montrera toutes les entreprises ; passez-les en revue.
3. Cliquez Continuer et cliquez Importer vers une nouvelle table.

1. Une fois que vous aurez fait cela, un tableau contenant vos données sera créé.
2. Si vous souhaitez ajouter plus d'informations à Clay avant de synchroniser avec Webflow, cliquez sur « Ajouter une colonne. »
3. Donnez un nom à la colonne (par exemple, « CRM principal », « Industry Focus »).
4. Vous pouvez les remplir manuellement ou utiliser des enrichissements.

Ensuite, vous devez ajouter des enrichissements à votre tableau. Vous devrez récupérer des e-mails, des logos, des piles techniques, etc.

Pour cela, procédez comme suit :

1. Cliquez sur le Ajouter une colonne bouton.
2. Maintenant, cliquez sur Ajoutez un enrichissement.

1. Cherchez-les Enrichissements-
   
   1. Logos
   2. Couleurs de la marque
   3. Informations sur l'entreprise
   4. Courriels
   5. Tech Stack, etc.

1. Sélectionnez chaque configuration une par une, cliquez sur Enregistrer, puis sélectionnez Enregistrez et exécutez 10 lignes.

1. C'est ce que nous avons fait pour le logo, et Clay a trouvé le logo pour les 10 lignes.

1. De même, procédez de la même manière pour tous les enrichissements.

Ensuite, nous devons générer des copies personnalisées avec l'IA.

Voici comment utiliser Clay pour cela :

1. Cliquez sur le Ajouter une colonne bouton, et nommez le Colonne comme Titre du héros.
2. Maintenant, sélectionnez Utiliser l'IA.

1. Collez cette invite ici :
   
   1. Rédigez un titre convaincant pour un produit SaaS B2B qui aide (à remplacer par la colonne du secteur principal) les entreprises à (remplacer par la colonne des tailles) à s'améliorer (point sensible). Gardez-le en moins de 10 mots
2. Cliquez ensuite Enregistrer, puis sélectionnez Enregistrez et exécutez 10 lignes.

1. Maintenant, cela va créer un Héros titre pour dix rangées.
2. Répétez cette procédure pour les autres champs, tels que :
   
   1. Sous-titre
   2. Proposition de valeur
   3. Texte principal du CTA
3. Ensuite, nous devons ajouter un Limace Colonne.
4. Sélectionnez Ajouter une colonne>Formule.

1. Utilisez cette formule :
   
   1. /{remplacer par la colonne Company_name} .toLowerCase () .replace (/\ s/g, « - »)

1. Une fois terminé, cliquez sur le »La sortie est correcte« bouton ».

Étape 4 : Connectez Clay à Webflow

C'est maintenant le système nerveux de notre moteur dynamique.

Au cours de cette étape, nous devrons connecter Clay à Webflow et nous assurer que la mise en page de notre page de destination collecte les données correctes.

Voici comment procéder :

1. Cliquez sur le Actions bouton sur le tableau et recherchez Flux Web.
2. Cliquez maintenant Créer un article de collection.

1. Ensuite, cliquez sur le Ajouter un compte bouton, et connectez-vous à l'aide de votre compte Webflow.

1. Ensuite, sélectionnez le Site (pages de destination B2B) et Collection (pages de destination).
2. Par la suite, pour Nom, tapez / et sélectionnez la colonne du nom de l'entreprise (dans mon tableau, c'est Nom).
3. Ensuite, pour Limace, tapez / et sélectionnez la colonne du nom de l'entreprise (dans mon tableau, c'est Limaces).
4. Associez chaque colonne Clay au champ Webflow correspondant :
   Clay : « Nom de l'entreprise » → Webflow : « Nom de l'entreprise ».
   
   1. Clay : « URL du logo » → Webflow : « Logo de l'entreprise ».
   2. Clay : « Hero Headline » → Webflow : « Hero Headline ».
   3. Clay : « Sous-titre » → Webflow : « Sous-titre ».
   4. Clay : « Proposition de valeur » → Webflow : « Proposition de valeur ».
   5. Clay : « CRM principal » → Webflow : « CRM principal ».
   6. Clay : « Slug » → Webflow : « Slug », etc.
5. Cliquez maintenant Continuer à ajouter des champs.

1. Cliquez maintenant Enregistrer> Enregistrez et exécutez pendant 10 lignes.

1. Vous allez voir un écran comme celui-ci à présent. Ça devrait dire Élément créé pour chaque ligne.

1. Retournez à votre projet Webflow et vous verrez maintenant toutes les données dans le CMS.

1. Cliquez sur celui que vous souhaitez afficher (par exemple, Quartique).
2. Maintenant, cliquez sur ce Œil icône pour prévisualiser le site.

1. Actuellement, le logo et le nom sont liés à l'élément, donc je vois le modèle comme ceci.

Étape 5 : Mises à jour et itérations

Une fois que les pages de destination de vos prospects sont prêtes, vous pouvez ajouter plus de données à Clay.

Vous pouvez importer autant d'entreprises que vous le souhaitez, et Webflow créera des pages de destination pour celles-ci.

Pour la partie conception, vous devrez concevoir manuellement le modèle de la page de destination que vous utiliserez à l'avance.

Vous pouvez utiliser les champs personnalisés et les données de votre choix.

Voici une dernière liste de contrôle à prendre en compte avant de commencer à envoyer vos pages de destination :

• Webflow est passé au forfait CMS Site

• Collection créée avec tous les champs

• Élément de collection de tests avec création d'échantillons de données

• Modèle de page conçu et publié

• Tous les éléments clés sont liés (titre, logo, texte, CTA)

• Compte Clay créé

• Tableau créé avec les entreprises potentielles

• Données enrichies (logos, technologies, etc.)

• Copie personnalisée générée (AI)

• Clay est connecté à Webflow

• Les mappages de champs sont correctement configurés

• Test réussi (1 entreprise)

• Exécution complète par lots (toutes les entreprises)

• Pages vérifiées dans Webflow CMS

• Les pages en direct sont prévisualisées et ont une belle apparence

• URL des pages de destination générées et prêtes

• Campagnes lancées !

Recevez l'invitation de votre page de destination.

Ce sera quelque chose comme : domain.com/landing-pages/quadric

Cela peut varier pour chaque entreprise, alors copiez celle qui convient.

Conclusion

L'intégration de Clay et Webflow peut vous faire gagner beaucoup de temps que vous auriez passé à créer chaque page de destination séparément.

Ce concept peut être difficile à comprendre au début et nécessite un nettoyage des données, une ingénierie rapide et une gestion du CMS.

Cependant, le retour sur investissement en temps est infini.

Grâce à ce moteur dynamique, vous pouvez créer des milliers de prospects en quelques minutes. Même la mise à jour des prospects ne prend qu'une fraction de minute.

Vous pouvez suivre le guide ci-dessus pour savoir comment démarrer. Nous ne parlons pas d'une théorie de haut niveau, mais d'une architecture et d'un guide étape par étape pour vous aider à démarrer.

Alors, qu'est-ce que tu attends ? Essayez cette intégration dès maintenant et créez rapidement des milliers de pages de destination dynamiques et personnalisées.

Vous avez besoin de cette solution conçue pour vous ?

Si vous souhaitez implémenter ce système de page de destination dynamique sans passer des semaines à la configuration, au nettoyage des données et au câblage du CMS, Webyansh peut vous aider.

Webyansh est spécialisé dans :

• Intégrations Clay + Webflow
• Pages de destination dynamiques pilotées par CMS
• Systèmes de personnalisation pour les campagnes sortantes et ABM
• Architectures Webflow évolutives conçues pour les équipes de croissance

Que vous souhaitiez une preuve de concept ou un système entièrement prêt pour la production, Webyansh peut concevoir, créer et déployer l'intégration de bout en bout. Contactez Webyansh pour créer votre moteur de page de destination dynamique.