skills.rest
GolfNext
GolfNextOFFICIAL
Explore all skills by this author →
GitHub

theme-development

Develop and configure HubSpot CMS themes with theme.json and fields.json definitions.

Updated Aug 27, 2026
Search Tags:#templates#frontend#web design#hubspot#cms#theme development#sections
One-click install
npx skills add https://github.com/GolfNext/golfnext-tool-kiosk-support-page --skill theme-development
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: theme-development
Source: https://github.com/GolfNext/golfnext-tool-kiosk-support-page/tree/main/.claude/plugins/hubspot-cms-dev/skills/theme-development
Command: npx skills add https://github.com/GolfNext/golfnext-tool-kiosk-support-page --skill theme-development

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the creation and customization of HubSpot CMS themes, enabling developers to build visually consistent and functional websites with greater efficiency.

Core Features & Use Cases

  • Theme Structure: Understand and implement the standard directory structure for HubSpot themes, including theme.json, fields.json, templates, modules, sections, CSS, and JS.
  • Configuration: Define theme-level settings (colors, typography, layout) using fields.json and access them within templates.
  • Layouts & Sections: Create reusable page layouts and drag-and-drop sections for content editors.
  • Global Content: Implement global modules for consistent headers, footers, and other site-wide elements.
  • Use Case: Develop a new branded theme for a client, defining all their brand colors, fonts, and layout options in fields.json, and then build out reusable hero and feature sections for content editors to use on various pages.

Quick Start

Create a new HubSpot theme by defining the theme.json and fields.json files, and setting up a base layout template.

Frequently Asked Questions about theme-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a HubSpot CMS theme from scratch?▼

HubSpot CMS theme development involves defining the standard directory structure with `theme.json`, `fields.json`, templates, modules, sections, CSS, and JS files. You implement reusable components and global content to ensure consistent website design and content management.

How do I configure brand colors and typography in HubSpot themes?▼

You configure HubSpot CMS theme settings like colors, typography, and layout by defining them in the `fields.json` file. These settings are then accessed and applied directly within your layout templates.

What is the best way to create reusable drag-and-drop sections in HubSpot?▼

Creating reusable drag-and-drop sections in HubSpot involves building specific layout components within the theme architecture. This allows content editors to easily assemble and customize various pages using the predefined sections.

Does HubSpot CMS support global modules for site-wide headers and footers?▼

Yes, HubSpot CMS supports implementing global modules for consistent headers, footers, and other site-wide elements. This ensures uniform global content management across the entire platform website.

What do I need to set up before developing a new branded HubSpot theme?▼

Before developing a HubSpot CMS theme, you need to establish the standard directory structure and define your `theme.json` and `fields.json` files. This setup provides the foundation for creating templates and configuring brand settings.

Related Skills

Explore More Software Engineering Skills→
FunnelEnvyFunnelEnvy
1

hubspot-crm

Sync contacts and lists to HubSpot CRM via REST API.

Official
Intermediate
nekorush14nekorush14
4

react-styling

Style React components with Tailwind CSS, CSS Modules, and CSS-in-JS.

Community
Advanced
bomberoxenviosdosruedasbomberoxenviosdosruedas

agency-cms-developer

Develop custom themes, plugins, and modules for Drupal and WordPress CMS platforms.

Community
Advanced
rczamorrczamor
1

wordpress-theme-to-emdash

Convert WordPress themes to EmDash CMS by extracting design elements and templates.

Community
Advanced