Skip to content

Understanding Modules in Generator

What Are Modules?

Modules are the building blocks of every page in the Generator theme. In a drag-and-drop system like Generator, virtually everything visible on a page — from text blocks to tabbed content — is a module. Generator includes approximately 40–41 modules, each with unique functionality and styling options.

Accessing Generator's Modules

To find and use modules, click the + (plus) button in the top left of the page editor, then click Show More. All of Generator's native modules are listed under the Theme section. If you've built custom modules or installed any from the HubSpot Marketplace, those will appear under Other Modules.

Ways to Start Building a Page

There are a few approaches to building a page with modules:

Starter templates — When creating a new page, you can choose one of Generator's pre-built starter templates to begin from a structured layout.

Sections library — Click Add Section to browse Generator's sections library. Sections are pre-styled groupings of modules designed to make common page sections faster to build.

Modules directly — For full flexibility, you can drag individual modules straight onto the page.

Adding a Module to Your Page

To use a module, locate it in the theme modules list and drag it onto the page where you want it to appear. Each module you drop will be placed into its own section automatically.

Once placed, click the module to begin working with it. From there you can:

  • Add and edit content in the Content tab
  • Clone the module to duplicate it with variations
  • Adjust appearance and layout in the Styles tab

Each module has its own unique content fields and style options. For example, the Animated Statistics module lets you configure a count-up number, symbol, symbol position, and description for each statistic.

Exploring All Available Modules

Generator's demo website includes a full visual inventory of every section and module in the theme. Each module entry includes a usage demo so you can see how it works and what it's capable of. This is a helpful reference when planning your page layout. The link is included in the Resources section below.

This lesson introduced Generator's module system — the foundational layer of every page built with the theme. The key action was learning how to locate, drag, and configure modules using the Content and Styles tabs. The next lesson will go deeper into specific module functionality and how to use them to build out full page sections.