Go to your website pages
From your HubSpot dashboard in your Marketing Basic, Professional, or Enterprise account, navigate to Content > Website Pages.
Create a website page
Click on Create website page in the upper right-hand corner.
Choose a template for your page
Next, select a template to use as the structure for your page. You can search through the existing templates in your account, purchase a premium template through the HubSpot marketplace, or create a new template layout.
Click the thumbnail image of the template you'd like to use for your page. In the dialog box that appears, give your new page a name, then click Create page.
Add your content to the website page
Once you've created your page, you'll be taken to the editor where you can begin adding or editing your content. To edit the content on your page, hover over a module and click to make changes to the content and styling of that module.
You can also click the box icon on the left-hand side to see all of the modules on your page. Click the module you'd like to edit and make edits in the pane on the left. Make your edits then hit Save and go to module list.
Add modules to layout (flexible columns)
If your template is using flexible columns, you'll see a plus sign icon on the left-hand side. Click this icon to see a list of available module types. Choose the module type you'd like to add to your flexible column, then drag and drop the module to add it to your page layout.
Please note: you will not see the plus sign icon on the left if your template does not have flexible columns.
Style your modules
Your modules will be styled by default based on the stylesheets that are applied to the page, but you can also apply some custom inline styles at the page level. To do this, hover over the module you'd like to style, then click the paint brush icon at the top left of the module. A pane will appear with the styling options for that particular module.
Edit your page settingsTo edit your page settings, click on the Settings tab at the top of the website page editor.
At the top of the Settings screen, you'll see a Basic Info section. This is where you'll add in the basic page information for search engines and browsers:
Below the Basic
You can enter code into either Head HTML or Footer HTML to add raw HTML snippets, embed code, or tracking
You can also password protect your page here. This option is helpful to use for the following:
- Create a page on your website just for staff. Keep sales collateral and marketing materials here, where only your team can access them.
- Create a "client-only" page on your website, post templates and client-specific materials there.
- Have a page for resellers and partners to get advanced materials ahead of a product launch.
To turn on a password for this page, check the box next to Password protect this page, and enter your password into the text field that appears.
You can also choose whether or not you want your page to expire at a certain date and time. This can be useful if you have to create a website page that has a limited offer or product you want to showcase. Check the box next to Set page expiration date and time to turn this feature on, select an expiration date, an expiration time, and where you want to redirect this page to once it expires.
You'll see a Stylesheets section, where you can edit the following:
- Domain Stylesheets - this shows you the CSS file that's set at the domain level and allows you to enable, disable, or use the default from the dropdown menu.
- Template Stylesheets - this shows you the CSS file you have attached to the template this page is using and allows you to enable, disable, or use default from the
- Page-specific Stylesheets - this shows you any CSS files that are being applied to this page only. You can click Attach a stylesheet if you want to apply a CSS file to this specific page.
For more information about how these stylesheets are attached, click here.
Within the Template settings section, you can click Select a different template if you'd like to use a different layout for your page. To edit the template that you're currently using, you can click directly on the template name to open a pop-up editor and make any changes you wish.
Click on the bar graph icon on the left-hand side to navigate to the SEO optimization section. Here you can input keywords into the text field for this particular page. Below this you'll see any to-do items -- these are actionable items for you to optimize your page.
Preview your page
Also on the left-hand side menu, you can choose the eye icon to view the preview section. From here you can do the following:
- Device preview - click on one of the icons here to view your page as if you were on a tablet, mobile phone, etc.
- Smart preview - check the box next to Preview page as specific contact and choose a contact from the dropdown menu. This will show you the page as if you were that specific visitor viewing it; this can help if you're utilizing smart content on your page.
- Shareable preview - click this button and you'll be provided with a live preview link that you can share with colleagues (even if your page isn't live yet).
Publish or schedule your page
Now that you're done editing your content, you've optimized it for search engines, and are happy with the look from your preview, select the Publish or Schedule tab.
From here, you can choose to Publish now or Schedule for later. Click the radio button under whichever option you prefer (if you choose Schedule for later, make sure you choose your schedule date and time), then click the blue button at the top-right to Schedule or Publish.