HubSpot’s Design Manager offers a comprehensive set of tools that developers need to build websites. In this article, we’ll take a tour of the Design Manager.
Where can I find the Design Manager?
The Design Manager can be found under Contents > Design Manager. The Design Manager is available for all plans.Code editor
HubSpot's code editor serves as an integrated development environment (IDE) where you can write CSS, JavaScript, and HTML code. The preview feature allows you to visualize your code on various screen sizes. Additionally, the code editor offers a range of handy IDE functionalities, including color-coded classes, error detection, syntax highlighting, automatic saving, tag closure, and indentation. If you prefer to work locally, you can utilize the HubSpot CLI. For more details, refer to HubSpot's documentation or explore the advantages for developers.
File types
To create a new file, go to File > New File in the top left corner of the finder. Here you have several options to create different types of assets:
- HTML & HUBL: A custom template, developed in the code editor using HTML, CSS, and Javascript.
- Module: A custom module that can be added to a template.
- Stylesheet: A CSS file that allows you to style modules and files.
- JavaScript: A Javascript file that can be applied to modules and files.
- Markdown: Text file that uses Markdown syntax for styling
- GraphQL: Allows you to create data queries that access your HubSpot CRM and HubDB data to create personalized and data-driven experiences for your website visitors.
For specific code samples and reference documents, please visit HubSpot's developer documentation