Navigate to Design Manager
In your HubSpot Marketing Basic, Professional, or Enterprise account, navigate to Content > Design Manager.
Create a new coded file
Select the Coded Files folder and click New coded file.
Choose coded file type
Choose the type of file you'd like to create: Page, Email, Blog, or System. Your choice not only determines which master folder the file will be saved in, but also which HubL tokens are required.
Name and save the file
Enter a file name with a .html file extension and click Save.
Code your template
Next, you will need to write the HTML for your page or email template. Your HubSpot code editor auto-indents, highlights your HTML syntax, and closes your tags for you.
Click Publish Changes to publish the template or HTML file.
You will be prompted to choose whether or not you'd like this template to be available for selection by content creators. Unchecking Make this template available for new content allows you to save an HTML file without HubSpot's required template tags, but it also won't be available as an option for content creators. This is useful, for example, if you're creating a global section to include in another template file.
Add the required HubL tags
Once you have your structural HTML written, if you were to try to publish your HTML coded template, you would see an error message indicating that your code is missing required HubL tags. HubL tags connect your code to HubSpot's settings and content editor. You can learn about the required template variables here and HubL module tags here.
Clone to file
An alternative to coding from scratch is cloning one of HubSpot's templates to file. Cloning a template to file gives you access to a template's HTML/HubL and is a great way to reverse engineer a HubSpot template that you have constructed. To clone a template to file, choose Actions > Clone to file in the upper left-hand corner of your template in the design manager. Next, name the file with a .html extension.