HubSpot CMS - A Walkthrough For The Beginners
HubSpot CMS Hub is the content management system of choice for both developers and marketers. It is flexible, secure, scalable, and easy to manage for developers and at the same time, offers comprehensive, and powerful content creation tools to marketers.
This is a beginner guide to understand the different features of CMS Hub that make it unique, what are its key components and how it works.
What is HubSpot CMS?
The HubSpot CMS is a SaaS (software-as-a-service) CMS designed to help organizations build a strong web presence with a special emphasis on enabling marketers while providing flexibility to scale aligned to organizations’ growth.
HubSpot CMS is so simple and user friendly that non-technical content creators can very easily build, measure, and iterate the content independently while working within design, style, and functionality that is set by the developers.
One of the main advantages of this CMS Hub is that all of your web content can be created, managed, optimized, and analyzed in one place. It’s all right within the same platform.
The platform is well appreciated and accepted by MarTech teams because of the following reasons:
1. Site speed
Site speed is critical from both the user and SEO perspective. Slow speed is a big turn off for your prospects. CMS Hub comes with several built-in features to make your website load lightning-fast. These include automatic image compression, minified JavaScript, Combined CSS files, HTTP/2, and Page caching among others.
2. Security
To ensure a secure browsing experience and for protection from cyber threats, CMS Hub uses Global content delivery, Web application firewall, HSTS Max Age Directives, and SSL registered. It also has continuous updates and sophisticated anomaly detection.
While you will have certain restrictions when using HubSpot CMSs as compared to self-hosted CMS like not being able to alter or extend system fundamentals or access and alter database content directly. However, you don’t have to worry about anything related to plugin management, updates, hosting, scaling, or the security of the system.
How does the HubSpot CMS Work?
HubSpot has multiple features and functionalities, which offer tremendous benefits to the sales and marketing teams. In no particular order, here’s a lowdown of the same, which also give a hint of how the CMS works:
CMS Building Blocks
Themes, templates, modules, and fields are the objects that Developers will mostly work within HubSpot and it’s very important to understand the relationship between templates, modules, and pages. These are the basic building blocks of the CMS.
Themes
HubSpot theme is a combination of various developer assets, which offer a ‘marketer-friendly’ content editing experience to the users. You can use themes and the files that are within them between the environments and accounts. Here’s what you can work with using the themes feature - coded files, tools, workflows and technologies.
Templates and Modules
Templates are files that control the layout, style, and functionality of the web pages and modules are the building blocks of templates. Modules are reusable blocks of content, such as an image, form, CTA, rich text, etc.
A template will be made up of several modules and module groups. The HubSpot CMS includes common default modules like headers, rich text, images, buttons, and CTAs that you’ll use as fundamental components, but you may also want to build elements with more interesting layouts aligned to your theme and templates.
The relationship between modules and templates is one-to-many. The same module can be used several times across many different templates. The relationship between templates and pages is also one-to-many. The same template can be used to create different unique pages.
Global content
Global content is content that you want to create once and then reuse it as it is across your pages e.g your logo or site header. You can make any module into a global module but once done, it will no longer be editable from the content editors. You can only edit global content from the design tools.
Fields are the controls that content creators use to adjust the parameters passed into your themes and modules. Fields are typed, including simple types like boolean, text, URL, choice, and file, but also have more complex fields like font with styling as well as HubSpot-specific fields like links to other pieces of content or forms in the HubSpot system.
The HubL Language
HubSpot’s CMS uses the HubSpot Markup Language or HubL (pronounced “Hubble”). HubL is HubSpot’s extension of Jinjava, a templating engine based on Jinja. That said, HubL isn't a programming language. As a general rule, the HubSpot CMS is more prescriptive. If you reach the limits of what's possible with HubL, HubSpot provides APIs for creating more customized solutions. CMS Hub Enterprise accounts can leverage serverless functions enabling more sophisticated server-side programming.
HubDB
HubDB is a relational data store, which is represented as - rows, columns and cells in a table akin to a spreadsheet. The UI can be accessed from - Marketing> Files and Templates> HubDB via the main navigation. You can retrieve the data via the HubDB API or HubL markup tags and pull this in the CMS. Also, the API enables you to explore an interactive web app experience.
Website Pages and Landing Pages
Websites and landing pages are based on templates, and changes can be made locally to that page and also to the template. The functionality given to content creators is very similar for website pages and landing pages. The distinction between them is that website pages are made to present information that’s part of your website and designed to be found organically, while a landing page is generally associated with a specific marketing offer or campaign (e.g., linked from a marketing email sent to a specific list of contacts).
Blogs
Blogs in HubSpot CMS, on the other hand, have two views each—one for the listing page and one for the individual post page. A portal (the term used for an individual instance of HubSpot) can have more than one blog, but the template used for an individual post can’t be specified on a per-post basis.
Emails
The HubSpot Custom (or “classic”) email tool is built on top of the same platform as the CMS, so templates and modules can also be included in emails used with that tool. Emails built with the drag-and-drop email tool cannot use custom templates.
Other Important Tools
-
Domain Manager: Connect your website domain to HubSpot to take your site live.
-
File Manager: Store and organize assets like images, PDF resources, videos, and more.
-
Design Tools: Tools for CMS developers to create and edit templates, modules, and coded files.
-
Landing and Website Pages: Create and publish landing pages and website pages.
-
Blog: Create and publish blog posts.
-
SEO: Map your content strategy using topic clusters.
-
Marketplace: Browse and download pre-made templates and modules.
Developer File System
The core assets of a developer in HubSpot CMS are Templates, Themes, and Modules, along with the JavaScript, CSS files, and images that support them. All of these are created in a developer file system that maps to a database at the backend. You can see this file system either in the left-hand panel of the Design Manager or in folders synchronized locally using the local development tools. Within the file system, assets can refer to each other with absolute or relative paths.
The data in the files is mapped to entries in a database, that’s why access to the developer file system is through the HubSpot CLI tools rather than direct SSH or FTP access.
This differs from the approach of traditional CMSs and is of great advantage as the broken references between file or syntax errors are caught at publish time rather than at runtime. This provides extra insulation against accidental failures when live traffic is hitting a website.
The CMS will discover the templates in the file system and present them to content creators while creating new pages, so the structure of the file system is up to you.
The HubSpot Marketplace
The HubSpot Marketplace is an online directory of thousands of pre-made templates and modules that you can use to build a website in HubSpot. These assets are created by hundreds of design agencies and freelancers, both free and paid. You can find blog templates, email templates, page templates, template bundles, and standalone modules.
Ready to dive deeper into HubSpot CMS Hub? Check out the Fundamentals of CMS Hub lesson from HubSpot Academy. You may also want to connect with our HubSpot certified experts for more insights.
