Skip to content
  • There are no suggestions because the search field is empty.

POWER Global Module Configuration

This article explains how to configure reusable module configurations using the Hubl/Jinja dictionary format to override module settings in HubSpot Content Hub.

Overview

The POWER global configuration feature can be enabled for all modules in your theme settings under Advanced → Enable Global Module Config By Default. You can also enable or disable this feature for individual module instances using the Enable Global Module Config option.

When this option is enabled, the module displays a text field called Global Module Config. Here, you can enter a configuration ID that matches one defined in your global configuration. Multiple configuration IDs can be added, separated by spaces.

Each POWER module type has a default configuration ID that can be used to apply consistent settings to all instances. If a configuration ID is specified, the corresponding configuration overrides the module’s default settings. In this case, the values entered in the HubSpot UI fields for that instance no longer take effect. Visual indicators appear in the page editor showing which fields are being overridden by the global configuration.



Basic Structure

Configurations are defined as a Jinja dictionary, where each key represents a configuration ID.

Example:

{
"configuration-id-1": {
field_name: value
},
"configuration-id-2": {
field_name: value
}
}

You can define multiple configurations by using different configuration IDs as keys in the top-level dictionary.



Where to Get the Field Names

Field names correspond to the internal keys defined in the module’s fields.json file.
You can find this file in the module’s folder within HubSpot Design Manager.

Alternatively, you can inspect a module in the Design Manager UI to view its internal field names, types, and available options.
Note that some fields are organized in groups or repeaters, which also have their own internal names.



Field Type Value Formats

Below are examples for each supported field type.

Boolean Field

boolean_field: true
Value: true or false


CTA Field 

cta_field: "cta-id-string"


Choice Field

Single value:

choice_field: "value1"

Multiple selections:

choice_field: ["value1", "value2"]


Color Field

color_field: {
color: "#261c3a",
opacity: 100
}
  • color: Hex code or null

  • opacity: 0–100


File Field

file_field: "https://example.com/file.pdf"


Followup Email Field

followup_email_field: "email-id-string"


Font Field

font_field: {
size: 16,
size_unit: "px",
color: "#000000",
font: "Merriweather",
font_set: "GOOGLE",
styles: {
bold: true,
italic: false,
underline: false
}
}

Options:

  • size_unit: px, em, rem, or %

  • font_set: GOOGLE or DEFAULT

  • variant: 400, 700, 400i, etc.


Form Field

form_field: {
form_id: "form-guid-here",
response_type: "inline",
message: "Thank you for your submission"
}


Icon Field

icon_field: {
name: "home",
unicode: "f015",
type: "SOLID"
}

Type options: SOLID, REGULAR, LIGHT, BRANDS

Image Field

image_field: {
src: "https://example.com/image.jpg",
alt: "Image description",
width: 800,
height: 600,
size_type: "auto",
loading: "lazy"
}

Options:

  • size_type: auto, exact, or null

  • loading: disabled, lazy, or eager


Link Field

External link:

link_field: {
url: {
type: "EXTERNAL",
href: "https://example.com"
},
open_in_new_tab: false,
no_follow: false
}

Internal content: 

link_field: {
url: {
type: "CONTENT",
content_id: 123456789
},
open_in_new_tab: false,
no_follow: false
}

Type options:

  • EXTERNAL
  • CONTENT
  • FILE
  • EMAIL_ADDRESS
  • BLOG
  • CALL_TO_ACTION
  • PHONE_NUMBER
  • WHATSAPP_NUMBER
  • PAYMENT


Logo Field 

logo_field: {
override_inherited_src: true,
src: "https://example.com/logo.png",
alt: "Company Logo",
width: 200,
height: 100,
loading: "lazy"
}


Menu Field

menu_field: 123456789

Value: Menu ID (integer) or null for default

Number Field 

number_field: 42


Page Field

page_field: 123456789


Rich Text Field

rich_text_field: "<h2>Heading</h2><p>This is <strong>rich text</strong> content.</p>"


Simple Menu Field

simple_menu_field: [
{
label: "Home",
url: "https://example.com"
},
{
label: "About",
url: "https://example.com/about",
children: [
{
label: "Team",
url: "https://example.com/team"
}
]
}
]


Text Field 

text_field: "This is plain text content"


URL Field

External: 

url_field: {
type: "EXTERNAL",
href: "https://example.com"
}

Internal: 

url_field: {
type: "CONTENT",
content_id: 123456789,
href: ""
}

 

Video Field 

video_field: {
player_id: 123456789,
height: 1080,
width: 1920,
size_type: "auto",
autoplay: false,
loop_video: false,
mute_by_default: false,
hide_control: false,
conversion_asset: {
type: "FORM",
id: "form-id",
position: "POST"
}
}

Conversion asset options:

  • type: FORM, CTA, or empty

  • position: PRE or POST

 



Important Notes

  1. Always pass repeatable groups as arrays of objects.

  2. Use exact field names from the module’s fields.json file.

  3. Repeatable groups can contain other repeatable groups (for example, tabs containing team).

  4. Fields can be omitted if not needed; empty strings "" or null are valid for optional fields.

  5. Boolean fields such as is_contact control visibility of related contact fields.

  6. Empty arrays [] result in no items shown. Add as many objects as needed.

  7. Keep a consistent structure across items in a group.

  8. Use staggered animation delays (0, 100, 200ms) for cascading effects.

  9. Ensure type safety — values must match the expected type (string, integer, boolean, or object).


Reference

For complete field specifications, refer to HubSpot’s documentation:
HubSpot Module Theme Fields Documentation