Learn more about the HubSpot Template Marketplace Marketplace Policies.
meta.json
file (Linked Files section in Design Tools). This only works with modules in themes, and will not work for standalone modules.alternate_names
attribute can be used to achieve module compatibility with themes in the Template Marketplace. It provides the bridge for a module to integrate with as many marketplace themes as possible without much effort from providers and module developers.
Theme providers define a new attribute called alternate_names
which contains standard fields mapped to the module fields. Alternate names are supported for fonts and color fields. Module fields will inherit from the standard color and font fields. This is a new attribute introduced for theme fields. For example:
theme.button_color
and theme.primary_color
. This way, providers can update their existing theme to meet template standards.
Modules and themes must adhere to the following requirements to ensure functionality when used across themes:
primary_color
, secondary_color
, heading_font
, and body_font
.primary_color
, secondary_color
, heading_font
, or body_font
fields, they can use the alternate_names
attribute to map existing fields to standard fields. This way, when an independent module is added to the theme template, it has a similar look and feel of the themed module.default_value_path
or property_value_paths
, or both. Review the code snippet below for an example:
default_value_path
, the accepted value is theme.primary_color
.property_value_paths
you must use trailing individual properties .color
or .opacity
based on the property they are mapping.module.html
, these fields can be referred to with the following dot notation:primary_color
, secondary_color
, heading_font
, and body_font
) must be used so that the module fields can be mapped with the standard field names. Developers can either create new module fields that meet the standard naming convention, or use the alternate_names
parameter to map existing fields to the standard fields.alternate_name
can be accessed directly using theme.primary_color
or indirectly using theme.colors.primary
. Below is an example:alternate_name
can be accessed directly using theme.heading_font
or indirectly using theme.fonts.primary
. Review the snippet below for an example: