> ## Documentation Index > Fetch the complete documentation index at: https://developers.hubspot.fr/docs/llms.txt > Use this file to discover all available pages before exploring further. # Modules web par défaut > Découvrez les modules par défaut fournis par HubSpot pour la création de modèles de pages de site web, d'articles et de listing de blog. Ces modules sont distincts des modules d'e-mail par défaut, qui sont destinés aux modèles d'e-mails. Découvrez ci-dessous les modules par défaut fournis par HubSpot pour la création de modèles de pages de site web, d'articles de blog et de pages de listing de blog. Vous trouverez également des modules par défaut qui peuvent être utilisés pour créer des modèles de devis. Lorsque vous développez localement, vous pouvez [récupérer](https://developers.hubspot.fr/docs/guides/cms/tools/local-development-cli#fetch-files) un module par défaut spécifique en utilisant le chemin d'accès au module (par exemple : `hs fetch @hubspot/linked_image.module`). Pour afficher le code d'un module par défaut, vous pouvez afficher et cloner le module dans le dossier `@hubspot` du gestionnaire de conception. Dans le code, certains modules par défaut utilisent l'ID de compte par défaut 7052064, plutôt que celui appartenant au compte courant. design-manager-default-modules ### Remarque : Les modules web par défaut sont différents des [modules d'e-mail par défaut](/docs/cms/start-building/building-blocks/modules/default-email-modules), qui sont destinés aux modèles d'e-mail. Si vos modèles d'e-mails comprennent l'un des modules web par défaut suivants, vous devez [les remplacer par le module spécifique d'e-mail correspondant](https://developers.hubspot.fr/docs/guides/cms/content/templates/default-email-modules) : * `cta` * `header` * `linked_image` * `logo` * `post_filter` * `post_listing` * `section_header` * `social_sharing` * `text` ## Commentaires de blog Pris en charge dans les articles de blog et les listings de blog. ```hubl theme={null} {% module "blog_comments" path="@hubspot/blog_comments" %} ``` ## Abonnement par e-mail au blog Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "blog_subscribe" path="@hubspot/blog_subscribe" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------ | ------------- | ------------------------------------------------------- | ----------------------------- | | `select_blog` | Blog | Le blog à utiliser pour le module. | | | `title` | Chaîne | Titre du module (enveloppé dans une balise h3) | Abonnez-vous ici ! | | | | | | | `response_message` | Texte enrichi | Le message qui s'affiche lors de l'envoi du formulaire. | Merci pour votre abonnement ! | | | | | | ## Articles de blog Ajoutez ce module aux pages de listing de blogs pour afficher des aperçus d'articles de blog contenant le titre, l'image en vignette, l'auteur ou encore la date de publication à l'aide d'un bouton cliquable qui permet d'accéder à l'article. Ce module par défaut a été créé à l'aide de React, et vous pouvez [consulter son code source sur GitHub](https://github.com/HubSpot/cms-react/tree/main/default-react-modules/src/components/modules/BlogPosts-V0). ### Remarque : * Ce module n'est pas accessible depuis le gestionnaire de conception. Le module peut être référencé avec HubL dans des modèles codés et ajouté dans [l'éditeur de page de listing de blog](https://knowledge.hubspot.com/fr/blog/edit-a-blog-listing-page). * Ce module remplace le module précédent obsolète `blog_listing`. ```hubl theme={null} {% module "blog_posts" path="@hubspot/blog_posts" layout="grid", columns=4, displayForEachListItem=[ "image", "title", "authorName", "tags", "publishDate", "description", "button" ] %} ``` | Paramètre | Type | Description | Par défaut | | ------------------------ | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | | `layout` | Choix | La mise en page du contenu pour chaque aperçu d'article de blog. | `grid` | | `columns` | Nombre | Lors de l'utilisation de la mise en page `grid`, le nombre d'articles par ligne. Peut être `2`, `3`, ou `4`. | `3` | | `alternateImage` | Booléen | Lorsque vous utilisez la mise en page `sideBySide`, définissez sur `true` pour aligner les images en vignette à droite et à gauche de l'aperçu de l'article, en alternance. | `false` | | `fullImage` | Booléen | Lorsque vous utilisez les mises en page `grid` ou `singleColumn`, définissez ce champ sur `true` pour faire de l'image en vignette l'arrière-plan de l'aperçu du post. | `false` | | `displayForEachListItem` | Tableau | Le contenu à inclure dans l'aperçu de chaque article de blog. Les choix incluent : | `[ 'image', 'title', 'authorImage', 'authorName', 'tags', 'publishDate', 'description', 'button' ]` | | `buttonText` | Chaîne | Le texte qui s'affiche sur le bouton « En savoir plus », le cas échéant. | En savoir plus | ## Filtre d'article de blog Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "post_filter" path="@hubspot/post_filter" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------ | ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------- | | `select_blog` | Blog | Sélectionnez un blog à afficher. Par défaut, utiliser le blog actuel lorsqu'il est utilisé dans un modèle de blog ou le blog principal lorsqu'il est utilisé ailleurs. | | | `filter_type` | Choix | Type de filtrage des liens à afficher. Les choix comprennent : | `tag` | | `order_by` | Choix | Ordre pour les valeurs des liens de filtre. Les choix comprennent : | `post_count` | | `list_title` | Texte | Un en-tête H3. | Articles par balise | | `max_links` | Nombre | Nombre de liens de filtre à afficher. Laisser vide pour tout afficher. | `5` | | `expand_link_text` | Texte | Texte à afficher si une valeur à afficher et supérieure à `max_links` est disponible. | Voir tout | ## Listing d'article de blog Pris en charge dans les pages, les listings de blog et les articles de blog. ### Remarque : Une nouvelle version de ce module a été publiée fin mars 2024. Découvrez-en davantage sur le [nouveau module de listing d'articles par défaut](/docs/cms/reference/modules/default-module-versioning#post-listing). ```hubl theme={null} {% module "post_listing" path="@hubspot/post_listing" %} ``` | Paramètre | Type | Description | Par défaut | | -------------- | ------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------- | | `select_blog` | Blog | Sélectionnez un blog à afficher. Par défaut, utiliser le blog actuel lorsqu'il est utilisé dans un modèle de blog ou le blog principal lorsqu'il est utilisé ailleurs. | | | `listing_type` | Choix | Le type de listing pour vos articles. Les choix comprennent : | `recent` | | `list_title` | Texte | Un en-tête H3. | Articles récents | | `max_links` | Nombre | Le nombre maximal d'articles à afficher. | `5` | ## Bouton Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "button" path="@hubspot/button" %} ``` | Paramètre | Type | Description | Par défaut | | ------------- | ----- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `link` | Lien | L'URL vers laquelle le bouton redirige. | `{ "url": { "type": "EXTERNAL", "href": "www.hubspot.com", "content_id": null }, "open_in_new_tab": false, "no_follow": false }` | | `button_text` | Texte | Le texte qui sera affiché sur le bouton. | Ajouter un bouton de lien ici | | | | | | | `style` | Objet | | `{ "override_default_style": false, "button_font": { "color": "#FFFFFF", "size_unit": "px" }, "button_color": { "color": "#000000", "opacity": 100 }, "text_hover_color": { "color": "#000000", "opacity": 100 }, "button_hover_color": { "color": "#CCCCCC", "opacity": 100 } }` | ## Call-to-action Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "cta" path="@hubspot/cta" %} ``` | Paramètre | Type | Description | | --------- | ------ | ----------------------------------------- | | `guid` | Chaîne | GUID (identifiant général unique) du CTA. | ## Supprimer les données Depuis le 26 mai 2025, ce module est devenu obsolète au profit de la [fonctionnalité de page de demande de confidentialité des données](https://knowledge.hubspot.com/fr/privacy-and-consent/manage-data-privacy-requests). Les informations de référence concernant ce module ont été déplacées dans la documentation sur les [modules obsolètes](/docs/cms/versions-deprecations/deprecated/modules#delete-data). ## Séparateur Pris en charge dans les pages. Il existe une [nouvelle version de ce module](/docs/cms/reference/modules/default-module-versioning#divider) disponible pour les comptes créés après le 25 août 2022. [En savoir plus sur ce changement](https://developers.hubspot.com/changelog/divider-module-v1). ```hubl theme={null} {% module "divider" path="@hubspot/divider" %} ``` | Paramètre | Type | Description | Par défaut | | -------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | | `height` | Nombre | Hauteur en pixels (px) de la ligne de séparation. | `1` | | `width` | Nombre | Largeur en pourcentage (%) de la ligne de séparation. | `50` | | `color` | Couleur | Couleur (hex) et opacité (nombre) de la ligne de séparation. | `{ "color": "#000000", "opacity": 100 }` | | `line_type` | Choix | Type de ligne. Les choix comprennent : | `solid` | | `alignment` | Choix | Alignement horizontal de la ligne de séparation. Les choix comprennent : | `center` | | `show_padding` | Booléen | Afficher/masquer les marges supérieures et inférieures sur le séparateur. | `false` | | `padding` | Nombre | Valeur en pixels (px) des marges en haut et en bas de la ligne de séparation. Option disponible lorsque `show_padding` est égal à `true`. | `5` | ## Télécharger les données Depuis le 26 mai 2025, ce module est devenu obsolète au profit de la [fonctionnalité de page de demande de confidentialité des données](https://knowledge.hubspot.com/fr/privacy-and-consent/manage-data-privacy-requests). Les informations de référence concernant ce module ont été déplacées dans la documentation sur les [modules obsolètes](/docs/cms/versions-deprecations/deprecated/modules#download-data). ## Formulaire Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "form" path="@hubspot/form" form={ "form_id": "9e633e9f-0634-498e-917c-f01e355e83c6", "response_type": "redirect", "message": "Thanks for submitting the form.", "redirect_id": null, "redirect_url": "http://www.google.com" } %} ``` | Paramètre | Type | Description | Par défaut | | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------- | | `title` | Texte | En-tête H3 | | | `form` | Objet | Objet du formulaire comprenant : | | | `{ "form_id": "", "response_type": "redirect", "message": "Thanks for submitting the form.", "redirect_id": null, "redirect_url": "http://www.google.com" }` | | | | | `notifications_are_overridden` | Booléen | E-mail auquel envoyer une notification de formulaire au lieu des formulaires par défaut. | `false` | | `notifications_override_email_addresses` | E-mail | Liste d'e-mails à envoyer, séparés par des virgules, quand `notifications_are_overridden` est égal à `true`. | | | `follow_up_type_simple` | Booléen | Active l'envoi d'un e-mail de suivi. | `false` | | `simple_email_for_live_id` | E-mail de suivi | ID de l'e-mail de suivi. Disponible lorsque `follow_up_type_simple` est égal à `true`. | | | `sfdc_campaign` | Campagne Salesforce | Lorsque l'intégration Salesforce est active, l'ID de campagne. | | ## En-tête Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "header" path="@hubspot/header" %} ``` | Paramètre | Type | Description | Par défaut | | ------------ | ----- | --------------------------------------------------------------- | ----------------------------- | | `value` | Texte | Texte de l'en-tête. | Un en-tête clair et percutant | | `header_tag` | Choix | Choisir un niveau d'en-tête. Les choix comprennent `h1` à `h6`. | `h1` | ## Espacement horizontal Pris en charge dans les pages, les listings de blog, les articles de blog et les e-mails. ```hubl theme={null} {% module "horizontal_spacer" path="@hubspot/horizontal_spacer" %} ``` ## Icône Pris en charge dans les pages, les listings de blog et les articles de blog. Les icônes peuvent être extraites des ensembles d'icônes Font Awesome 5.0.10 et 5.14.0. ```hubl theme={null} {% module "icon" path="@hubspot/icon" %} ``` | Paramètre | Type | Description | Par défaut | | --------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------- | | `name` | Chaîne | Le nom de l'icône. | `"hubspot"` | | `purpose` | Choix | Une option d'accessibilité qui catégorise l'objectif de l'icône pour les lecteurs d'écran. Les valeurs disponibles sont : | `"decorative"` | | `title` | Chaîne | Une option d'accessibilité qui attribue un titre à l'icône. | | | `style` | Chaîne | Le type d'icône. Peut être `solid`, `regular`, `light`, `thin` ou `duotone`. | `"solid"` | | `unicode` | Chaîne | La valeur unicode de l'icône. | `f3b2` | ## Image Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "linked_image" path="@hubspot/linked_image" %} ``` | Paramètre | Type | Description | Par défaut | | --------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `img` | Image | Objet image contenant : | `{ "src": "https://static.hubspot.com/final/img/content/email-template-images/placeholder_200x200.png", "alt": "placeholder_200x200", "loading": "disabled", "width": 200, "height": 200 }` | | `link` | Texte |  : lien facultatif pour l'image. | | | `target` | Booléen | Ouvre le lien dans un nouvel onglet. | `false` | ## Grille d'image Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "image_grid" path="@hubspot/image_grid", label="image_grid.module" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------ | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------- | | `slides` | Objet | Objet contenant des informations pour chaque diapositive. L'objet contient : | `[ { "show_caption": false, "open_in_new_tab": false } ]` | | `display_mode` | Choix | Mode d'affichage de la galerie d'images. Les choix comprennent : | `standard` | | `lightboxRows` | Nombre | Nombre de lignes dans la galerie de la Lightbox lorsque `display_mode` est égal à `lightbox`. | `3` | | `loop_slides` | Booléen | Active la boucle dans les diapositives avec suivant ou précédent quand `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `auto_advance` | Booléen | Avance automatiquement sur la diapositive suivante lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `num_seconds` | Nombre | Durée (en secondes) entre l'avancement à la diapositive suivante lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `5` | | `show_pagination` | Booléen | Affiche les boutons de navigation lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `sizing` | Choix | Définit la hauteur des diapositives lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix comprennent : | `static` | | `transition` | Choix | Styles de transition de diapositive lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix sont les suivants : | `slide` | | `caption_position` | Choix | Position des légendes des diapositives lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix comprennent : | `below` | ## Galerie d'images Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "gallery" path="@hubspot/gallery" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------ | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------- | | `slides` | Objet | Objet contenant des informations pour chaque diapositive. L'objet contient : | `[ { "show_caption": false, "open_in_new_tab": false } ]` | | `display_mode` | Choix | Mode d'affichage de la galerie d'images. Les choix comprennent : | `standard` | | `lightboxRows` | Nombre | Nombre de lignes dans la galerie de la Lightbox lorsque `display_mode` est égal à `lightbox`. | `3` | | `loop_slides` | Booléen | Active la boucle dans les diapositives avec suivant ou précédent quand `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `auto_advance` | Booléen | Avance automatiquement sur la diapositive suivante lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `num_seconds` | Nombre | Durée (en secondes) entre l'avancement à la diapositive suivante lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `5` | | `show_pagination` | Booléen | Affiche les boutons de navigation lorsque `display_mode` est égal à `standard` ou `thumbnail`. | `true` | | `sizing` | Choix | Définit la hauteur des diapositives lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix comprennent : | `static` | | `transition` | Choix | Styles de transition de diapositive lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix sont les suivants : | `slide` | | `caption_position` | Choix | Position des légendes des diapositives lorsque `display_mode` est égal à `standard` ou `thumbnail`. Les choix comprennent : | `below` | ## Galerie de curseur d'images Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "unique_name" path="@hubspot/image_slider_gallery", slides=[ { "img": { "src": "", "alt": "Default image alt text" }, "caption": "1 An optional caption for the image that will be added to the gallery. Enter any descriptive text for this image that you would like visitors to be able to read.", "link_url": "" }, { "img": { "src": "", "alt": "Default image alt text" }, "caption": "2 An optional caption for the image that will be added to the gallery. Enter any descriptive text for this image that you would like visitors to be able to read.", "link_url": "" } ] slideshow_settings={ "slides": { "per_page": 1, "sizing": "natural", "aspect_ratio": "16/9", "show_captions": true, "caption_position": "below" }, "movement": { "transition": "slide", "loop_slides": false, "auto_advance": false, "auto_advance_speed_seconds": 5 }, "navigation": { "show_main_arrows": true, "show_thumbnails": false, "show_dots": false } } %} ``` | Paramètre | Type | Description | | -------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `slides` | Groupe de champs | Un groupe de champs contenant les champs suivants : | | `slideshow_settings` | Groupe de champs | Le groupe de champs des paramètres du curseur d'image. Comprend les groupes de champs suivants : | | `default_text` | Groupe de champs | Les éléments de texte par défaut du module, y compris : | ## Sélecteur de langue Pris en charge dans les pages. ```hubl theme={null} {% module "language_switcher" path="@hubspot/language_switcher" %} ``` | Paramètre | Type | Description | Par défaut | | -------------- | ----- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | | `display_mode` | Choix | La langue du texte dans le sélecteur de langue. Les options comprennent : | `localized` | ## Logo Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "logo" path="@hubspot/logo" %} ``` | Paramètre | Type | Description | Par défaut | | ----------------------- | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- | | `img` | Image | Objet image contenant : | `{ "override_inherited_src": false, "src": null, "alt": null }` | | `link` | Texte | Lien facultatif pour le logo. Si aucune URL n'est spécifiée, votre logo sera lié à l'*URL du logo* définie dans les [paramètres de votre marque](https://knowledge.hubspot.com/fr/branding/edit-your-logo-favicon-and-brand-colors#edit-your-logo). | | | `open_in_new_tab` | Booléen | Ouvre le lien dans un nouvel onglet. | `false` | | `suppress_company_name` | Booléen | Masquer le nom de l'entreprise lorsqu'aucune image n'est sélectionnée. | `true` | | `heading_level` | Choix | Choisissez un niveau d'en-tête lorsqu'aucune image n'est sélectionnée et `suppress_company_name` est égal à `false`. Les choix comprennent `h1` à `h6`. | `h1` | ## Grille de logo Une grille personnalisable de conteneurs pour afficher les logos de manière uniforme. Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "logo grid" path="@hubspot/logo_grid" group_logos=[ { "logo": { "loading": "lazy", "alt": "company_logo", "src": "https://www.example.com/Logos/color/logo.png" } }, { "logo": { "loading": "lazy", "alt": "company2_logo", "src": "https://www.example.com/Logos/color/logo2.png" } }, { "logo": { "alt": "lorem-logo", "height": 40, "loading": "lazy", "max_height": 40, "max_width": 175, "src": "https://www.example.com/Logos/color/logo3.png", "width": 175 } } ], styles={ "group_logo": { "group_background": { "aspect_ratio": "1/1", "background_color": { "color": "#8E7CC3", "opacity": 100 } }, "group_spacing": { "padding": { "padding": { "bottom": { "units": "px", "value": 75 }, "left": { "units": "px", "value": 75 }, "right": { "units": "px", "value": 75 }, "top": { "units": "px", "value": 75 } } } }, "max_logo_height": 85 }, "group_logo_grid": { "column_count": 3, "grid_gap": 54 } } %} ``` | Paramètre | Type | Description | | ------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `group_logos` | Tableau | Un tableau contenant un objet pour chaque logo de la grille. | | `logo` | Objet | Dans `group_logos`, un objet pour chaque logo de la grille. Chaque logo peut inclure les paramètres suivants : | | `styles` | Tableau | Un tableau contenant les champs de style qui affectent la disposition de la grille, les conteneurs de logo et les images de logo. Ce tableau contient les groupes de styles suivants : | ## Réunions Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "meetings" path="@hubspot/meetings" %} ``` | Paramètre | Type | Description | | --------- | ------- | --------------------------------------------- | | `meeting` | Réunion | Sélectionner un lien de prise de rendez-vous. | ## Connexion des membres à des réseaux sociaux Fournit les options de connexion Google et Facebook pour [les pages de contrôle d'accès](/docs/cms/start-building/features/memberships/overview). L'utilisateur doit se connecter avec un compte lié à l'adresse e-mail de sa fiche d'informations d'un contact dans le CRM. Vous pouvez choisir les connexions aux réseaux sociaux à activer. Pris en charge dans les pages de connexion au contrôle d'accès. ```hubl theme={null} {% module "social" path="@hubspot/membership_social_logins", clientid="" appid="" facebook_enabled=true google_enabled=true %} ``` Facebook nécessite d'avoir un [compte de développeur Facebook](https://developers.facebook.com/docs/development/register) et la [création d'une application Facebook](https://developers.facebook.com/docs/development/create-an-app) avec des paramètres de base. Une fois que vous réalisez cette étape, vous transmettrez votre ID d'application au module. Google exige un compte Google et [des informations d'identification d'autorisation créées](https://developers.google.com/identity/sign-in/web/sign-in#create_authorization_credentials), et une fois que possédez ces informations, vous transmettrez votre ID de client de l'application au module. | Paramètre | Type | Description | Par défaut | | ------------------ | ------- | ---------------------------------------------------------------------------------- | ---------- | | `facebook_appid` | Chaîne | Votre ID d'application Facebook. | | | `facebook_enabled` | Booléen | Active le bouton de connexion Facebook. `facebook_appid` est obligatoire. | `False` | | `google_clientid` | Chaîne | Votre identifiant de client Google. | | | `google_enabled` | Booléen | Permet d'activer le bouton de connexion Google. `google_clientid` est obligatoire. | `False` | ## Menu Pris en charge dans les pages, les articles de blog et les listings de blog. Vous cherchez à créer votre propre menu personnalisé ? Essayez notre [fonction menu()](/docs/cms/reference/hubl/functions#menu). ```hubl theme={null} {% module "menu" path="@hubspot/menu" %} ``` | Paramètre | Type | Description | Par défaut | | ------------ | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | | `id` | Menu | ID du menu. | | | `root_type` | Choix | Type de menu avancé. Les choix comprennent : | `site_root` | | `max_levels` | Choix | Détermine le nombre d'arborescences de menu enfant qui peuvent être étendues dans le menu Les choix compris sont de `1` à `10` | `2` | | `flow` | Choix | Orientation du menu. Les choix comprennent : | `horizontal` | | `flyouts` | Booléen | La fonctionnalité de survol est activée pour les éléments de menu enfants. | `true` | ## Pied de page Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "page_footer" path="@hubspot/page_footer" %} ``` ## Invite de mot de passe Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "password_prompt" path="@hubspot/password_prompt" %} ``` | Paramètre | Type | Description | Par défaut | | ---------------------- | ------------- | -------------------------------------------------------------------------- | ----------------- | | `submit_button_text` | Texte | Texte qui apparaît sur le bouton d'envoi. | Soumettre | | `password_placeholder` | Texte | Texte d'espace réservé pour le champ du mot de passe. | Mot de passe | | `bad_password_message` | Texte enrichi | Message pour afficher lorsqu'un mot de passe n'est pas saisi correctement. | Veuillez ressayer | ## Outils de paiement Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "payments" path="@hubspot/payments" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------- | ------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------- | | `payment` | Chaîne | Pour configurer le module afin qu'il utilise un lien de paiement spécifique, incluez l'ID du lien de paiement. Vous pouvez [trouver l'ID](/docs/cms/reference/fields/module-theme-fields#link) dans l'URL lorsque vous modifiez le lien de paiement. | | | `checkout_location` | Chaîne |  : définissez si le formulaire de paiement s'ouvre dans un nouvel onglet ou dans une superposition. Les valeurs disponibles sont les suivantes : | `"new_tab"` | | `button_text` | Chaîne | Définit le texte du bouton de paiement. | `"Checkout"` | | `button_target` | Choix | Indique si le bouton utilise un lien de paiement HubSpot ou un lien externe. Les choix comprennent : | `"payment_link"` | | `button_link` | Lien | Quand `button_target` est défini sur `custom_link`, il définit la destination du lien externe. Les types pris en charge comprennent : | `EXTERNAL` | ## Produit Affiche un produit de la [bibliothèque de produits](https://knowledge.hubspot.com/fr/products/how-do-i-use-products) du compte. Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module path="@hubspot/product", product={ "id" : 2124070179 }, group_button={ "button_text" : "Buy", "override_product_button" : true, "button_override" : { "no_follow" : false, "open_in_new_tab" : false, "sponsored" : false, "url" : { "href" : "https://www.test.com", "type" : "EXTERNAL" } }, group_description={ "description_override" : "Monthly gym membership with access to shared locker facilities.", "override_product_description" : true }, group_name={ "heading_level" : "h3", "name_override" : "Gym membership", "override_product_name" : true }, group_image={ "image_override" : { "alt" : "360_F_317724775_qHtWjnT8YbRdFNIuq5PWsSYypRhOmalS", "height" : 360, "loading" : "lazy", "src" : "https://2272014.fs1.hubspotusercontent-na1.net/hubfs/2272014/360_F_317724775_qHtWjnT8YbRdFNIuq5PWsSYypRhOmalS.jpg", "width" : 640 }, "override_product_image" : true } %} ``` | Paramètre | Type | Description | | ------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `product` | Produit | Le produit à afficher, spécifié par l'ID du produit. | | `group_button` | Groupe de champs | Par défaut, le module inclut un bouton qui dirige les utilisateurs vers l'URL définie du produit. Pour personnaliser la destination du bouton, incluez ce groupe de champs facultatif avec les champs suivants : | | `button_override` | Objet | Dans le groupe de champs `group_button`, cela définit le comportement de l'URL du bouton lorsque `override_product_button` est défini sur `true`. Inclut les champs suivants :Dans le champ `url`, vous pouvez définir le type de destination via le champ `type`, qui prend en charge les types de contenu suivants : | | `group_name` | Groupe de champs | Par défaut, le module affichera le nom du produit en haut du module sous la forme h3. Pour personnaliser le nom, incluez ce groupe de champs facultatif avec les champs suivants : | | `group_description` | Groupe de champs | Par défaut, le module affichera la description de l'ensemble de produits. Pour personnaliser la description, incluez ce groupe de champs facultatif avec les champs suivants : | | `group_image` | Groupe de champs | Par défaut, le module affichera l'image définie du produit. Pour personnaliser cette image, incluez ce groupe de champs facultatif avec les champs suivants : | ## Téléchargement du devis Pris en charge dans les modèles de devis. ```hubl theme={null} {% module "download" path="@hubspot/quote_download" %} ``` | Paramètre | Type | Description | Par défaut | | ---------------- | ------ | ------------------------------------------------------------------- | -------------------------------------------------------------- | | `button_text` | Chaîne | Le texte affiché sur le bouton de téléchargement. | `Download` | | `download_error` | Chaîne | Un message d'erreur qui s'affiche en cas d'échec du téléchargement. | `There was a problem downloading the quote. Please try again.` | ## Paiement du devis Pris en charge dans les modèles de devis. ```hubl theme={null} {% module "payment" path="@hubspot/quote_payment" %} ``` | Paramètre | Type | Description | Par défaut | | ---------------------- | ------------- | --------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- | | `heading_text` | Chaîne | L'en-tête affiché au-dessus de la section de paiement d'un modèle de devis. | `Payment` | | `heading_tag` | Choix | Le type d'en-tête utilisé pour afficher `heading_text`. Les valeurs comprennent : `h1`, `h2`, `h3`, `h4`, `h5`, `h6`. | `h3` | | `checkout` | Chaîne | Le texte du bouton de paiement. | `Pay now` | | `needs_signature` | Chaîne | Texte du bouton de chaîne lorsqu'une signature est requise. | Le paiement ne peut être effectué car le devis n'est pas signé. | | `checkout_error` | Texte enrichi | Message qui s'affiche en cas d'erreur lors du paiement. | Un problème est survenu lors de la configuration du paiement. Veuillez contacter la personne qui vous a envoyé cette facture. | | | | | | | `payment_status_error` | Texte enrichi | Message qui s'affiche en cas d'erreur lors d'une tentative de paiement. | Un problème est survenu lors du chargement du statut du paiement concernant ce devis. Veuillez essayer d'actualiser la page. | | | | | | | `paid` | Chaîne | Un indicateur de statut de paiement réussi. | `Paid` | | `payment_processing` | Chaîne | Un indicateur de l'état du traitement des paiements. | `Payment processing` | ## Signature du devis Pris en charge dans les modèles de devis. ```hubl theme={null} {% module "signature" path="@hubspot/quote_signature" %} ``` Lorsqu'un devis nécessite une signature électronique, les champs suivants sont disponibles dans un objet `esignature` : | Paramètre | Type | Description | Par défaut | | ------------------- | ------------- | ---------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | `pretext` | Texte enrichi | Texte d'explication de la signature électronique. | Avant de signer votre devis, un email doit vous être envoyé pour vérifier votre identité. Trouvez votre profil ci-dessous pour demander un e-mail de vérification. | | | | | | | `verify_button` | Chaîne | Texte qui s'affiche sur le bouton de vérification. | Vérifier pour signer | | | | | | | `failure` | Chaîne | Texte d'alerte qui s'affiche lorsque les informations de signature ne peuvent pas être récupérées. | Un problème est survenu lors de la récupération des informations sur la signature. Veuillez recharger la page. | | | | | | | `verification_sent` | Chaîne | Indicateur de statut qui apparaît lorsque la demande de vérification a été envoyée avec succès au signataire du devis. | `Verification sent` | | `signed` | String | Texte qui s'affiche lorsque le devis a été signé avec succès. | Signé | Lorsqu'un devis nécessite une signature imprimée, les champs suivants sont disponibles dans un objet `print_signature` : | Paramètre | Type | Description | Par défaut | | ------------------ | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------- | | `header` | Texte enrichi | Texte affiché en haut de la section de signature. | `Signature` | | `signature` | Chaîne | Texte qui s'affiche à côté du champ de signature. | `Signature` | | `date` | Chaîne | Texte qui s'affiche à côté du champ de date. | `Date` | | `printed_name` | Chaîne | Texte qui s'affiche à côté du champ de nom imprimé. | Nom (en majuscules) | | | | | | | `countersignature` | Objet | Un objet contenant du contenu pour la section de contre-signature. Cet objet peut contenir les champs suivants : | `Signed` | ## Lignes de produit Pris en charge dans les modèles de devis. Ce module inclut également le texte par défaut utilisé sur les devis personnalisés. ```hubl theme={null} {% module "module_165350106057652" path="@hubspot/line_items", label="line_items.module" %} ``` | Paramètre | Type | Description | Par défaut | | --------------------------------- | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------- | | `title` | Texte | Le titre de la colonne de la ligne de produit. | Description de la colonne | | | | | | | `use_additional_product_property` | Booléen | Case à cocher pour permettre aux utilisateurs de sélectionner des colonnes de lignes de produit supplémentaires à partir des propriétés du produit. | `False` | | `additional_product_properties` | Choix | Une propriété de produit. Les choix comprennent : | | | `crm_product_property` | Propriété d'objet CRM | Sélectionnez une propriété de produit à afficher en tant qu'en-tête de colonne de ligne de produit. | | ## Texte enrichi Pris en charge dans tous les types de modèles. ```hubl theme={null} {% module "rich_text" path="@hubspot/rich_text" %} ``` | Paramètre | Type | Description | Par défaut | | --------- | ------------- | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `html` | Texte enrichi | Bloc HTML. | ` ## Something Powerful \n ### Tell The Reader More \n The headline and subheader tells us what you're [offering](https://developers.hubspot.fr/docs\"#\"), and the form header closes the deal. Over here you can explain why your offer is so great it's worth filling out a form for. \n Remember: \n` | ## Listing RSS Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "rss_listing" path="@hubspot/rss_listing" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------------ | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- | | `title` | Texte | Un en-tête H3. | `"Test"` | | `rss_feed_type` | Choix | Type de flux RSS. Les choix comprennent : | `blog` | | `rss_url` | Texte | URL RSS à utiliser lorsque `rss_feed_type` est égal à `external`. | | | `content_group_id` | Blog | ID du blog à utiliser si `rss_feed_type` est égal à `blog`. | | | `topic_id` | Balise | (facultatif) ID de la balise à filtrer quand `rss_feed_type` est égal à `blog`. | | | `number_of_items` | Nombre | Le nombre maximal d'articles à afficher. | `5` | | `include_featured_image` | Booléen | Inclure l'image en vignette. | `false` | | `show_author` | Booléen | Affiche le nom de l'auteur. | `true` | | `attribution_text` | Texte | Texte qui attribue un auteur à un article. S'affiche lorsque `show_author` est égal à `true`. | `"by"` | | `show_detail` | Booléen | Affiche le résumé de l'article. | `true` | | `limit_to_chars` | Nombre | Limite la longueur du texte récapitulatif lorsque `show_detail` est égal à `true`. | `200` | | `click_through_text` | Texte | Texte qui s'affiche pour le lien d'un clic publicitaire à la fin d'un résumé d'article lorsque `show_detail` est égal à `true`. | En savoir plus | | | | | | | `show_date` | Booléen | Affiche la date de publication. | `true` | | `publish_date_format` | Choix | Format de la date de publication lorsque `show_date` est égal à `true`. Les choix comprennent : | `short` | | `publish_date_text` | Texte | Texte indiquant le moment où un article a été publié lorsque `show_date` est égal à `true`. | posté le | | | | | | ## Champ de recherche de site Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "search_input" path="./local-search_input" placeholder="Search" include_search_button=true results={ "use_custom_search_results_template": "true", "path_id": "77977569400" } %} ``` | Paramètre | Type | Description | Par défaut | | ----------------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- | | `field_label` | Texte | Texte du libellé du champ de recherche | | | `placeholder` | Texte | Texte d'espace réservé pour le champ de saisie. | Recherche | | `include_search_button` | Booléen | Inclut un bouton de recherche. | `false` | | `content_types` | Objet | Les types de contenu à inclure dans les résultats de recherche. L'objet contient les clés suivantes avec des valeurs booléennes : | `{ "website_pages": true, "landing_pages": false, "blog_posts": true, "knowledge_articles": false }` | | `results` | Objet | Un objet qui active les contrôles pour l'utilisation d'une page de résultats de recherche personnalisée. Comprend les propriétés suivantes :
| | ## Résultats de recherche Pris en charge dans les pages, les articles de blog et les listings de blog. ```hubl theme={null} {% module "search_results" path="@hubspot/search_results" %} ``` | Paramètre | Type | Description | Par défaut | | ------------------------- | ------- | ------------------------------------------------- | ---------- | | `display_featured_images` | Booléen | Affiche les images en vignette pour les éléments. | `false` | ## En-tête de section Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "section_header" path="@hubspot/section_header" %} ``` | Paramètre | Type | Description | Par défaut | | --------------- | ----- | ------------------------------------------------------------------ | ----------------------------- | | `header` | Texte | Contenu du titre de section. | Un en-tête clair et percutant | | `heading_level` | Choix | Niveau d'en-tête pour `header`. Les choix comprennent `h1` à `h6`. | `h1` | | `subheader` | Texte | Paragraphe du texte du sous-titre pour la section. | Un en-tête plus discret | ## Menu simple Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "simple_menu" path="@hubspot/simple_menu" %} ``` | Paramètre | Type | Description | Par défaut | | ------------- | ----------- | --------------------------------------------------------------------------------------------- | ------------ | | `menu_tree` | Menu simple | Objet de menu simple. | `[]` | | `orientation` | Choix | Orientation du menu. Les choix comprennent : | `horizontal` | ## Suivi sur les réseaux sociaux Ajoutez des liens vers vos profils de réseaux sociaux, avec une réorganisation par glisser-déposer dans l'éditeur de contenu. Insère automatiquement des icônes en fonction de l'URL des réseaux sociaux, mais les icônes peuvent être remplacées. Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "social_follow" path="@hubspot/social_follow" %} ``` | Paramètre | Type | Description | Par défaut | | -------------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- | | `link` | Texte | Le lien de destination pour la page de réseaux sociaux ajouté dans l'éditeur. | | | `open_in_new_window` | Booléen | Lorsqu'il est défini sur `false`, le lien s'ouvrira dans le même onglet du navigateur. | `true` | | `is_podcast` | Booléen | Défini sur `true` pour afficher une icône « podcast » au lieu d'une icône par défaut ou personnalisée. | `false` | | `customize_alt_text` | Booléen | Par défaut, un texte alternatif est généré automatiquement. Si défini sur `true`, vous pouvez remplacer le texte alternatif par défaut par une valeur personnalisée à l'aide du champ `aria_label`. | `false` | | `aria-label` | Chaîne | Lorsque `customize_alt_text` est définit sur `true`, ce champ définit le texte alternatif de l'icône (par exemple : `Follow us on Facebook`). Ceci est utilisé par les lecteurs d'écran pour décrire l'icône aux utilisateurs malvoyants. | `False` | | `customize_icon` | Booléen | Par défaut, les icônes sont renseignées automatiquement en fonction de l'URL du lien. Si défini sur `true`, vous pouvez utiliser le champ `custom_icon` pour sélectionner l'une des autres icônes fournies (Font Awesome 6.4.2). | `false` | | `custom_icon` | Icône | Lorsque `customize_icon` est défini sur `true` et `is_podcast` sur `false`, utilisez ce champ pour spécifier une icône personnalisée à partir de l'ensemble fourni. Les icônes disponibles proviennent de Font Awesome 6.4.2. | | ## Partage sur les réseaux sociaux Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "social_sharing" path="@hubspot/social_sharing" %} ``` Remarque : la variable `social_link_url` dans la colonne par défaut ci-dessous a la même valeur que le paramètre `link`. | Paramètre | Type | Description | Par défaut | | ----------- | ----- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | `link` | Texte | Il s'agit du lien de destination qui sera raccourci afin de faciliter les partages sur les réseaux sociaux. | | | `facebook` | Objet | Objet contenant : | `{ "enabled": false, "custom_link_format": "http://www.facebook.com/share.php?u={{ social_link_url }}" }` | | `twitter` | Objet | Objet contenant : | \{ "enabled": false, "custom\_link\_format": "[https://twitter.com/intent/tweet?original\_referer=\\\{\\\{](https://twitter.com/intent/tweet?original_referer=\\\{\\\{) social\_link\_url }}\&url=\{\{ social\_link\_url }}\&source=tweetbutton\&text=\{\{ social\_page\_title\|urlencode }}" } | | `linkedin` | Objet | Objet contenant : | `{ "enabled": false, "custom_link_format": "http://www.linkedin.com/shareArticle?mini=true&url={{ social_link_url }}" }` | | `pinterest` | Objet | Objet contenant : | `{ "enabled": false, "custom_link_format": "http://pinterest.com/pin/create/button/?url={{ social_link_url }}&media={{ pinterest_media }}", "pinterest_media": { "src": "", "alt": null } }` | | `email` | Objet | Objet contenant : | `{ "enabled": false, "custom_link_format": "mailto:?subject=Check out {{ social_link_url }} &body=Check out {{ social_link_url }}" }` | ## Carte mise en onglet Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module path="@hubspot/tabbed_card", tabs=[ { "content" : "

This is the descriptive text contained in tab 1.

", "tab_label" : "Tab 1 label" }, { "content" : "

This is the descriptive text contained in tab 2.

", "tab_label" : "Tab 2 label" } ], fixed_height=false %} ``` | Paramètre | Type | Description | Par défaut | | -------------- | ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- | | `tabs` | Groupe de champs | Un groupe de champs qui contient le libellé de chaque onglet et le contenu textuel de chaque onglet. Contient les champs suivants : | `"Some additional information in one line"` | | `fixed_height` | Booléen | Par défaut, les onglets seront définis à une hauteur fixe afin que la hauteur du conteneur reste la même lorsque vous passez d'un onglet à l'autre. Vous pouvez définir ceci sur `false` si vous souhaitez que la hauteur du conteneur de cartes mis en onglet soit basée sur le contenu de l'onglet actif. | `False` | ## Une ligne de texte Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "text" path="@hubspot/text" %} ``` | Paramètre | Type | Description | Par défaut | | --------- | ----- | ----------------------------------- | ------------------------------------------- | | `value` | Texte | Ajoutez votre texte à ce paramètre. | Informations supplémentaires dans une ligne | | | | | | ## Vidéos Pris en charge dans les pages, les listings de blog et les articles de blog. ```hubl theme={null} {% module "video" path="@hubspot/video" %} ``` | Paramètre | Type | Description | Par défaut | | -------------------- | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | | `video_type` | Choix | Type de vidéo. Les choix comprennent : | `embed` | | `hubspot_video` | Lecteur vidéo | Vidéo hébergée par HubSpot. Utilisé lorsque `video_type` est égal à `hubspot_video`. | | | `embed_field` | Intégrer | Prend en charge les types d'intégration : | | | `oembed_thumbnail` | Image | Remplace l'image miniature oembed lorsque `video_type` est égal à `embed` et `embed_field` est égal à `oembed`. | | | `style_options` | Objet | Objet contenant `oembed_thumbnail_play_button_color` - Champ de couleur. | `{"oembed_thumbnail_play_button_color":"#ffffff"}` | | `placeholder_fields` | Objet | Objet contenant : | `{"placeholder_title":"No video selected", "placeholder_description":"Select a video type in the sidebar."}` | ## Intégrer une vidéo (page de destination) Pris en charge dans les pages. ```hubl theme={null} {% module "video_embed_lp" path="@hubspot/video_embed_lp" %} ``` | Paramètre | Type | Description | Par défaut | | --------------- | ------- | ------------------------------------------------------------------------------------------------------- | ----------------------------------------------- | | `url` | Texte | URL pour la vidéo. Les URL de Vimeo et YouTube sont prises en charge. | `"https://www.youtube.com/watch?v=X1Rr5BFO5rg"` | | `is_full_width` | Booléen | Définit la vidéo en pleine largeur (`true`) ou définit manuellement la largeur et la hauteur (`false`). | `true` | | `max_width` | Nombre | Largeur maximale (px) | `800` | | `max_height` | Nombre | Hauteur maximale (px) | `450` | ## Lien WhatsApp Pris en charge dans les pages, les articles de blog et les pages de listing de blog. Nécessite un [canal WhatsApp connecté](https://knowledge.hubspot.com/fr/inbox/connect-whatsapp-to-the-conversations-inbox). ```hubl theme={null} {% module "whatsapp_link" path="@hubspot/whatsapp_link", label="whatsapp_link" %} ``` | Paramètre | Type | Description | Par défaut | | --------------------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------ | | `whatsapp_number` | URL | Sélectionne l'un des [canaux WhatsApp connectés au compte](https://knowledge.hubspot.com/fr/inbox/connect-whatsapp-to-the-conversations-inbox). | | | `optin_text` | Choix | Le texte d'[inscription et de désinscription](https://knowledge.hubspot.com/fr/inbox/collect-consent-for-whatsapp-conversations#subscribe-a-contact-using-opt-in-keywords-in-a-whatsapp-thread). | | | `whatsapp_display` | Choix | Sélectionne si le bouton affiche du texte, une icône WhatsApp ou les deux. Les choix comprennent : | `text_and_icon` | | `icon_position` | Choix | La position de l'icône sur le bouton. Les choix comprennent `left` et `right`. | `left` | | `button_text` | Chaîne | Le texte du bouton. | `Chat on WhatsApp` | | `whatsapp_icon_title` | Chaîne | Le texte de l'icône pour les lecteurs d'écran. | `WhatsApp Icon` |