TUTORIAL: How to use the HubSpot CMS (Content Management System)

Last Modified: 07/10/2012
Author: Molly Wolfberg
Website content that is hosted at HubSpot can be created and/or edited using the HubSpot CMS (Content Management System). The CMS is a tool that makes editing your website fast and easy, without needing to rely on a webmaster or an outside web development firm.

What is this Exercise For?

In this exercise, you will learn how to create a page within the HubSpot CMS. But that won't be the end of your learning! At the end of this exercise, you'll see a series of links that will take you to pages where you can learn how to do specific things within the CMS, such as modifying the page layout or adding a photo slideshow.

So let's get started! Please note that in this exercise, the page we have you create will not be visible to the outside world, so you can feel free to play around and experiment with your new website page.

1. Go to Your Website Pages Manager

You can find the Website Pages manager under Page Manager.

User-added image

2. Add a New Website Page

At the top of the screen, click the Add new page button.

User-added image

3. Edit the Page Properties

The first thing you'll do is edit the page properties. You'll learn more about how to effectively search engine optimize each of your website pages later, so don't worry about this now. Just remember to uncheck Viewable by public so you can make edits without the outside world being able to see this page. Also make sure Show in Menu is unchecked so that this page does not appear in your site's top navigation. Then click Save Changes at the bottom of the page.

User-added image

4. Go to Your New Webpage

Scroll to the top of the page and click View Page.

User-added image


5. Add a Content Module

Your new page is currently blank, so let's add a new content module. Click on the orange Add Module button that's right above the big blank section of the page.

User-added image


In the popup that appears next, click Content.

User-added image


6. Edit the Header of your Content Module

To edit the header of your content module, simple click on the [Click to edit the title] text. Enter the text you want, and then click anywhere in the whitespace of your page to save your new header.

User-added image


7. Edit the Content of your Content Module

To edit the content of the content module, click on the Edit button on that module.

User-added image


8. Learn the Functions of the Content Editor Toolbar

Here is a complete guide to each of the buttons you see within your content module toolbar:

User-added image

9. Reorder Modules on Your Page

You can move the modules around on your page; this is very useful when organizing the content in your sidebars. First, click Reorder Modules which you'll find near the top of your page.

User-added image


A reorder modules popup will appear. To reorder a particular module, click on that module and drag it to the pane and location within that pane where you would like that module to appear. Then click Save Changes.

User-added image

Learn how to do more with the HubSpot CMS:

Adding Content:


Editing Pages:


Getting Creative:

Need help with a HubSpot CMS redesign? Contact a HubSpot Service Marketplace Provider to redesign your HubSpot CMS website for you.
Was the content and structure of this article helpful? (If you are running into an issue in your account or have a specific question about your setup, please contact our Support team.)  Yes  No