Champs de module et de thème

Last updated:

Ajoutez des champs aux modules et aux thèmes pour permettre aux créateurs de contenu de contrôler divers aspects d'une page dans l'éditeur de page. Découvrez ci-dessous tous les champs disponibles pour les modules et les thèmes ainsi que leurs propriétés disponibles.

Pour plus d'informations sur l'application des champs de module et de thème, y compris les groupes de champs et les champs répétés, consultez la vue d'ensemble des champs de module et de thème.

Propriétés utilisées par tous les champs

Tous les champs partagent un ensemble de propriétés communes. Il s'agit de champs généraux, tels que le nom du champ ou le texte d'aide qui s'affiche pour les créateurs de contenu utilisant le champ du module ou du thème. 

// Boolean field { "name" : "is_teaser_img", "label" : "Enable Teaser Image", "required" : false, "locked" : false, "type" : "boolean", "inline_help_text" : "Shows Teaser image when toggled on", "help_text" : "Teaser images are used to help provide visual context to the post.", "default" : false }
Propriétés utilisées par tous les champs
ParameterTypeDescription Default
name
Chaîne

Le nom du champ, auquel vous ferez référence lors de l'incorporation du champ et de ses valeurs dans le module ou le thème. Elle ne peut pas contenir d'espaces ou de caractères spéciaux.

richtext_field, date_field, etc.
label
Chaîne

Le texte que le créateur de contenu voit en décrivant le champ. Peut contenir des espaces.

Rich text field, Date field, etc.
required
Booléen

Définit si le champ peut être laissé vide dans l'éditeur. Si le champ est défini sur true, le contenu ne peut pas être publié sans valeur dans le champ.

false
locked
Booléen

Définit si le champ est modifiable dans l'éditeur de contenu. Si le champ est défini sur true, le champ n'apparaîtra pas dans l'éditeur de contenu.

false
type
Chaîne

Le type de champ. Les types de champs sont uniques par champ et se trouvent dans la documentation pour chaque champ ci-dessous.

inline_help_text
Chaîne

Texte qui s'affiche en ligne sous le libellé du champ (limite de 400 caractères). À utiliser de préférence pour les informations nécessaires à l'utilisation du champ.

Vous pouvez inclure les balises HTML suivantes (les autres balises seront ignorées lors de la restitution) :

a, b, br, em, i, p, small, strong, span.

help_text
Chaîne

Texte qui s'affiche dans l'éditeur dans une info-bulle au survol pour aider le créateur de contenu (limite de 300 caractères). À utiliser de préférence pour les informations complémentaires, mais non nécessaires à l'utilisation du champ.

Vous pouvez inclure les balises HTML suivantes (les autres balises seront ignorées lors de la restitution) :

a, b, br, em, i, p, small, strong, span.

id
Chaîne

L'ID unique du champ, qui est défini par HubSpot. Lorsque vous développez localement, vous n'avez pas besoin de spécifier cet identifiant.

visibility
Tableau

Définit les conditions d'affichage du champ. Par exemple, vous pouvez définir un champ pour qu'il s'affiche uniquement lorsqu'un autre champ de case à cocher a été sélectionné. Découvrez-en davantage sur lavisibilité.

display_width
Chaîne

Par défaut, les champs sont en pleine largeur dans l'éditeur. Lorsque deux champs consécutifs dans le fichier fields.json sont définis sur half_width, ils apparaîtront l'un à côté de l'autre dans l'éditeur.

Alignement

Permet aux créateurs de contenu de positionner un élément dans un conteneur. Pour activer l'alignement du texte, utilisez le champ d'alignement du texte

Les champs d'alignement sont pris en charge dans les modules et peuvent être uniquement utilisés comme champs de style.

Champ d'alignement
// alignment field { "name": "img_position", "label": "Position Image", "help_text":"Position the image within it's container.", "required": false, "type": "alignment", "default": { "horizontal_align": "CENTER", "vertical_align": "TOP", } }
Champ de blog
ParamètreTypeDescription Default
default
Objet

Objet contenant horizontal_align et vertical_align.

alignment_direction
Chaîne

Détermine si seuls les contrôles d'alignement horizontal, vertical ou les deux doivent être affichés. Peut-être :

  • HORIZONTAL
  • VERTICAL
  • LES DEUX
BOTH

Image d'arrière-plan

Ce champ fournit une image d'arrière-plan qui comporte des sous-champs pour la position et la taille de l'arrière-plan. Les champs d'image d'arrière-plan ont une propriété .css qui renvoie une CSS basée sur la valeur du champ. Découvrez-en davantage sur la propriété CSS générée.

Les champs d'image d'arrière-plan sont pris en charge dans les modules et peuvent être uniquement utilisés comme champs de style.

Champ d'image d'arrière-plan
// background image field { "name": "bg_image", "label": "Background image", "required": false, "type": "backgroundimage", "default": { "src": "https://example.com/img.png", "background_position": "MIDDLE_CENTER", "background_size": "cover" } }
Champ de blog
ParamètreTypeDescription Default
default
Objet

Objet contenant le src de l'image, la position et la taille de l'arrière-plan.

null

Blog

Ce champ permet aux éditeurs de contenu de sélectionner un blog et de vous fournir, à vous, le développeur, l'identifiant du blog. Cette fonction est utile dans des situations telles que l'extraction d'informations importantes pour les blogs présentés dans les modules. Vous pouvez utiliser l'identifiant du blog dans les fonctions HubL de blog pour obtenir des informations telles que les auteurs du blog, les articles de blog récents, les articles de blog récents avec une mention spécifique, etc.

Les champs de blog sont pris en charge dans les modules.

Capture d'écran du champ de blog
// blog field { "name" : "blog", "label" : "Blog", "required" : false, "locked" : false, "type" : "blog", "default" : 1234567890 }
Champ de blog
ParamètreTypeDescription Default
default
"default" / blog id

Indique quel blog est sélectionné par défaut. Ce paramètre accepte les arguments suivants : 'default' ou un ID de blog (disponible dans l'URL du tableau de bord du blog).

null

Booléen

Ce champ permet aux éditeurs de contenu d'activer/désactiver une fonctionnalité. Les booléens ne peuvent être que true ou false. Il est souvent utile de rendre les groupes ou les champs conditionnels sur la base de champs booléens. Si vous pensez avoir besoin de fournir plus de deux états à l'avenir, un champ Choix peut être une meilleure option, car il est plus facilement évolutif en cas de changement de besoins ultérieur.

Les champs booléens sont pris en charge à la fois dans les thèmes et les modules.
Les champs booléens peuvent être utilisés comme champs de style.

Capture d'écran du champ booléen
// Boolean field { "name" : "is_teaser_img", "label" : "Enable Teaser Image", "required" : false, "locked" : false, "type" : "boolean", "display":"checkbox", "inline_help_text" : "Shows Teaser image when toggled on", "help_text" : "Teaser images are used to help provide visual context to the post.", "default" : false }
Champ de blog
ParamètreTypeDescription Default
default
Booléen

Indique si l'état par défaut de ce champ est true ou false.

false
display
Chaîne

Choisissez le style d'affichage visuel pour le champ. Peut apparaître comme toggle ou checkbox.

checkbox

Une bascule peut faire sens lorsque la valeur du champ active/désactive l'affichage conditionnel d'autres champs. Un autre cas où une bascule peut être utile est celui où le champ représente un changement majeur dans la conception du module.

Les cases à cocher sont utiles pour les petites modifications qui n'ont pas un effet aussi radical sur l'affichage du module, par exemple pour masquer ou afficher de petits éléments individuels.

Bordure

Ce champ fournit aux créateurs de contenu une interface utilisateur permettant de créer une bordure autour d'un élément. Les champs de bordure ont une propriété .css qui renvoie une CSS basée sur la valeur du champ. Découvrez-en davantage sur la propriété CSS générée.

Les champs de bordure sont pris en charge dans les modules.
Les champs de bordure ne peuvent être utilisés que comme champs de style.

Capture d'écran du champ du module de bordure dans l'éditeur de page
// Border field { "id" : "styles.border", "name" : "border", "label" : "border", "required" : false, "locked" : false, "allow_custom_border_sides" : false, "type" : "border", "default" : { "top": { "width": { "value": 1, "units": "px" }, "opacity": 100, "style": "solid", "color": "#ffffff" }, "bottom": { "width": { "value": 1, "units": "px" }, "opacity": 100, "style": "solid", "color": "#ffffff" }, "left": null, "right": null } }
Champ de blog
ParamètreTypeDescription Default
default
Booléen

objet avec des clés pour le rayon de bordure, les côtés supérieur, inférieur, gauche et droit.

{}

Choix

Les champs de choix permettent au créateur de contenu de sélectionner un ou plusieurs éléments dans une liste d'options. À l'aide de la propriété display, vous pouvez définir les options d'affichage dans un menu déroulant, une case d'option ou des cases à cocher, ou une gamme de boutons. Découvrez-en davantage sur les options d'affichage des champs de choix ci-dessous.

Les champs de choix sont pris en charge à la fois dans les thèmes et les modules. Les champs de choix peuvent être utilisés comme champs de style.

choice-field-dropdown
// Choice field { "name" : "img_position", "label" : "Image Position", "required" : false, "locked" : false, "multiple":"true", "display" : "select", "choices" : [ [ "img--left", "Image Left - Text Right" ], [ "img--right", "Text Left - Image Right" ] ], "type" : "choice", "default" : "img--left" }
Champ booléen
ParamètreTypeDescription Default
choices
Tableau

Tableau contenant les options sélectionnables, formatées en tant que valeurs internes uniques suivies d'un libellé.

[ [ "value 1", "Label 1" ], [ "value 2", "Label 2" ] ]
default
Valeur

Définit la valeur sélectionnée par défaut dans le tableau de choix.

multiple
Booléen

Champ facultatif qui permet de sélectionner plusieurs options lorsqu'il est défini sur true.

Définissez display sur checkbox ou select pour configurer si le champ s'affiche sous la forme d'une liste de cases à cocher ou d'un menu déroulant.

false
display
Chaîne

Définissez l'apparence du champ à l'aide de l'une des valeurs suivantes :

  • select : affiche un menu déroulant. Permet de sélectionner plusieurs options lorsque multiple est défini sur true
  • checkbox : affiche une liste de cases à cocher sélectionnables. Permet de sélectionner plusieurs options lorsque multiple est défini sur true et que reordering_enabled est défini sur false.
  • radio : affiche une liste de cases d'option. Ne permet pas de sélectionner plusieurs options.
  • buttons : affiche un ensemble de boutons en fonction de l'élément preset spécifié. Ne permet pas de sélectionner plusieurs options.
"select"
reordering_enabled
Booléen
Lorsque ce paramètre est défini sur true, il permet aux créateurs de contenu de réorganiser les options du champ dans l'éditeur. Pour activer cette option, multiple doit également être défini sur true.
false
preset
Chaîne

Configure le préréglage du bouton à utiliser lorsque display est défini sur buttons. Pour chaque préréglage, vous devrez configurer les libellés choices pour qu'ils correspondent à un ensemble de valeurs spécifique. Découvrez-en davantage sur ces options prédéfinies ci-dessous.

Préréglages des boutons de choix

Pour configurer un champ de choix pour afficher des boutons au lieu d'un menu déroulant, de cases à cocher ou de cases d'option, vous pouvez utiliser l'un des préréglages ci-dessous. Chaque préréglage permet un ensemble spécifique de libellés d'option, que vous devrez inclure dans le tableau choices. Ces libellés ne peuvent pas être personnalisés.

// Layout choice button { "name" : "layout", "type" : "choice", "label" : "Layout", "required" : false, "locked" : false, "display" : "buttons", "preset" : "layout", "choices" : [ [ "cards_value", "cards" ], [ "tiles_value", "tiles" ], ["minimal_value", "minimal"] ] }
Préréglage Libellés de choix Exemple
expand_icon caret | plus choice-button-presets_1

 

layout cards | tiles | minimal choice-button-presets_6

 

icon_size small | medium | large choice-button-presets_5

 

social_icon_size small | medium | large choice-button-presets_4

 

icon_background_shape none | square | rounded | circle choice-button-presets_3

 

social_icon_background_shape none | square | rounded | circle choice-button-presets_2

 

Couleur

Les champs de couleur fournissent une interface de sélection de couleur pour les créateurs de contenu. Ils prennent en charge les couleurs unies ainsi que la transparence. Ils constituent un choix parfait lorsque vous souhaitez donner aux créateurs de contenu le contrôle total des couleurs au sein d'un module.

Par défaut, l'entrée d'opacité d'un champ de couleur est masquée pour les modules d'e-mail, car certains clients de messagerie ne respectent pas les règles d'opacité. Vous pouvez afficher le champ d'opacité pour les modules d'e-mail en définissant show_opacity sur true.

Les champs de couleur sont pris en charge à la fois dans les thèmes et les modules. Les champs de couleur peuvent être utilisés comme champs de style.

Champ de couleur
// color field { "name" : "bg_color", "label" : "Background color", "required" : false, "locked" : false, "type" : "color", "default" : { "color" : "#ff0000", "opacity" : 100 } }
Champ de couleur
ParamètreTypeDescription Default
default
Objet

Définit la couleur et l'opacité sélectionnées par défaut.

{ "color" : "#ffffff", "opacity" : 100 }
show_opacity
Booléen

Indique si l'entrée d'opacité est affichée.

  • true : l'entrée d'opacité est affichée.
  • false : l'entrée d'opacité est masquée.
  • Si elle n'est pas définie, l'entrée d'opacité ne s'affichera pas dans les modules d'e-mail, mais s'affichera dans d'autres types de modules.
undefined

CTA

Les champs call-to-action (CTA) permettent aux utilisateurs de choisir un CTA à afficher. Les CTA sont essentiellement des boutons ou des liens qui peuvent être suivis. Les créateurs de contenu créent des CTA qui peuvent être utilisés sur l'ensemble d'un site. 

Les champs CTA sont pris en charge dans les modules.
Les champs CTA sont disponibles dans CMS Hub Pro et Entreprise.

Champ call-to-action
// CTA field { "name" : "cta", "label" : "CTA", "required" : false, "locked" : false, "type" : "cta", "default" : null }
Champ CTA
ParamètreTypeDescription Default
default
Chaîne

Le CTA sélectionné par défaut. Attend un ID de CTA qui peut être trouvé dans l'URL lors de l'édition d'un CTA dans le Gestionnaire de CTA.

null

Objet du CRM

Les champs d'objets CRM permettent aux utilisateurs de sélectionner une instance individuelle d'un objet CRM à afficher. 

module.fieldname.properties renvoie les propriétés récupérées de cette instance d'objet. Ainsi, vous n'avez pas besoin d'utiliser la fonction crm_object() pour obtenir les données de l'instance d'objet sélectionnée.

module.fieldname.id renvoie l'identifiant de l'instance d'objet.

Les champs d'objets CRM sont pris en charge dans les modules.
Les champs d'objets CRM sont disponibles dans CMS Hub Pro et Entreprise.

Champ d'objet CRM
// fields.json { "name" : "crmobject_field", "label" : "CRM object", "required" : false, "locked" : false, "object_type" : "CONTACT", "properties_to_fetch" : [ ], "type" : "crmobject", "default" : { "id" : 1 } }
Champ d'objet CRM
ParamètreTypeDescription Default
object_type
Obligatoire
Chaîne

Type d'objet CRM que l'utilisateur peut choisir. Types d'objets CRM pris en charge

properties_to_fetch
Tableau

Tableau de noms de propriétés associées au type d'objet sous forme de chaîne. Ex "date_of_birth" est une propriété associée à un contact. Utilisez cette option pour limiter les informations disponibles sur la page à ce dont vous avez besoin.

default
Objet

Objet avec l'ID de l'instance de l'objet sélectionné par défaut. ID du contact, ID de la société, etc.

null

Propriété d'objet du CRM

Utilisez le champ Propriété d'objet du CRM pour accéder aux métadonnées de propriété, telles que le libellé et le nom de propriété, à partir d'un type d'objet spécifié. Cela permet aux créateurs de contenu de sélectionner parmi les propriétés de l'objet lorsqu'ils ont besoin d'afficher les détails des propriétés sur une page.

Par exemple, vous pouvez ajouter ce champ à un module de tableau personnalisé pour remplir les en-têtes de tableau en fonction des propriétés sélectionnées.

Les champs d'objets CRM sont pris en charge dans les modules. 

crm-object-property-dropdown-menu0
// fields.json { "name" : "crmobjectproperty_field", "label" : "CRM object property", "required" : true, "locked" : false, "object_type" : "contact", "type" : "crmobjectproperty", "default" : { "property" : "field_of_study" } }
Champ d'objet CRM
ParamètreTypeDescription Default
object_type
Obligatoire
Chaîne

Type d'objet CRM que l'utilisateur peut choisir. Découvrez-en davantage sur les types d'objet CRM pris en charge.

default
Objet

Contient la propriété par défaut à afficher.

Par ailleurs, vous pouvez utiliser les blocs de texte suivants pour renvoyer d'autres détails sur la propriété :
  • {{ module.fieldname.property }} : renvoie le nom interne de la propriété.
  • {{ module.fieldname.property_definition.label }} : renvoie le libellé de la propriété.
  • {{ module.fieldname.property_definition.type }} : renvoie le type de propriété (par exemple, chaîne).

Date

Les champs de date offrent une interface de sélection de dates qui permet aux créateurs de contenu de sélectionner facilement une date. Renvoie un horodatage que vous pouvez utiliser dans votre code.

Les champs de date sont pris en charge dans les modules.

Champ de date avec sélecteur de calendrier ouvert
// Date field { "name" : "event_start_date", "label" : "Event Date", "required" : false, "locked" : false, "type" : "date", "default" : 1577854800000 }
Champ de date
ParamètreTypeDescription Default
default
Horodatage

L'horodatage Unix Epoch pour la date et l'heure que vous souhaitez utiliser par défaut. Laissez ce champ vide pour permettre au sélecteur de date et d'heure de lancer le créateur de contenu à la date et à l'heure actuelle du sélecteur.

null

Date et heure

Les champs de date et d'heure offrent une interface de sélection de dates comme le champ de date, ainsi qu'un sélecteur d'heure pour permettre aux créateurs de contenu de sélectionner facilement une date et une heure de la journée. Renvoie un horodatage que vous pouvez utiliser dans votre code.

Les champs de date et d'heure sont pris en charge dans les modules.

Début de l'événement
// Date and time field { "name" : "event_start", "label" : "Event Start", "required" : false, "locked" : false, "type" : "datetime", "default" : 1577854800000 }
Champ de date et d'heure
ParamètreTypeDescription Default
default
Horodatage

L'horodatage Unix Epoch pour la date et l'heure que vous souhaitez utiliser par défaut. Laissez ce champ vide pour permettre au sélecteur de date et d'heure de lancer le créateur de contenu à la date et à l'heure actuelle du sélecteur.

null

Adresse e-mail

Les champs d'adresse e-mail permettent à un utilisateur de sélectionner plusieurs adresses e-mail. Cela pourrait être utilisé pour afficher les informations de contact. Le champ e-mail renvoie un tableau d'adresses e-mail sélectionnées que vous pouvez faire défiler.

Les champs d'e-mails sont pris en charge dans les modules.

email-field
// Email address field { "name" : "emails", "label" : "Email address", "required" : false, "locked" : false, "type" : "email", "default" : null }
Champ d'adresse e-mail
ParamètreTypeDescription Default
default
Tableau

Tableau de chaînes d'adresses e-mail ["bob@example.com", "dennis@example.com"]

null

Intégrer

Les champs Intégrer permettent à l'utilisateur d'ajouter une URL d'un site compatible oEmbed ou de coller un code d'intégration d'un autre site. Pour en savoir plus sur l'utilisation de oEmbed sur HubSpot, et voir des cas d'utilisation, consultez notre document oEmbed.

Champ d'intégration
// embed field { "name" : "embed_field", "label" : "Embed", "required" : false, "locked" : false, "supported_source_types" : [ "oembed", "html" ], "supported_oembed_types" : [ "photo", "video", "link", "rich" ], "type" : "embed", "default" : { "source_type" : "oembed" } }
Use this table to describe parameters / fields
ParameterTypeDescription Default
supported_source_types
Tableau

Les types de sources pris en charge pour les URL oEmbed(oembed), le code HTML intégré (html) ou Media Bridge(media_bridge).

["oembed", "html"]
supported_oembed_types
Tableau

Types d'images oEmbed pris en charge :"photo", "video", "link" et "rich". Ne s'applique pas aux supported_source_types de html

[ "photo", "video", "link", "rich" ]
supported_media_bridge_providers
Tableau

Tableau d'identifiants de fournisseurs qui déterminent quels fournisseurs Media Bridge sont disponibles pour sélectionner du contenu.

Remarque : Ce paramètre sera également rempli lors de l'installation d'une application de passerelle multimédia

type
Chaîne

Ce paramètre est toujours configuré sur "embed"

"embed"
default
Dict

Un tableau contenant le paramètre "source_type". Ce paramètre a une valeur basée sur une chaîne parmi les options fournies dans le paramètre "supported_source_types".

oembed

Fichier

Les champs de fichiers permettent à l'utilisateur de charger un fichier dans le gestionnaire de fichiers ou le gestionnaire de documents, et facilitent l'ajout d'éléments qui se trouvent à ces emplacements. Cela peut être utile pour créer des liens vers des fichiers PDF ou des fichiers d'autres formats. Pour afficher des images sur une page, vous devez utiliser le champ image.

Les champs de fichiers sont pris en charge dans les modules.

Champ de fichier
// Email address field { "name" : "file_field", "label" : "File", "required" : false, "locked" : false, "type" : "file", "picker" : "file", "default" : null }
Champ de fichier
ParamètreTypeDescription Default
default
Chaîne

URL de fichier.

null
picker
Chaîne

Valeurs acceptables : "file", "document", "image".
Le sélecteur affiche les ressources chargées soit dans le gestionnaire de fichiers, soit dans le gestionnaire de documents, en fonction de ce paramètre.

file

E-mail de suivi

Les champs d'e-mail de suivi permettent au créateur de contenu de désigner l'e-mail qui sera envoyé en réponse à la soumission de formulaire. Cela fonctionne en tandem avec la balise de formulaire HubL, via le paramètre simple_email_campaign_id.

Les champs d'e-mail de suivi sont pris en charge dans les modules.

champ d'e-mail de suivi
// Followup email field { "name" : "followup_email", "label" : "Followup email", "required" : false, "locked" : false, "type" : "followupemail", "default" : null }
Champ d'adresse e-mail
ParamètreTypeDescription Default
default
Chaîne

ID d'e-mail

null

Police

Les champs de police offrent aux créateurs de contenu des commandes de base pour le style de police. Les créateurs de contenu peuvent choisir la taille, la couleur, la famille de polices et le format (gras, italique et souligné). Les polices répertoriées sont toutes des polices standards sûres pour le web. Ces polices proviennent de Google Fonts mais sont mises à disposition par HubSpot directement sur le domaine sur lequel la page se charge.

Les champs de police sont pris en charge à la fois dans les thèmes et les modules. Les champs de police peuvent être utilisés comme champs de style.

Champ de police

Remarque :

  • La famille de police est déterminée par la combinaison des propriétés font et font_set. Vous devez inclure les deux pour charger la police. Lorsque vous héritez de champs, cela signifie que vous devez hériter des deux valeurs.
  • Masquer les sous-champs liés à la CSS avec visibility n'empêchera pas la sortie de la CSS dans le style renvoyé dans l'objet de champ. Vous devrez toujours inclure manuellement la CSS dans l'objet styles.
// Font field { "name" : "font", "label" : "Font", "required" : false, "locked" : false, "load_external_fonts" : true, "type" : "font", "default" : { "size" : 12, "font":"Merriweather", "font_set":"GOOGLE", "size_unit" : "px", "color" : "#000", "styles" : { } }, "visibility" : { "hidden_subfields" : { "font": true, "size": true } } }
Champ de police
ParamètreTypeDescription Default
default
Objet

Objet police avec des paramètres pour la taille, l'unité de taille, la couleur et les styles pour le gras, l'italique et le soulignement.

{ "size" : 12, "size_unit" : "px", "color" : "#000", "styles" : { } }
load_external_fonts
Booléen

HubSpot charge automatiquement la police web sélectionnée sur la page si la police est sélectionnée et référencée par HubL dans une feuille de style ou dans un module. Mettez cette valeur sur faux, si vous chargez déjà la police sur la page. Ainsi, la police ne sera pas chargée deux fois.

true
visibility
Objet

À l'aide de l'objet imbriqué hidden_subfields, vous pouvez définir un booléen pour les commandes du champ Police à masquer. Les sous-champs comprennent : font, size, bold, italic, underline, et color.

variant
Chaîne

Si vous utilisez une police web, la variante de la police que vous souhaitez utiliser. Par exemple, pour utiliser la version 700 d'une police, définissez cette valeur sur "700". Pour utiliser la version italique à 400 caractères d'une police, définissez ce paramètre sur "400i".

Formulaire

Les champs de formulaire permettent à un créateur de contenu de concevoir un formulaire dans son compte. Vous pouvez ensuite l'utiliser pour rendre un formulaire sur une page en utilisant la balise de formulaire HubL

Les champs de formulaire sont pris en charge dans les modules.

formulaire field-Aug-21-2020-08-09-55-35-PM
// Form field { "id" : "idNumber", "name" : "form_field_name", "display_width" : null, "label" : "Form", "required" : false, "locked" : false, "type" : "form", "disable_inline_form_editing": true, "required_property_types": ["TICKET"], "default" : { "response_type" : "inline", "message" : "Thanks for submitting the form." } }
Champ d'adresse e-mail
ParamètreTypeDescription
default
Objet

Objet contenant les détails de la réponse de soumission du formulaire. Comprend les paramètres suivants :

  • response_type, qui peut être l'un des éléments suivants :
    • inline : un message textuel en ligne. 
    • redirection : redirige le visiteur après la soumission.
  • message : le texte à afficher après la soumission du formulaire.
  • redirect_id : pour les formulaires redirigés, définissez un ID du contenu HubSpot pour rediriger les contributeurs vers une page HubSpot.
  • redirect_url : pour les formulaires redirigés, définissez une URL spécifique pour rediriger les contributeurs vers une page.
disable_inline_form_editing
Chaîne

Définissez la propriété disable_inline_form_editing sur true pour masquer tous les contrôles de modification de formulaire en ligne dans le module de formulaire. Cela inclut les champs du formulaire, le texte du bouton d'envoi, les options de confidentialité et de consentement des données et le CAPTCHA.

required_property_types
Tableau

Tableau qui spécifie les formulaires pouvant être sélectionnés en fonction des types de propriétés des champs de formulaire. Les valeurs comprennent : « CONTACT », « ENTREPRISE » et « TICKET »).

Dégradé

Ce champ permet aux créateurs de contenu de créer et de configurer des dégradés. Pour l'instant, les dégradés linéaires prennent en charge jusqu'à 5 arrêts de couleur. Les champs de dégradé ont une propriété .css qui renvoie la CSS basée sur la valeur du champ. Découvrez-en davantage sur la propriété CSS générée.

Les champs de dégradé sont pris en charge dans les modules. Les champs de dégradé ne peuvent être utilisés que comme champs de style.

Champ de dégradé
// Gradient field { "name": "bg_gradient", "label": "Background gradient", "help_text": "Sets a gradient behind the content", "required": false, "type": "gradient", "default": { "colors": [{ "color": { "r": 0, "g": 0, "b": 0, "a": 1 } }, { "color": { "r": 255, "g": 255, "b": 255, "a": 1 } }], "side_or_corner": { "verticalSide": "BOTTOM", "horizontalSide": null } } }
Champ d'adresse e-mail
ParamètreTypeDescription Default
default
Objet

Objet contenant les paramètres directionnels d'un dégradé ("side_or_corner") et les arrêts de couleur pour le dégradé sous forme de tableau d'objets.

Ligne HubDB

Les champs de ligne HubDB permettent à un créateur de contenu de sélectionner une ligne individuelle (ou des lignes si vous utilisez des champs répétiteurs) dans une table définie. Vous pouvez ensuite utiliser ce champ pour créer des listes, des tableaux, des ressources, etc. définis par l'utilisateur.

Les champs de ligne HubDB sont pris en charge dans les modules.
Les champs de ligne HubDB sont disponibles dans CMS Hub Pro et Entreprise.

hubdb-row-field
// HubDB Row field { "name" : "hubdbrow_field", "label" : "HubDB row", "required" : false, "locked" : false, "table_name_or_id" : "3096859", "columns_to_fetch" : [ "name", "price", "desc" ], "display_columns" : [ "name", "price", "desc" ], "display_format" : "%0 - %1 :::: %2", "type" : "hubdbrow", "default" : { "id" : 4450468943 } }
Use this table to describe parameters / fields
ParameterTypeDescription Default
table_name_or_id
Chaîne

Le nom ou l'ID de la table HubDB. Ce champ est obligatoire.

columns_to_fetch
Tableau

Un tableau de noms de colonnes à extraire de la table. Renverra toutes les colonnes du tableau si vide.

[]
display_columns
Tableau

Un tableau de noms de colonnes à utiliser dans le libellé de choix. Ne renverra que la première colonne du tableau si vide.

[]
display_format
Chaîne

Le format dans lequel vous voulez que les données de colonnes s'affichent dans le sélecteur de lignes de HubDB en utilisant le symbole pour cent suivi d'un nombre pour désigner la colonne.
Ex : %0 (%1) apparaîtrait comme Column0Value (Column1Value)

""
default
Objet

Objet contenant "id" pour définir la ligne hubdb par défaut.

{ “id” : null }

Tableau HubDB

Les champs de tableau HubDB permettent à un créateur de contenu de désigner un HubDB dans son compte. Vous pouvez ensuite l'utiliser pour rendre un formulaire sur une page en utilisant la balise de formulaire HubL. Renvoie l'identifiant du tableau, que vous pouvez utiliser avec les fonctions HubL de HubDB.

Les champs de tableau HubDB sont pris en charge dans les modules. Les champs de tableau HubDB sont disponibles dans CMS Hub Pro et Entreprise.

Champ HubDB
// HubDB Table field { "name" : "recipe_table", "label" : "Recipe Table", "required" : false, "locked" : false, "type" : "hubdbtable", "default" : 2010782 }
Champ d'adresse e-mail
ParamètreTypeDescription Default
default
Chaîne

ID de tableau HubDB

null

Icône

Les champs d'icônes offrent une interface utilisateur avec sélecteur d'icônes qui permet aux créateurs de contenu d'ajouter plus facilement des icônes à vos modules. Le champ d'icône est préchargé avec les icônes FontAwesome.

Les champs d'icônes sont pris en charge dans les modules. Les champs d'icônes peuvent être utilisés comme champs de style.

champ d'icône
// Icon field { "name" : "icon_field", "label" : "Icon", "required" : false, "locked" : false, "icon_set" : "fontawesome-6.4.2", "type" : "icon", "default" : { "name" : "accessible-icon", "unicode" : "f368", "type" : "REGULAR" } }
Champ d'icône
ParamètreTypeDescription Default
default
Objet

Objet icône

icon_set
Chaîne

Le jeu d'icônes FontAwesome à utiliser. Les valeurs possibles sont :

  • fontawesome-6.4.2
  • fontawesome-5.14.0
  • fontawesome-5.0.10
fontawesome-5.0.10

Image 

Les champs d'image offrent aux créateurs de contenu une interface intuitive pour ajouter des images à un module ou à un thème. Les champs d'image fournissent une interface avec sélecteur de fichiers qui liste les images du gestionnaire de fichiers. Comme les images peuvent être utilisées et affichées de différentes manières, les développeurs peuvent limiter les options de taille disponibles pour le créateur de contenu dans l'interface utilisateur et permettre le chargement différé des images.

Champ d'image

Les champs d'image sont pris en charge dans les modules.
Les images peuvent être utilisées comme champs de style 
Vous ne devez utiliser les champs d'image comme champs de style que si l'image a un caractère purement informatif, qu'elle n'est pas porteuse de sens et qu'elle n'est pas une image de fond. Il s'agit de respecter les meilleures pratiques en matière d'accessibilité.

// Image field { "name" : "image_field", "label" : "Image", "required" : false, "locked" : false, "responsive" : true, "resizable" : true, "show_loading" : false, "type" : "image", "default" : { "size_type" : "exact", "src" : "", "alt" : "image-alt-text", "loading" : "lazy", "width" : 128, "height" : 128, "max_width" : 128, "max_height" : 128 } }
Champ de lien
ParamètreTypeDescription Default
default
Objet

Définit les propriétés pour la taille de l'image, le texte alternatif, etc. Peut contenir les propriétés suivantes : 

  • size_type : si l'image est automatiquement ou manuellement dimensionnée :
    • "auto : HubSpot ajustera automatiquement la taille de l'image en fonction de ses dimensions originales.
    • "auto_custom_max" : HubSpot ajustera automatiquement la taille de l'image en fonction des dimensions maximales définies à l'aide des propriétés "max_height" et "max_width".
    • "exact" : HubSpot dimensionnera l'image en fonction des dimensions définies à l'aide des propriétés "height" et "width".
  • src : l'URL de l'image par défaut. Doit être un chemin absolu vers une image.
  • alt : le texte alternatif par défaut de l'image.
  • loading : les options de chargement différé de l'image. Peut-être défini comme "disabled" (par défaut), "eager", ou "lazy".
{ "size_type" : "auto", "src" : "", "alt" : null, "loading": "disabled" }
responsive
Booléen

détermine si l'image doit agir de manière réactive ou avoir une hauteur et une largeur fixes.

true
show_loading
Booléen

Détermine si les commandes permettant de choisir le chargement différé de l'image sont affichées dans l'éditeur de page.

false

Lien

Les champs de liens offrent aux créateurs de contenu une interface intuitive pour fournir des liens vers des URL et des adresses e-mail. Pour les liens externes, les créateurs de contenu choisissent "external". Pour les liens d'e-mail, "email address". Enfin, pour le contenu hébergé sur le CMS HubSpot, ils peuvent utiliser "content", qui affiche une liste de toutes les pages et de tous les articles de blog du compte, "file", pour afficher les ressources du fichier, et "blog", pour afficher toutes les listes de blogs du compte. Les champs de liens sont très similaires aux champs d'URL, sauf qu'ils offrent une interface utilisateur pour « ouvrir dans une nouvelle fenêtre » et « indiquer aux moteurs de recherche de ne pas suivre ». Si vous ne voulez pas que les créateurs de contenu aient ce contrôle, utilisez le champ URL.

Les champs de lien sont pris en charge dans les modules.

champ de lien
// Link field { "name" : "link_field", "display_width" : null, "label" : "Link", "required" : false, "locked" : false, "supported_types" : [ "EXTERNAL", "CONTENT", "FILE", "EMAIL_ADDRESS", "BLOG", "CALL_TO_ACTION", "PHONE_NUMBER", "WHATSAPP_NUMBER", "PAYMENT" ], "show_advanced_rel_options" : true, "type" : "link", "default" : { "url" : { "content_id" : null, "type" : "EXTERNAL", "href" : "" }, "open_in_new_tab" : false, "no_follow" : false } }
Champ de lien
ParamètreTypeDescription Default
default
Objet

L'URL par défaut et le comportement d'ouverture du lien. Cet objet comprend :

  • Un objet url qui contient :
    • content_id : s'il s'agit d'un lien vers du contenu HubSpot, l'ID de ce contenu. Définir sur null s'il s'agit de contenu externe.
    • type : le type d'URL. Découvrez-en davantage sur les types compatibles ci-dessous.
    • href : l'URL du contenu. Lors de l'association au contenu HubSpot, définissez ce champ sur null et utilisez content_id à la place.
{ "url" : { "content_id" : null, "type" : "EXTERNAL", "href" : "" }, "open_in_new_tab" : false, "no_follow" : false, "sponsored" : false, "user_generated_content" : false }
supported_types
Tableau

Les types de lien que les créateurs de contenu peuvent sélectionner. Supprimez de la liste les types que vous ne voulez pas que les créateurs de contenu puissent définir. Types possibles :

  • EXTERNAL
  • CONTENT
  • FILE
  • EMAIL_ADDRESS
  • BLOG
  • CALL_TO_ACTION
  • PHONE_NUMBER
  • WHATSAPP_NUMBER
  • PAYMENT
[ "EXTERNAL", "CONTENT", "FILE", "EMAIL_ADDRESS", "BLOG", "CALL_TO_ACTION", "PHONE_NUMBER", "WHATSAPP_NUMBER", "PAYMENT" ]
show_advanced_rel_options
Booléen

Par défaut, les créateurs de contenu pourront uniquement sélectionner l'option no_follow.

Lorsque ce champ est défini sur true, les créateurs de contenu peuvent également sélectionner :

  • sponsored : un lien sponsorisé, tel qu'un lien publicitaire payant. 
  • user_generated_content : contenu généré par les utilisateurs, tel que les forums.

Découvrez-en davantage sur les attributs de lien.

false

Les champs de logo permettent aux créateurs de contenu de spécifier les images de logo à utiliser dans une page, le logo du domaine étant utilisé par défaut. Ceci est utile pour les en-têtes et pieds de page du site qui peuvent contenir le logo de l'entreprise. Les champs de logo permettent également un chargement différé.

Les champs de logo sont pris en charge dans les modules.

champ de logo
// Logo field { "name" : "logo", "label" : "Logo", "required" : false, "locked" : false, "type" : "logo", "show_loading": true, "default" : { "override_inherited_src" : false, "src" : null, "alt" : null, "loading": "lazy" } }
Champ de lien
ParamètreTypeDescription Default
show_loading
Chaîne

Détermine si les commandes permettant de choisir le chargement différé de l'image sont affichées dans l'éditeur de page.

false
default
Objet

Objet logo. 

Si show_loading est défini sur true, vous pouvez inclure une propriété loading pour définir les options de chargement différé de l'image. Les options comprennent :

  • "disabled" (par défaut)
  • "eager"
  • "lazy"
{ override_inherited_src: false, src: "", alt: null, width: null, height: null, loading: "disabled" suppress_company_name: false }

Les champs de menu offrent aux créateurs de contenu une interface intuitive pour créer, modifier et sélectionner un menu de navigation réutilisable sur d'autres pages. Ce champ est idéal pour les menus utilisés sur plusieurs pages, comme la navigation principale, la navigation en bas de page et dans d'autres contenus globaux.  Utilisez ce champ en tandem avec la balise menu ou la fonction menu(), pour un rendu de menu à l'intérieur de votre module.

Pour les menus qu'il n'est pas utile de réutiliser sur d'autres pages, comme un menu de table des matières, utilisez le champ menu simple.

Les champs de menu sont pris en charge dans les modules.

champ de menu
// Menu field { "name" : "menu", "label" : "Menu", "required" : false, "locked" : false, "type" : "menu", "default" : 12345678911 }
Champ de lien
ParamètreTypeDescription Default
default
Entier

L'ID de menu du menu. La valeur par défaut, null, correspond au menu par défaut sous la navigation.

null

Nombre

Les champs numériques offrent aux créateurs de contenu une interface intuitive pour saisir ou ajuster des valeurs numériques et des options. Cette fonction peut être utilisée pour créer des articles basés sur des pourcentages ou tout autre élément pour lequel des nombres sont nécessaires.

Les champs numériques sont pris en charge dans les modules. Les champs numériques peuvent être utilisés comme champs de style.

Champ numérique
// Number field { "name" : "number_field", "label" : "Number", "required" : false, "locked" : false, "display" : "slider", "min" : 1, "max" : 10, "step" : 1, "type" : "number", "prefix": "", "suffix" : "", "default" : null, "placeholder": "50" }
Champ de lien
ParamètreTypeDescription Default
default
Nombre

Un numéro par défaut à utiliser.

null
prefix
Chaîne

Ajouté comme préfixe au champ numérique.

suffix
Chaîne

Ajouté comme suffixe au champ du numéro.

placeholder
Chaîne

Ajoute une valeur de variable au champ.

Les paramètres suffixe et préfixe sont utilisés à des fins d'affichage dans l'éditeur de contenu et n'ont aucun effet sur la valeur numérique du champ. 

Page

Les champs de page fournissent une interface permettant aux créateurs de contenu de sélectionner des pages du site et des pages de destination.

La valeur renvoyée par un champ de page est l'identifiant de la page sélectionnée. Lorsqu'elle est utilisée en tandem avec les fonctions content_by_id ou content_by_ids, vous pouvez utiliser les données des pages sélectionnées dans la page actuelle.

Les champs de page sont pris en charge dans les modules.

Champ de page
// Page field { "name" : "page_field", "label" : "Page", "help_text" : "Pulls data from the selected page.", "required" : false, "locked" : false, "placeholder" : "Page to pull from", "type" : "page", "default" : null }
Champ de lien
ParamètreTypeDescription Default
default
Entier

Un identifiant de page par défaut à sélectionner.

null

Texte enrichi

Les champs de texte enrichi offrent aux créateurs de contenu une expérience d'éditeur de texte WYSIWYG. Lorsque la valeur d'un champ de texte enrichi est imprimée, elle l'est au format HTML. Lorsque vous ne souhaitez pas que les créateurs de contenu disposent des droits de mise en forme, utilisez des champs de texte.

Les champs de texte enrichi sont pris en charge dans les modules.

Champ de texte enrichi
// Rich text field { "name" : "description", "label" : "Description", "required" : false, "locked" : false, "type" : "richtext", "default" : null }
Champ de lien
ParamètreTypeDescription Default
default
Chaîne

la chaîne de contenu à afficher prend en charge le HTML. 

Remarque : Vous ne pouvez pas utiliser la fonction get_asset_url dans cette propriété par défaut. 

""
enabled_features
Facultatif
Tableau

Un ensemble d'éléments qui vous permet de configurer la barre d'outils de l'éditeur de texte enrichi et les options disponibles pour les éditeurs de contenu. 

Les champs de menu simple offrent aux créateurs de contenu une interface intuitive pour créer un menu de navigation qui n'est pas réutilisable sur d'autres pages. Pour les menus qui doivent être réutilisables, utilisez le champ de menu. Cela peut être utile pour un menu de table des matières qui renvoie vers des titres de pages très longues, ou pour une liste de liens vers du contenu qui ne fait sens que sur la page en cours.

Les champs de menu simple sont pris en charge dans les modules.

Champ de menu simple
// Simple menu field { "name" : "toc_menu", "label" : "Table of Contents", "required" : false, "locked" : false, "type" : "simplemenu", "default" : [ { "isPublished" : false, "pageLinkId" : null, "pageLinkName" : null, "isDeleted" : null, "categoryId" : null, "subCategory" : null, "contentType" : null, "state" : null, "linkLabel" : "Why is product marketing important?", "linkUrl" : null, "linkParams" : null, "linkTarget" : null, "type" : "NO_LINK", "children" : [ { "isPublished" : false, "pageLinkId" : null, "pageLinkName" : null, "isDeleted" : null, "categoryId" : null, "subCategory" : null, "contentType" : null, "state" : null, "linkLabel" : "Product Marketing Responsibilities", "linkUrl" : "#product-marketing-responsibilities", "linkParams" : null, "linkTarget" : null, "type" : "URL_LINK", "children" : [ ] }, { "isPublished" : false, "pageLinkId" : null, "pageLinkName" : null, "isDeleted" : null, "categoryId" : null, "subCategory" : null, "contentType" : null, "state" : null, "linkLabel" : "1. Identify the buyer personas and target audience for your product.", "linkUrl" : "#step1", "linkParams" : null, "linkTarget" : null, "type" : "URL_LINK", "children" : [ ] }, { "isPublished" : false, "pageLinkId" : null, "pageLinkName" : null, "isDeleted" : null, "categoryId" : null, "subCategory" : null, "contentType" : null, "state" : null, "linkLabel" : "2. Successfully create, manage and carry out your product marketing strategy.", "linkUrl" : "#step2", "linkParams" : null, "linkTarget" : null, "type" : "URL_LINK", "children" : [ ] } ] }, { "isPublished" : false, "pageLinkId" : null, "pageLinkName" : null, "isDeleted" : null, "categoryId" : null, "subCategory" : null, "contentType" : null, "state" : null, "linkLabel" : "How HubSpot can help", "linkUrl" : "https://hubspot.com", "linkParams" : null, "linkTarget" : null, "type" : "URL_LINK", "children" : [ ] } ] }
Champ de lien
ParamètreTypeDescription Default
default
Tableau d'objets

Structure JSON pour le menu et les enfants du menu.

[]

Espacement

Ce champ fournit une interface utilisateur (IU) permettant aux créateurs de contenu de définir le remplissage et la marge. Les champs d'espacement ont une propriété .css qui renvoie la CSS basée sur la valeur du champ. Découvrez-en davantage sur la propriété CSS générée.

Les champs d'espacement sont pris en charge dans les modules.
Les champs d'espacement ne peuvent être utilisés que comme champs de style.

capture d'écran du champ de style d'espacement développé dans l'éditeur de page
// Spacing field { "name": "img_spacing", "label": "Spacing around image", "required": false, "type": "spacing", "limits": { "padding": { "top": { "max": 50, "min": 25, "units": ["px", "pt", "em"] }, "left": { "max": 50, "units": ["px", "pt", "em"] }, "bottom": { "max": 50, "units": ["px", "pt", "em"] } }, "margin": { "top": { "max": 50, "min": 25, "units": ["px", "pt", "em"] }, "bottom": { "max": 25, "units": ["Q", "rem", "em"] } } }, "default": { "padding": { "top": { "value": 25, "units": ["px", "pt", "em"] }, "bottom": { "value": 25 "units": ["px", "pt", "em"] }, "left": { "value": 25, "units": ["px", "pt", "em"]}, "right": { "value": 25, "units": ["px", "pt", "em"] } }, "margin": { "top": { "value": 20, "units": ["px", "pt", "em"] }, "bottom": { "value": 20, "units": ["px", "pt", "em"] } } } }
Champ de lien
ParamètreTypeDescription Default
default
Objet

Définit les valeurs d'espacement par défaut.

Contient des objets padding et margin :

  • padding : peut contenir des objets top, right, bottom et left
  • marge : peut contenir des objets top et bottom

Utilisez units pour définir les unités qu'un créateur de contenu peut utiliser dans HubSpot. Découvrez-en davantage sur les unités ci-dessous.

{}
limits
Objet

Définit les directives pour l'espacement min et max

Contient des objets padding et margin :

  • padding : peut contenir des objets top, right, bottom et left
  • marge : peut contenir des objets top et bottom

Utilisez units pour définir les unités qu'un créateur de contenu peut utiliser dans HubSpot. Découvrez-en davantage sur les unités ci-dessous.

Lorsque vous utilisez le champ d'espacement, veuillez prendre note de ce qui suit :

  • Vous devez inclure une liste units lors de la définition du champ min ou max
  • La propriété units prend en charge les types d'unité suivants : %, ch, em, ex, in, lh, pc, pt, px, Q, rem, vh, vmax, vmin et vw.
  • Lorsqu'un créateur de contenu modifie en masse tous les éléments de remplissage, HubSpot utilise la valeur min la plus élevée et la valeur max la plus faible. En outre, seules les unités partagées par tous les éléments seront disponibles pour le créateur de contenu.

Balise

Les champs de balise fournissent un sélecteur de balises de blog pour les créateurs de contenu. Ce sélecteur de balise renvoie un identifiant de balise de blog qui peut ensuite être utilisé dans les fonctions liées aux balises de blog telles que URL Balise de blog et Articles Balise de blog récente.

Les champs de balise sont pris en charge dans les modules.

champ de balise
// Tag field { "id" : "c3395cd3-8e60-7e47-2f1b-b7ccf4d669c9", "name" : "blog_tag", "label" : "Blog Tag", "required" : false, "locked" : false, "tag_value" : "SLUG", "type" : "tag", "default" : null }
Champ de balise
ParamètreTypeDescription Default
default
Chaîne

Identifiant de balise de blog

null

Texte

Les champs de texte offrent aux créateurs de contenu une expérience d'édition de texte simple, sans fonctionnalité de texte enrichi. Les champs de texte s'affichent initialement sur une seule ligne, mais ils peuvent se transformer en zones de texte et prendre en charge plusieurs lignes. Utilisez-les lorsque vous ne voulez pas que les créateurs de contenu contrôlent la mise en forme. Si vous souhaitez autoriser le contrôle de mise en forme, utilisez des champs de texte enrichi.

Les champs de texte sont pris en charge dans les modules.

champ de texte
// Text field { "name" : "product_name", "label" : "Product Name", "required" : false, "locked" : false, "validation_regex" : "", "allow_new_line" : false, "show_emoji_picker" : false, "type" : "text", "default" : "" }
Champ de lien
ParamètreTypeDescription Default
default
Chaîne

Chaîne de texte.

""

Alignement du texte

Cette zone permet aux créateurs de contenu d'aligner le contenu du texte dans un conteneur. Ce champ ne doit pas être utilisé pour aligner d'autres ressources, car il existe un type de champ spécifique pour cela.

Les champs d'alignement du texte sont pris en charge dans les modules. Les champs d'alignement du texte ne peuvent être utilisés que comme champs de style.

Champ d'alignement du texte
// text alignment field { "name": "heading_align", "label": "Heading alignment", "required": false, "type": "textalignment", "default": { "text_align": "LEFT" } }
Champ de blog
ParamètreTypeDescription Default
default
Objet

Objet contenant horizontal_align et vertical_align.

alignment_direction
Chaîne

Détermine si seuls les contrôles d'alignement horizontal, vertical ou les deux doivent être affichés. Peut-être :

  • HORIZONTAL
  • VERTICAL
  • LES DEUX
BOTH

URL

Les champs d'URL offrent une expérience similaire à celle des champs de liens. Fournir une interface utilisateur permettant aux créateurs de contenu d'ajouter des liens. Les champs d'URL, cependant, n'affichent pas d'interface utilisateur pour ouvrir dans une nouvelle fenêtre, ni ne disent aux moteurs de recherche de ne pas suivre. Utilisez ce champ lorsque vous voulez, en tant que développeur, dicter les valeurs de ce champ. Si vous voulez que l'utilisateur ait le contrôle, utilisez plutôt des champs de lien.

Les champs d'URL sont pris en charge dans les modules.

Champ d'URL
// URL field { "name" : "url", "label" : "URL", "required" : false, "locked" : false, "supported_types" : [ "EXTERNAL", "CONTENT", "FILE", "EMAIL_ADDRESS", "BLOG", "PHONE_NUMBER", "WHATSAPP_NUMBER" ], "type" : "url", "default" : { "content_id" : null, "href" : "http://example.com", "type" : "EXTERNAL" } }
Champ de lien
ParamètreTypeDescription Default
default
Objet

Objet URL, avec type, href et id de contenu (si le contenu est une page ou un post sur HubSpot)

{ "content_id" : null, "href" : "", "type" : "EXTERNAL" }
supported_types
Tableau

liste des types de liens que ce champ permet aux créateurs de contenu de sélectionner. Supprimez de la liste les types que vous ne voulez pas que les créateurs de contenu puissent définir. Types possibles :

  • EXTERNAL : affiche un champ de saisie de texte pour une URL externe.
  • CONTENT : affiche un menu déroulant contenant le site web et les pages de destination du compte.
  • FILE : affiche un sélecteur de fichier.
  • EMAIL_ADDRESS : affiche un champ de saisie de texte pour une adresse e-mail.
  • BLOG : affiche un menu déroulant contenant les pages de listing de blog du compte.
  • PHONE_NUMBER : affiche un champ de saisie de texte pour un numéro de téléphone. Le numéro doit commencer par + et contenir 7 à 15 chiffres (à l'exclusion du code du pays).
  • WHATSAPP_NUMBER : affiche un menu déroulant contenant les numéros WhatsApp connectés au compte.
[ "EXTERNAL", "CONTENT", "FILE", "EMAIL_ADDRESS", "BLOG" ]

Vidéo

Les champs de vidéo permettent aux éditeurs de contenu d'ajouter HubSpot Vidéo au contenu de leurs modules sans avoir à utiliser des champs de texte enrichi.

Champ de vidéo
//Video field { "id" : "ca4a319e-5b58-422e-47ac-49ce1b51b507", "name" : "videoplayer_field", "label" : "Video", "required" : false, "locked" : false, "type" : "videoplayer", "show_advanced_options" : false, "default" : { "player_id" : 32173842991, "height" : 1224, "width" : 1872, "conversion_asset" : { "type" : "CTA", "id" : "c3e4fa03-2c69-461d-b9af-22b2fde86bc7", "position" : "POST" }, "loop_video" : false, "mute_by_default" : false, "autoplay" : false, "hide_control" : false } }
Use this table to describe parameters / fields
ParameterTypeDescription Default
default
Objet

Objet vidéo avec des paramètres pour player_id, height, width, size_type, conversion_asset, loop_video, mute_by_default, autoplay, et hide_control.

[]
show_advanced_options
Booléen

Si les créateurs de contenu peuvent voir les options avancées par défaut.

false

paramètres de l'objet conversion_asset

Use this table to describe parameters / fields
ParameterTypeDescription Default
type
Chaîne

Accepte soit "FORM", "CTA", ou ""

""
id
Chaîne

L'identifiant du formulaire ou du type de CTA

""
position
Chaîne

Si la ressource de conversion doit être affichée avant le début de la vidéo ou après sa fin. Accepte soit "PRE" soit "POST".

""

Cet article vous a-t-il été utile ?
Ce formulaire est destiné à recueillir les avis sur la documentation pour les développeurs. Si vous souhaitez faire part de votre avis sur les produits HubSpot, veuillez le partager sur le forum des idéesde la communauté.