HubSpot CMS for Developers study materials
HubSpot CMS for Developers study resources

HubSpot CMS for Developers practice questions

One question at a time. Build your HubSpot CMS for Developers understanding.

First 50 of 200 questions. Each one lists the choices, the correct answer, and an explanation. The checker at the top of this page saves progress in this browser when it is available.

Continue in the practice tool above to load more questions, 50 at a time.

Question 1HubSpot CMS for Developers

In HubSpot CMS development, what is the primary purpose of a module's `module.html` file?

  1. It declares the module's server-side JavaScript functions.
  2. It defines the markup and HubL rendering logic for the module. Correct answer.
  3. It registers the module's CSS and JavaScript assets.
  4. It stores the module's field definitions and metadata.

Explanation

The `module.html` file holds the HTML markup and HubL that control how a module renders on the page. Field definitions live in `fields.json`, and metadata lives in `module.json`, so markup is isolated to the HTML file.

Question 2HubSpot CMS for Developers

Which HubL tag is used to output the value of a variable to the rendered page?

  1. <% variable %>
  2. {{ variable }} Correct answer.
  3. {# variable #}
  4. {% variable %}

Explanation

Double curly braces `{{ }}` are HubL's output delimiters and print a variable's value into the rendered HTML. Statement tags use `{% %}`, comments use `{# #}`, and `<% %>` is not HubL syntax.

Question 3HubSpot CMS for Developers

A developer wants a module field to let content editors pick a color value. Which field type should they define in `fields.json`?

  1. choice
  2. color Correct answer.
  3. boolean
  4. text

Explanation

The `color` field type renders a color picker in the page editor and stores a color value. Text fields store strings, choice fields store one of a set of options, and boolean fields store true/false.

Question 4HubSpot CMS for Developers

Which HubL statement correctly begins a loop over a list variable named `items`?

  1. {% for item in items %} Correct answer.
  2. {% loop items as item %}
  3. {% foreach item : items %}
  4. {% each items into item %}

Explanation

HubL uses the `{% for item in items %}` syntax to iterate over a list or sequence. The other forms resemble syntax from other templating languages and are not valid HubL.

Question 5HubSpot CMS for Developers

What does the `extends` tag accomplish in a HubL template?

  1. It loads a JavaScript file into the page head.
  2. It includes a partial template inline at that position.
  3. It inherits a parent template so child templates can override blocks. Correct answer.
  4. It imports a macro library from another template.

Explanation

`{% extends %}` establishes template inheritance, letting a child template reuse a parent layout and override defined `{% block %}` sections. Including partials inline is done with the `include` tag, and macros are imported with `import`.

Question 6HubSpot CMS for Developers

Which HubL function returns the value of a query-string parameter named `ref` from the current request?

  1. `request.query.ref`
  2. `request.params.ref`
  3. `query_params.ref`
  4. `request.query_dict.ref` Correct answer.

Explanation

HubSpot exposes query-string values through `request.query_dict`, so `request.query_dict.ref` retrieves the `ref` parameter. The other property paths do not exist on the `request` object.

Question 7HubSpot CMS for Developers

A developer needs to render a reusable snippet of markup in many templates without template inheritance. Which tag is most appropriate?

  1. `{% macro %}`
  2. `{% extends %}`
  3. `{% include %}` Correct answer.
  4. `{% block %}`

Explanation

The `include` tag renders another template inline, making it ideal for reusable partials that are not part of an inheritance chain. `extends` and `block` are for inheritance, and `macro` defines callable functions rather than inserting a partial.

Question 8HubSpot CMS for Developers

Which HubL filter escapes a string for safe output in HTML context?

  1. `|escape` Correct answer.
  2. `|urlencode`
  3. `|safe`
  4. `|striptags`

Explanation

The `escape` filter converts characters like `<` and `&` into HTML entities to prevent injection. The `safe` filter marks content as trusted, `striptags` removes tags, and `urlencode` is for URL components.

Question 9HubSpot CMS for Developers

What is the role of the `module.json` file in a custom module?

  1. It holds the module's CSS styles.
  2. It contains the module's HTML markup.
  3. It defines editable fields and their defaults.
  4. It stores module metadata such as label and configuration. Correct answer.

Explanation

`module.json` holds metadata like the module's label, whether it is global, and other configuration. Field definitions belong in `fields.json`, markup in `module.html`, and styles in `module.css`.

Question 10HubSpot CMS for Developers

Which HubL object provides access to the contact record of the currently logged-in visitor?

  1. `request`
  2. `site_settings`
  3. `contact` Correct answer.
  4. `content`

Explanation

The `contact` object exposes properties of the known visitor's contact record, such as `contact.firstname`. The `content` object describes the current page, `request` describes the HTTP request, and `site_settings` holds global settings.

Question 11HubSpot CMS for Developers

A developer wants a menu module to output a list of links defined by a `menu` field. Which HubL pattern correctly iterates the menu items?

  1. `{% for item in menu.items %}`
  2. `{% for item in module.menu.children %}`
  3. `{% for item in module.menu.links %}`
  4. `{% for item in module.menu %}` Correct answer.

Explanation

A `menu` field stores its items as a list, so iterating `module.menu` yields each menu item with properties like `link` and `label`. The other paths reference properties that do not exist on a menu field.

Question 12HubSpot CMS for Developers

Which HubL tag correctly defines a conditional block that runs when `module.show_banner` is true?

  1. `{% case module.show_banner %} ... {% endcase %}`
  2. `{% when module.show_banner %} ... {% endwhen %}`
  3. `{% if module.show_banner %} ... {% endif %}` Correct answer.
  4. `{% if module.show_banner %} ... {% end %}`

Explanation

HubL conditionals open with `{% if %}` and close with `{% endif %}`. The `when` and `case` tags belong to different constructs, and a bare `{% end %}` is not valid HubL.

Question 13HubSpot CMS for Developers

What is the purpose of the `require_css` and `require_js` HubL functions in a module?

  1. They inline all CSS and JS into the HTML output.
  2. They validate that CSS and JS files exist before publishing.
  3. They minify CSS and JS during build.
  4. They register assets so HubSpot can deduplicate and load them in the right place. Correct answer.

Explanation

`require_css` and `require_js` register assets with HubSpot's asset pipeline, which deduplicates them and places them appropriately in the page. They do not validate files, minify content, or force inlining.

Question 14HubSpot CMS for Developers

Which file extension should a HubL partial template use so it can be included by other templates?

  1. .html Correct answer.
  2. .hubl
  3. .partial
  4. .tpl

Explanation

HubL templates and partials use the `.html` extension in HubSpot's design manager. The `include` tag references these `.html` files by path. The other extensions are not recognized for HubL templates.

Question 15HubSpot CMS for Developers

A developer needs to output a date field value formatted as `YYYY-MM-DD`. Which HubL filter should they use?

  1. `|date('%Y-%m-%d')`
  2. `|datetimeformat('%Y-%m-%d')` Correct answer.
  3. `|strftime('%Y-%m-%d')`
  4. `|format_date('%Y-%m-%d')`

Explanation

HubL's `datetimeformat` filter formats date and datetime values using a strftime-style pattern. The other filter names are not valid HubL filters for date formatting.

Question 16HubSpot CMS for Developers

Which HubL tag assigns a value to a variable for later use in the template?

  1. `{% let x = 1 %}`
  2. `{% set x = 1 %}` Correct answer.
  3. `{% var x = 1 %}`
  4. `{% assign x = 1 %}`

Explanation

HubL uses `{% set x = 1 %}` to create or update a variable. The `let`, `var`, and `assign` keywords are not HubL variable-assignment tags.

Question 17HubSpot CMS for Developers

A developer wants a custom module to appear in the page editor as a reusable global element. Which `module.json` setting controls this?

  1. `"is_global": true` Correct answer.
  2. `"is_available_for_new_content": true`
  3. `"global_module": true`
  4. `"reusable": true`

Explanation

Setting `"is_global": true` in `module.json` makes the module a global module that can be reused across pages. `is_available_for_new_content` controls editor availability, and the other keys are not valid settings.

Question 18HubSpot CMS for Developers

Which HubL function is used to render a blog post's content while applying its stored HTML?

  1. `content.body`
  2. `content.post_body` Correct answer.
  3. `blog_post.content`
  4. `post.post_body`

Explanation

Within blog templates, `content.post_body` outputs the stored HTML body of the current blog post. The other paths either reference nonexistent properties or are not the standard blog content property.

Question 19HubSpot CMS for Developers

What does the `{% raw %}` tag do in a HubL template?

  1. It loads raw JSON data into the template.
  2. It prevents HubL from parsing the enclosed content. Correct answer.
  3. It outputs variables without escaping.
  4. It strips HTML tags from the enclosed content.

Explanation

The `raw` tag tells the HubL parser to output enclosed content literally, which is useful for showing HubL syntax as text. It does not affect escaping, strip tags, or load data.

Question 20HubSpot CMS for Developers

A developer needs to display a module field only when it has a value. Which condition best handles an empty text field?

  1. `{% if module.title is empty %}`
  2. `{% if module.title %}` Correct answer.
  3. `{% if module.title != '' %}`
  4. `{% if module.title == null %}`

Explanation

In HubL, a truthy `if` check on `module.title` evaluates to false when the field is empty, so it reliably guards output. The other forms are either redundant, use unsupported comparisons, or invert the logic.

Question 21HubSpot CMS for Developers

Which HubL object gives access to values stored in a module's fields at render time?

  1. `widget`
  2. `module` Correct answer.
  3. `fields`
  4. `content.widgets`

Explanation

The `module` object exposes the current module's field values, such as `module.heading`. The other names are not the standard object for the current module's fields.

Question 22HubSpot CMS for Developers

What is the purpose of the `{% icon %}` tag in HubSpot's HubL?

  1. It imports an external icon font stylesheet.
  2. It inserts a placeholder for a favicon.
  3. It creates a clickable link around an image.
  4. It renders an SVG icon from HubSpot's icon set by name. Correct answer.

Explanation

The `icon` tag renders an inline SVG from HubSpot's built-in icon set based on the icon name and optional size. It does not load icon fonts, create links, or insert favicons.

Question 23HubSpot CMS for Developers

A developer wants a module field to store a list of repeated items, each with a text label. Which field type should they use?

  1. `choice`
  2. `group`
  3. `repeater` Correct answer.
  4. `text`

Explanation

A `repeater` field holds an array of items, each with its own child fields, and is iterated with a `for` loop. `text` stores a single string, `group` stores one set of fields, and `choice` stores one selected option.

Question 24HubSpot CMS for Developers

In HubSpot's local development workflow, what does `hs watch` do?

  1. It uploads changed files to the design manager and watches for further changes. Correct answer.
  2. It validates HubL syntax without uploading.
  3. It uploads a project once and exits.
  4. It runs a local preview server without syncing files.

Explanation

`hs watch` performs an initial upload and then monitors the local project, pushing changes to HubSpot as files are saved. It does not simply upload once, run a preview server, or limit itself to validation.

Question 25HubSpot CMS for Developers

A developer wants a template to render different markup for the homepage versus interior pages using a single template. Which HubL condition is most appropriate?

  1. `{% if page.homepage %}`
  2. `{% if content.page_type == 'home' %}` Correct answer.
  3. `{% if content.is_homepage %}`
  4. `{% if request.is_home %}`

Explanation

The `content` object exposes `page_type`, which can be compared to identify the current page type. The other properties do not exist on the referenced objects, so they would not evaluate as intended.

Question 26HubSpot CMS for Developers

In a HubSpot custom module, which file defines the editable fields that content creators see in the page editor?

  1. module.css
  2. module.js
  3. fields.json Correct answer.
  4. module.html

Explanation

HubSpot custom modules use `fields.json` to declare the field schema, including field names, types, labels, and defaults. The page editor builds its sidebar controls from that schema, so adding a field there makes it available to editors.

Question 27HubSpot CMS for Developers

A developer places a file in a theme's `templates/` directory and wants HubSpot to treat it as a drag-and-drop page template. Which HubL annotation must appear at the top of the file?

  1. `{# template_type: page #}` Correct answer.
  2. `{{ template_type("page") }}`
  3. `<!-- templateType: page -->`
  4. `{% extends "page.html" %}`

Explanation

HubSpot reads a special HubL comment at the top of template files to determine template type and metadata. The `{# template_type: page #}` annotation marks the file as a page template so it becomes selectable when creating pages.

Question 28HubSpot CMS for Developers

Which HubL tag renders a drag-and-drop area inside a template so editors can drop modules into it?

  1. `{% module_block %}`
  2. `{% dnd_area %}` Correct answer.
  3. `{% widget_container %}`
  4. `{% include_dnd %}`

Explanation

`{% dnd_area %}` defines a drop zone in a template, and `{% dnd_section %}` and `{% dnd_column %}` structure its layout. Modules placed inside that area are then editable in the drag-and-drop page editor.

Question 29HubSpot CMS for Developers

A developer needs a module field that lets an editor pick a page from the site. Which field type should be declared in `fields.json`?

  1. `page` Correct answer.
  2. `url`
  3. `link`
  4. `text`

Explanation

The `page` field type stores a reference to a HubSpot page and returns page metadata such as its URL and title. It gives editors a picker of existing site pages rather than free-text entry.

Question 30HubSpot CMS for Developers

Which HubL tag outputs a variable's value to the rendered page?

  1. `{# value #}`
  2. `{% print value %}`
  3. `{% output value %}`
  4. `{{ value }}` Correct answer.

Explanation

Double curly braces `{{ }}` are HubL's expression delimiters and print the evaluated value into the output. Statement tags such as `{% %}` control logic, and `{# #}` marks comments.

Question 31HubSpot CMS for Developers

A developer wants a custom module to be usable inside other modules and templates as a nested component. Which `module.json` property controls whether the module is available as a nested module?

  1. `smart_type`
  2. `global`
  3. `content_types`
  4. `is_available_for_new_content` Correct answer.

Explanation

`is_available_for_new_content` in `module.json` determines whether the module appears in content editors' module pickers, including when adding nested modules. Setting it to true makes the module insertable in templates and other modules.

Question 32HubSpot CMS for Developers

Which HubL object exposes details about the current page, such as its title and canonical URL?

  1. `resolver`
  2. `request`
  3. `site_settings`
  4. `content` Correct answer.

Explanation

The `content` object holds data for the page currently being rendered, including title, URL, author, and other content metadata. Templates commonly read `content.title` or `content.canonical_url` for SEO markup.

Question 33HubSpot CMS for Developers

A developer wants to add a custom filter to a HubL template so it can be reused across files. Which HubL tag defines a reusable macro?

  1. `{% def %}`
  2. `{% function %}`
  3. `{% filter %}`
  4. `{% macro %}` Correct answer.

Explanation

HubL provides a `{% macro %}` tag for defining reusable named blocks of template logic that can be called with parameters. Macros help avoid duplicating markup across templates.

Question 34HubSpot CMS for Developers

A developer wants to serve a JSON endpoint from a HubSpot site using a template. Which template type should be used?

  1. `blog`
  2. `email`
  3. `page`
  4. `custom` Correct answer.

Explanation

A custom template with the appropriate content type can render non-HTML output such as JSON or XML. Developers use this for feeds, sitemaps, and API-style endpoints served by HubSpot.

Question 35HubSpot CMS for Developers

A developer needs to loop over the items of a repeater field named `features` in a module. Which HubL construct is correct?

  1. `{% repeat feature in module.features %}`
  2. `{% loop feature in module.features %}`
  3. `{% for feature in module.features %}` Correct answer.
  4. `{% each module.features as feature %}`

Explanation

HubL uses a `{% for item in collection %}` loop syntax, and repeater field values are accessed through the module object by field name. Inside the loop, each item exposes the repeater's subfields.

Question 36HubSpot CMS for Developers

A developer wants to render a partial template file at `partials/cta.html` from within a page template. Which HubL tag should be used?

  1. `{% import "partials/cta.html" %}`
  2. `{% render "partials/cta.html" %}`
  3. `{% include "partials/cta.html" %}` Correct answer.
  4. `{% partial "partials/cta.html" %}`

Explanation

`{% include %}` inserts the content of another template file into the current template at render time. The path is relative to the template root, so `partials/cta.html` resolves to that file.

Question 37HubSpot CMS for Developers

A developer wants a module's styles to load only when the module is present on the page. Which HubL function supports this?

  1. `append_css`
  2. `load_styles`
  3. `include_css`
  4. `require_css` Correct answer.

Explanation

`require_css` registers a stylesheet so HubSpot includes it in the page's CSS output only when the calling template or module is rendered. This keeps unused styles off pages that do not use the module.

Question 38HubSpot CMS for Developers

A developer needs to read a HubSpot blog post's tags in a listing template. Which property of the post object holds them?

  1. `post.categories`
  2. `post.tag_list`
  3. `post.topics` Correct answer.
  4. `post.labels`

Explanation

In HubSpot's blog post object, tags are exposed through the `topics` property, which is an array of tag objects. Templates loop over `post.topics` to render the tag names and links.

Question 39HubSpot CMS for Developers

A developer wants to output a value only when it is present and otherwise show fallback text. Which HubL filter is designed for that purpose?

  1. `coalesce`
  2. `default` Correct answer.
  3. `fallback`
  4. `or_else`

Explanation

The `default` filter returns a fallback value when the input is undefined or empty, making it ideal for optional module fields. Applying it in the output expression avoids separate conditional blocks.

Question 40HubSpot CMS for Developers

A developer wants to build a module that outputs different markup depending on whether the visitor is on mobile. Which approach uses HubSpot's supported mechanism?

  1. Use `{% if device.mobile %}` to branch markup
  2. Use the `mobile` field type in `fields.json`
  3. Use a HubL conditional on `request.user_agent` to branch markup Correct answer.
  4. Use the `is_mobile` HubL tag

Explanation

HubSpot does not provide a built-in HubL device object or tag, so server-side branching on the request's user agent string is the supported approach. Alternatively, developers handle responsiveness in CSS rather than in HubL.

Question 41HubSpot CMS for Developers

A developer needs to fetch HubSpot CRM contact data inside a server-side template. Which HubL function is provided for that purpose?

  1. `crm_data`
  2. `crm_object` Correct answer.
  3. `contact_by_email`
  4. `get_contact`

Explanation

HubSpot exposes CRM records to templates through functions such as `crm_object`, which retrieves a record by object type and identifier. This lets templates render CRM-backed content without client-side API calls.

Question 42HubSpot CMS for Developers

A developer wants to add a menu to a page template using a menu defined in the navigation settings. Which HubL function outputs it?

  1. `menu("main")` Correct answer.
  2. `nav_menu("main")`
  3. `site_menu("main")`
  4. `navigation("main")`

Explanation

The `menu` HubL function renders a navigation menu by its identifier as configured in HubSpot's navigation settings. Developers pass the menu's internal name to output its markup.

Question 43HubSpot CMS for Developers

A developer wants to add a custom form to a template and control the redirect after submission. Which HubSpot object is used to render forms in HubL?

  1. `form` Correct answer.
  2. `hubspot_form`
  3. `form_data`
  4. `forms`

Explanation

The `form` HubL object renders a HubSpot form by its GUID and supports parameters such as redirect URL and field overrides. It produces the form markup and integrates with HubSpot's submission handling.

Question 44HubSpot CMS for Developers

A developer wants to add a global group of fields that editors can update once and have reflected everywhere. Which module setting accomplishes this?

  1. `global: true` Correct answer.
  2. `reusable: true`
  3. `shared: true`
  4. `is_global: true`

Explanation

Setting `global` to true in a custom module's `module.json` makes the module global, so edits to its fields apply wherever the module is used. This is useful for site-wide content such as a footer message.

Question 45HubSpot CMS for Developers

A developer wants to write a template that extends a base layout and overrides a block. Which HubL tag declares the base template?

  1. `{% block "base.html" %}`
  2. `{% import "base.html" %}`
  3. `{% include "base.html" %}`
  4. `{% extends "base.html" %}` Correct answer.

Explanation

`{% extends %}` declares that the current template inherits from a base template and can override its named blocks. The base template uses `{% block %}` to mark the sections that child templates may replace.

Question 46HubSpot CMS for Developers

A developer needs to output a JSON-LD script block that contains literal curly braces. Which HubL approach avoids the braces being parsed as HubL expressions?

  1. Place the braces inside a `{% comment %}` block
  2. Use `{{ "{" }}` for every brace
  3. Wrap the braces in `{% raw %}` and `{% endraw %}` Correct answer.
  4. Escape each brace with a backslash

Explanation

`{% raw %}` tells HubL to output its contents verbatim without parsing expressions or tags. Wrapping JSON-LD markup in it prevents sequences like `{{` or `{%` from being interpreted.

Question 47HubSpot CMS for Developers

A developer finds that a module's `require_js` call places the script in the page footer but it must run before other scripts. Which parameter controls where the script is rendered?

  1. The `async` parameter set to `false`
  2. The `defer` parameter set to `false`
  3. The `placement` parameter set to `head`
  4. The `position` parameter set to `head` Correct answer.

Explanation

`require_js` accepts a `position` parameter, such as `head` or `footer`, that determines where the registered script is rendered in the document. Setting it to `head` moves the script earlier in the page.

Question 48HubSpot CMS for Developers

A developer wants to localize a module's text field using HubSpot's multi-language features. Which module field configuration supports translated values?

  1. Enabling translation in the field's `options` array
  2. Adding a separate field per language manually
  3. `allow_translation: true` on the field Correct answer.
  4. Setting the field type to `translated_text`

Explanation

HubSpot supports translating module field values by enabling translation for the field in `fields.json`. Editors can then supply per-language values that render according to the page's language.

Question 49HubSpot CMS for Developers

A developer needs to render a module inside a template with specific field values supplied at the template level. Which HubL tag accomplishes this?

  1. `{% include_module "path/to/module" %}`
  2. `{% module_block module "path/to/module" %}`
  3. `{% module_include "path/to/module" %}`
  4. `{% module "path/to/module" %}` Correct answer.

Explanation

The `{% module %}` tag renders a module by path and accepts parameters for its fields, allowing template-level values. `module_block` is used when the module needs nested content blocks.

Question 50HubSpot CMS for Developers

A developer wants to conditionally render a section only when a repeater field contains at least one item. Which HubL expression is correct?

  1. `{% if module.items.exists %}`
  2. `{% if module.items|length > 0 %}` Correct answer.
  3. `{% if module.items.count %}`
  4. `{% if module.items is not null %}`

Explanation

The `length` filter returns the number of items in a sequence, so comparing it to zero checks for a non-empty repeater. This avoids rendering an empty wrapper when no items were added.