Modules par défaut de HubSpot

Dans cet article, vous découvrirez les modules par défaut que HubSpot met à votre disposition pour vos modèles et vos pages. Chaque type de module peut être personnalisé à l'aide d'options de contenu et de style dans l'inspecteur. Vous pouvez également ajouter un module par défaut à un modèle HTML avec son bloc HubL. Pour en savoir plus sur le développement avec des modules par défaut, consultez la documentation pour les développeurs de HubSpot.

Ajouter un module à votre modèle

Pour ajouter des modules à vos modèles de glisser-déposer, cliquez sur + Ajouter dans l'inspecteur dans l'angle supérieur droit de l'éditeur. Tous les modules par défaut et tous les modules ou groupes personnalisés enregistrés apparaîtront ici. Pour trouver un module spécifique, saisissez son nom dans la barre de recherche. Vous pouvez également cliquer sur le menu déroulant Filtrer par catégorie ou balises et sélectionner un ou plusieurs filtres.

Lorsque le module est sélectionné dans l'éditeur, vous pouvez en modifier les styles, les paramètres et le contenu dans l'inspecteur. Dans la section Habillage HTML, cliquez sur Développer pour ajouter plus de styles personnalisés dans l'éditeur de code.

Au bas de l'inspecteur, vous pouvez verrouiller le module afin que les utilisateurs ne puissent modifier le contenu par défaut lors de la modification d'un blog, d'un e-mail ou d'une page. Cliquez sur le bouton Empêcher la modification dans les éditeurs de contenu pour activer ce paramètre.

Personnaliser un module par défaut

Tous les comptes Marketing Hub Pro et Entreprise et CMS Hub Pro et Entreprise ont par défaut un dossier @hubspot dans les outils de conception. Ce dossier contient tous vos thèmes et modules par défaut, y compris les modules d'e-mail par glisser-déposer. Ces thèmes et modules sont en lecture seule, mais peuvent être clonés si vous souhaitez les modifier. 

• Depuis votre compte HubSpot, accédez à Marketing > Fichiers et modèles > Outils de conception.
• Dans l'outil de recherche, cliquez sur le dossier @hubspot.
• Cliquez avec le bouton droit de la souris sur le module par défautque vous souhaitez cloner, puis sélectionnez Cloner le module. 
  
  
• Dans le module cloné, modifiez le code source du module dans le panneau de modification centralisé.
• Dans l'angle supérieur droit, cliquez sur Publier les modifications pour enregistrer vos changements. Le module sera alors disponible pour la création de modèles.

Types de modules par défaut

Sauvegarde du désabonnement

Le modèle d'enregistrement du désabonnement s'affiche pour les destinataires d'un e-mail qui cliquent sur un lien de désabonnement si HubSpot n'est pas en mesure de déterminer leur adresse e-mail. Vous pouvez personnaliser le texte d'aide qui apparaît sur votre page de désinscription de sauvegarde dans la section Contenu par défaut de ce module. 

Commentaires de blog

Remarque : le module de commentaires de blog n'est pas disponible pour les modèles de page ou d'e-mail. 

Le module de commentaires de blog ajoute une section de commentaires à un modèle d'article de blog. Vous pouvez personnaliser le formulaire de commentaires de blog dans votre outil Formulaires. Le nom du formulaire fera référence au titre de votre blog. 

Contenu du blog

Remarque : le module de contenu du blog n'est pas disponible pour les modèles de page ou d'e-mail. 

Le module Contenu du blog contient le balisage HTML/HubL des articles de blog et des pages de listing du blog. Vous pouvez modifier le balisage de vos posts en cliquant sur Modifier le modèle de l'article et modifier le balisage de votre page de listing en cliquant sur Modifier le modèle de listing. Découvrez-en davantage sur le balisage des modules de contenu du blog.

Abonnement par e-mail au blog

Remarque : le module d'abonnement aux e-mails de blog n'est pas disponible pour les modèles d'e-mail. 

Le module d'abonnement aux e-mails de blog permet aux visiteurs de s'abonner aux e-mails de votre blog en remplissant un formulaire. Ce module est alimenté par votre formulaire d'inscription au blog, qui peut être personnalisé dans votre outil Formulaires.

Cliquez sur le menu déroulant Sélectionner le blog à afficher et sélectionnez le blog auquel s'abonnent vos visiteurs. Dans la zone de texte Titre à afficher au-dessus du formulaire, personnalisez le texte qui s'affiche dans le titre au-dessus du formulaire. Placez le curseur sur la réponse en ligne existante et cliquez sur l'icône Développerexpand pour personnaliser le texte qui apparaît après que le visiteur a soumis le formulaire.

Call-to-action

Un module CTA place un CTA dans son propre module au sein de votre mise en page. Vous pouvez également insérer un CTA dans un module de texte enrichi.

Dans l'inspecteur, cliquez sur le menu déroulant CTA  et  et sélectionnez un CTA par défaut pour ce module dans votre modèle. Ou cliquez sur + Créer un nouveau CTA dans le même menu pour créer un nouveau CTA comme CTA par défaut. 

Suivez-moi

Remarque : le module Suivez-moi n'est pas disponible pour les modèles d'e-mail. 

Vous pouvez utiliser le module Suivez-moi  Suivez-moi  pour aider vos visiteurs à contacter votre entreprise sur les réseaux sociaux. Contrairement au module Partage sur les réseaux sociaux, le module Suivez-moi redirige directement les visiteurs vers les sites de réseaux sociaux associés.

Lorsque vous ajoutez un module Suivez-moi, vous pouvez personnaliser l'en-tête du module qui s'affiche au-dessus des icônes des réseaux sociaux.

Vous pouvez spécifier quels réseaux sociaux apparaissent dans ce module dans la section Suivez-moi de vos paramètres des réseaux sociaux.

Remarque : le module Suivez-moi utilise des icônes par défaut pour chaque réseau social. Si vous souhaitez utiliser vos propres icônes de réseaux sociaux personnalisées, vous pouvez créer une version personnalisée du module. 

Formulaire

Remarque : le module Formulaires n'est pas disponible pour les modèles d'e-mail. 

Le module Formulaires vous permet d'ajouter un formulaire à votre page ou à votre blog afin de récupérer les coordonnées des visiteurs de votre site web.

Pour ce module, vous pouvez personnaliser les paramètres suivants : 

1. Titre de formulaire : saisissez le titre du formulaire qui s'affichera sur la page ou le blog.
2. Formulaire : sélectionnez un formulaire HubSpot existant qui doit s'afficher sur la page ou ajoutez un nouveau formulaire.
3. Quel contenu voulez-vous qu'un visiteur voie après avoir envoyé votre formulaire ? : choisissez de rediriger une personne qui soumet le formulaire vers une autre page ou d'afficher un message de remerciement en ligne sur la même page.
4. Message de remerciement : personnalisez votre message de remerciement en ligne.
5. Envoyer les notifications pour les soumissions de formulaire à des adresses spécifiques au lieu de celles par défaut : envoyez des e-mails de notification depuis l'outil Formulaires à des adresses spécifiques. Cela remplacera tout destinataire des notifications défini dans l'outil Formulaires. 
6. Ajouter au workflow : ajoutez à un workflow les visiteurs qui soumettent le formulaire (Marketing Hub Pro ou Entreprise uniquement).
7. Envoyer un e-mail de suivi : envoyez jusqu'à trois e-mails de suivi aux visiteurs qui soumettent le formulaire.

Titre

Un module d'en-tête affiche une ligne de texte dans une balise HTML d'en-tête. Saisissez le texte d'en-tête par défaut dans la case Contenu du titre. Cliquez sur le menu déroulant Type de titre pour sélectionner la balise d'en-tête (H1-H4).

Image

Un module image ajoute une seule image à du contenu. Découvrez-en davantage sur les options de modification des modules d'image. 

Galerie d'images

Le module Galerie ajoute une série d'images en rotation à un seul module. Découvrez-en davantage sur les paramètres personnalisables du module de galerie d'images. 

Sélecteur de langue

Remarque : le module de sélection de langue n'est pas disponible pour les modèles d'e-mail. 

Le module Sélecteur de langue permet aux visiteurs de basculer d'une version traduite d'une page ou d'un blog à une autre. Cliquez sur le menu déroulant Mode d'affichage pour personnaliser l'affichage des noms de vos langues traduites :

• Pagelang : le nom de chaque langue apparaîtra dans la langue de la page actuelle. Par exemple, si vous consultez la version anglaise d'une page dotée d'une traduction en français et que vous cliquez sur le bouton Sélecteur de langue, vous verrez les mots English et French. 
• Localisé/Localized : le nom de chaque langue s'affichera dans la langue sélectionnée pour la page. Par exemple, si vous consultez la version anglaise d'une page traduite en français, lorsque vous cliquez sur le sélecteur de langue, vous verrez apparaître English et Français comme noms de langue.
• Hybride : une combinaison des deux. Par exemple, si vous consultez la version anglaise d'une page traduite en français, lorsque vous cliquez sur le sélecteur de langue, vous verrez apparaître les noms de langue Anglais et French (Français).

Ce module apparaîtra uniquement sur les pages en ligne dont plusieurs traductions ont été publiées. Découvrez-en davantage sur l'utilisation de contenu multilingue dans HubSpot.

Logo

Le module Logo introduit automatiquement le logo de votre entreprise à partir des paramètres de votre site. Pour utiliser un autre logo, cliquez sur le bouton Remplacer le logo par défaut pour cette page pour activer le chargement d'une nouvelle image pour cette page uniquement. Pour modifier le logo par défaut pour tout le contenu dans les paramètres de votre site web, cliquez sur Modifier le logo par défaut de ce domaine.

Votre module de logo sera automatiquement lié au domaine de votre entreprise. Pour remplacer cette valeur par défaut et créer un lien vers une autre page, saisissez une URL de lien unique.

Grille de logo

Le module Grille de logo vous permet de disposer plusieurs logos de différentes dimensions dans une grille cohérente. Vous pouvez personnaliser la couleur d'arrière-plan, le format, la taille de la grille, la taille de l'espacement et la hauteur maximale du logo. 

Corps principal de l'e-mail

Le module Corps de l'e-mail principal est un module de texte enrichi standard qui est inclus par défaut dans chaque modèle d'e-mail. Vous pouvez personnaliser le contenu par défaut du corps de l'e-mail sur un modèle spécifique.

Outre les options standard de style, ce module peut être personnalisé avec des couleurs par défaut, des bordures et des espacements. Cliquez sur le cercle coloré et sélectionnez une couleur dans le sélecteur de couleurs, ou saisissez une valeur hexadécimale dans le champ de texte pour définir des couleurs par défaut. Saisissez des valeurs en pixels dans les champs de texte Largeur de bordure et Espacement intérieur pour définir un espacement par défaut. 

Menu

Le module de menu permet de naviguer dans votre contenu et vos modèles. Les menus sont créés et gérés directement dans les paramètres de votre site web. 

Dans les outils de conception, vous pouvez personnaliser les fonctionnalités suivantes du module Menu :

1. Menu : sélectionnez l'un de vos menus existants à partir de vos paramètres.
2. Type de menu avancé : – sélectionnez le mode d'affichage des éléments du menu sur votre site :
   • Statique – Toujours afficher les pages d'accueil dans le  menu : maintenez le menu cohérent sur toutes vos pages.
   • Dynamique par section - Affichez les pages du  menu  lesquelles sont liées à  la section  consultée : affichez les éléments du menu en rapport avec l'élément du menu principal consulté. 
   • Dynamique par page - Afficher les pages du  menu  lesquelles sont liées à  la page  consultée : affichez les éléments de menu liés à la page spécifique consultée.
   • Menu de style fil d'Ariane (utilise le flux horizontal) : affichez des éléments du menu horizontalement dans un chemin relatif en haut de votre site.
3. Niveaux max : sélectionner le nombre maximum d'éléments du menu enfant qui peuvent être affichés.
4. Orientation : indiquez si les éléments de menu s'affichent horizontalement ou verticalement.
5. Activer les lanceurs : cochez cette case pour afficher les éléments de menu enfants lorsque vous placez le curseur sur les éléments parents. Décochez cette case pour toujours afficher les éléments du menu enfant.

Modules

Les modules créés dans l'éditeur de code vous permettent d'utiliser HTML, CSS, Javascript et HubL pour ajouter des fonctionnalités avancées à vos modèles, tout en permettant à vos utilisateurs de modifier le contenu du module dans l'éditeur de contenu sans changer le code. Ces composants seront libellés avec une icône de module customModules dans l'outil de recherche et l'inspecteur. Pour en savoir plus sur l'utilisation des modules codés sur mesure, consultez la documentation des développeurs.

Adresse de l'entreprise

Le module Adresse de l'entreprise comprend les jetons requis qui doivent être inclus dans un modèle d'e-mail afin d'envoyer légalement des e-mails marketing. Bien que vous puissiez modifier le style de ce module, vous ne pourrez pas enregistrer un modèle d'e-mail sans le module Adresse de l'entreprise ou les balises  HubL  requises.  

Outre les options standard de style, ce module peut être personnalisé avec des couleurs par défaut, des bordures et des espacements. Cliquez sur le cercle coloré et sélectionnez une couleur dans le sélecteur de couleurs, ou saisissez une valeur hexadécimale dans le champ de texte pour définir des couleurs par défaut. Saisissez des valeurs en pixels dans les champs de texte Largeur de bordure et Espacement intérieur pour définir un espacement par défaut. 

Une ligne de texte

Le module « Une ligne de texte » permet aux utilisateurs de modifier une seule ligne de texte dans l'éditeur de contenu. 

Pied de page

Le module Pied de page affiche des informations de propriété intellectuelle avec l'année en cours et le nom de votre entreprise. Le nom de l'entreprise est automatiquement extrait de la section Pied de page de vos paramètres d'e-mail.

Invite de mot de passe

Le module d'invite de mot de passe est disponible dans les modèles système d'invite de mot de passe. Si une page est protégée par un mot de passe, la page d'invite de mot de passe s'affiche. Le texte du bouton de soumission ainsi que le texte à afficher en cas de mot de passe incorrect peuvent être personnalisés.

Filtrage des articles

Remarque : le module d'abonnement aux e-mails de blog n'est pas disponible pour les modèles d'e-mail. 

Le module Filtrage des articles affiche une liste d'articles de blog associés à un sujet, un mois ou un auteur donné. 

Vous pouvez personnaliser les paramètres suivants de ce module dans la section Contenu par défaut : 

• Sélectionnez un blog à afficher : sélectionnez les articles de blog utilisés.
• Liste de valeurs permettant de filtrer les liens : indiquez si le module est filtré par balise, mois ou auteur.
• Ordre des valeurs permettant de filtrer les liens : indiquez si les valeurs seront organisées par ordre alphabétique ou par nombre d'articles.
• Titre de liste à afficher : saisissez le titre qui s'affichera au-dessus des articles.
• Nombre maximal de valeurs de filtre à afficher : saisissez le nombre maximal d'articles pour un filtre spécifique. Laissez ce champ vide pour afficher tous les articles. 
• Texte du lien permettant d'afficher des valeurs supplémentaires, le cas échéant : saisissez le texte qui s'affiche si une catégorie contient plus d'articles disponibles. Le texte par défaut est Voir tout. 

Listing des articles

Remarque : le module d'abonnement aux e-mails de blog n'est pas disponible pour les modèles d'e-mail. 

Le module Listing des articles permet d'afficher une liste des articles d'un blog HubSpot. Vous pouvez configurer le module de façon à afficher les articles les plus récents ou les plus populaires au cours du mois dernier, des six derniers mois, de l'année dernière ou depuis toujours. 

Il est possible de personnaliser les contenus par défaut suivants dans l'inspecteur :

• Sélectionner un blog à afficher : sélectionnez le blog dont vous souhaitez afficher le titre des articles.
• Lister les articles de blog par : sélectionnez de quelle façon vous souhaitez organiser les articles.
• Titre de liste à afficher : saisissez le titre qui s'affichera au-dessus des articles.
• Nombre maximal d'articles de blog à lister : saisissez le nombre maximal d'articles qui s'afficheront dans ce module. 

Texte enrichi

Le module de texte enrichi est le module de contenu le plus couramment utilisé dans les outils de contenu HubSpot. Il prend en charge les options d'édition pour différents composants, tels que le texte, les images et les CTA.

Pour ajouter du contenu par défaut pour ce module, cliquez sur Développer ou cliquez sur l'aperçu du contenu pour ouvrir un éditeur de texte enrichi.

Listing RSS

Remarque : le module Liste RSS n'est pas disponible pour les modèles d'e-mail. Utilisez plutôt un e-mail RSS. 

Vous pouvez utiliser un module de liste RSS pour afficher les récapitulatifs des articles d'un blog HubSpot ou d'un flux RSS externe.

Les modules Listing RSS peuvent afficher un blog ou une balise spécifique. Cliquez pour activer l'option correspondante pour indiquer si une image en vignette, le nom de l'auteur, un récapitulatif ou la date de publication doivent être affichés avec chaque message.

Après avoir activé ces paramètres, vous pouvez personnaliser les détails suivants : 

• Afficher le nom de l'auteur : saisissez le Texte d'attribution de l'auteur qui doit s'afficher au-dessus de chaque nom d'auteur. Par défaut, ce module prévoit le mot par comme texte d'attribution.
• Afficher le récapitulatif : saisissez la longueur du récapitulatif en caractères pour chaque récapitulatif de blog. Vous pouvez également personnaliser le Texte du clic publicitaire du récapitulatif, qui représente le lien de blog sur lequel les visiteurs cliquent pour lire votre article complet. Par défaut, ce texte sera libellé par l'expression Lire plus.
• Afficher la date de publication : sélectionnez le Format de la date de publication pour personnaliser le formatage de la date et de l'heure pour chaque article. Il est également possible de personnaliser le texte d'indication de la date de publication. Par défaut, ce texte sera libellé comme suit : Publié le.

Titre de la section

Le module Titre de section permet d'afficher une balise d'en-tête h1 avec un sous-titre de paragraphe. Ce module est idéal pour donner un titre à la section principale d'une page.

Menu simple

Le module Menu simple permet aux utilisateurs de créer un menu pour une page donnée, directement dans l'éditeur de contenu. Ce module permet de créer un menu simple pour un modèle spécifique. Dans l'inspecteur, cliquez sur Modifier le menu pour ajouter des éléments de menu, des liens et sélectionner l'orientation du menu. La modification du paramètre d'orientation du menu ajoute une classe de hs-menu-flux-horizontal ou hs-menu-flux-vertical au conteneur du wrapper du menu, qui peut ensuite être utilisé pour la stylisation dans votre CSS. Découvrez-en davantage sur les classes ajoutées par les paramètres du module dans notre documentation de développeur.

Partage sur les réseaux sociaux

Le module Partage sur les réseaux sociaux permet de partager facilement votre contenu sur les réseaux sociaux et les e-mails. Cliquez sur le bouton Activé ? à côté d'un réseau social spécifique pour l'inclure dans votre page ou e-mail.

Le lien de partage s'insère automatiquement avec les balises HubL requises pour partager votre contenu. Dans les e-mails, le module utilisera l'URL de la version web de cet e-mail dans le lien de partage.

Remarque : le module de partage sur les réseaux sociaux utilise des icônes par défaut pour chaque réseau social. Si vous souhaitez utiliser vos propres icônes de réseaux sociaux personnalisées, vous pouvez créer une version personnalisée du module.

Préférences d'abonnement

Les modules Préférences d'abonnement ne sont disponibles que sur modèles système des préférences d'abonnement. 

Il permet de personnaliser la page affichée lorsque le destinataire d'un e-mail accède à ses préférences d'abonnement ou se désabonne des communications par e-mail.

Confirmation de mise à jour de l'abonnement

Le module de confirmation de mise à jour d'abonnement est un module de texte enrichi disponible sur les modèles système de confirmation de mise à jour d'abonnement. Il vous permet de personnaliser la page affichée lorsque le destinataire d'un e-mail met à jour ses paramètres d'abonnement.

Afficher en tant que page web

Le module "view as web page" permet aux destinataires d'un e-mail d'ouvrir la page Web d'un e-mail. 

Lien WhatsApp 

Remarque : ce module est disponible uniquement pour les comptes Marketing Hubet Service Hub Pro et Entreprise.

Utilisez le module Lien WhatsApp pour permettre aux visiteurs du site web de communiquer directement avec vous via WhatsApp. Ce module peut être ajouté aux pages du site web, aux articles de blog et aux pages de listes de blogs. Pour utiliser ce module, vous devez connecter votre canal WhatsApp à votre boîte de réception des conversations.

Le style des boutons, comme la couleur et l'espacement, peut être personnalisé dans l'onglet Styles de l'éditeur de page, et vous pouvez configurer les éléments suivants :

• Numéro WhatsApp : sélectionnez un numéro WhatsApp connecté.
• Texte d'inscription : sélectionnez le texte d'inscription et de désinscription. 
• Afficher : indiquez si le bouton affiche du texte, une icône ou les deux.
• Position de l'icône : indiquez si l'icône doit apparaître à gauche ou à droite du texte.
• Texte du bouton : saisissez le texte qui figure sur le bouton.
• Titre de l'icône WhatsApp : à des fins d'accessibilité, saisissez la description de l'icône pour les lecteurs d'écran.