Table of Contents

    Download resource

    A complete guide to

    Using HubSpot as a CMS

    If you're considering HubSpot for your next website, this complete guide will walk you through everything you need to know about creating a website using the HubSpot CMS.

    hubspot-cms-websites
    decorative icon teal

    Why use HubSpot CMS

    HubSpot CMS (content management system), part of Content Hub, lets you invest your marketing budget where it counts. And when it comes to your website, that means focusing on creating user-friendly experiences that boost your sales pipeline, rather than dealing with complex server setups and software upkeep.

    HubSpot CMS takes care of the technical stuff, but it's much more than a basic CMS. It's an incredibly powerful platform packed with features to help you succeed in today's competitive landscape.

    With HubSpot, your website is secured and reliably hosted in the background. It provides one of the most intuitive editing experiences for easy website maintenance.

    What's more, it comes with many standard, built-in features that are only available as plugins or add-ons on other content management systems. This includes:

    • Free SSL certification
    • Flexible templates and reusable modules
    • Code minification
    • Image optimisation
    • Personalised content
    • Form builder
    • Custom reporting
    • A/B and muli-variant testing
    • One-to-one technical support

    Read more: Benefits of the HubSpot CMS for B2B demand generation

    decorative icon gold

    When to use HubSpot CMS

    Many businesses are adopting HubSpot CMS for numerous reasons that set it apart from other content management systems.

    Easy website updates

    HubSpot CMS features an intuitive drag-and-drop editor that makes it easy for non-technical users to create and manage web content. This means you can update your website without relying heavily on developers.

    Streamlined tech stack

    HubSpot CMS seamlessly combines with HubSpot's marketing automation and customer relationship management (CRM) tools. This combination streamlines marketing efforts by allowing you to manage content, track contacts, and analyse data in one platform. This means you don't have to jump between platforms to get things done and consolidate your data to paint a full picture of your marketing success.

    Managed website hosting

    HubSpot CMS provides managed hosting, so you don't have to worry about the technical aspects of hosting your website. HubSpot takes care of server management, ensuring your website remains up and running. You don't have to worry about server configurations, maintenance, or the complexities of hosting infrastructure.

    decorative icon gold

    When to avoid HubSpot CMS

    HubSpot CMS is a good fit for most B2B websites, but there are cases where it may not meet specific requirements.

    Large eCommerce stores

    using hubspot as a cms

    Although HubSpot offers a product database and payment gateway, it's not primarily designed for eCommerce purposes. If you're aiming to design a typical eCommerce store with numerous product categories, upsells, related products, and a conventional checkout experience, we'd advise exploring dedicated eCommerce CMS solutions.

    To make the most of HubSpot's strengths in areas like CRM and marketing automation, consider employing a dedicated eCommerce CMS, like Shopify, and then integrating it with HubSpot. This way, you can harness the full potential of both platforms for your business needs.

    Marketplaces

    etsy's marketplace website design

    Similar to eCommerce stores, HubSpot isn't tailored to the specific needs of online marketplaces that facilitate transactions between multiple buyers and sellers. Building and managing online marketplaces demands a specialised solution that's purpose-built to cater to the unique requirements and complexities of such platforms.

    If you're planning to create an online marketplace, we'd recommend looking for a dedicated marketplace platform or software solution. These are built specifically to support and streamline the intricate operations involved in connecting buyers and sellers.

    Communities and forums

    Stack Overflow's community forum website design

    HubSpot lacks the standard features necessary for building, nurturing, and expanding an online community. Communities and forums are unique websites that involve member logins, posting, commenting, and interactive engagement. HubSpot doesn't inherently support this functionality.

    For businesses particularly committed to using HubSpot and already have it integrated into their tech stack, there's an add-on called Cohortium. This enables community management within the HubSpot platform.

    However, larger and more established dedicated solutions for online community management typically offer a wider array of functionality and receive regular updates. As a result, they're more suitable choices for creating and maintaining robust online communities.

    decorative icon green

    Choosing your HubSpot CMS subscription level

    HubSpot has four tiers of HubSpot CMS, each tier offering a different level of functionality.

    1. HubSpot CMS Free

    HubSpot CMS Hub Free is aimed at start-ups and individuals who want to explore digital marketing and create their own websites to grow their businesses. Although it's free, it still offers some of the benefits of higher tiers, such as:

    • Premium hosting
    • Website drag-and-drop editor
    • Security monitoring and threat detection
    • SSL certificate
    • Website analytics
    • Live chat 

    2. HubSpot CMS Starter

    HubSpot CMS Starter is a good option for smaller businesses on a budget that need a little more flexibility from their website.

    It offers more freedom to tailor the look of your website to suit your brand, featuring pre-made templates to get you started. As well as all of the CMS Free features, you get access to:

    • Advanced analytics
    • Payments
    • Calls-to-action
    • Personalisation
    • URL mappings
    • Technical support

    3. HubSpot CMS Professional

    HubSpot CMS Pro is the most popular choice, and for good reason. It offers all the functionality most businesses need from a website.

    Most small-medium enterprises (SMEs) find the price point just right for the level of functionality on offer. Key features include:

    • HubDB (HubSpot's powerful relational database)
    • Custom reporting
    • Chatbots
    • Advanced multi-lingual options 
    • Content staging (sandbox environment)
    • Products
    • Video hosting and management
    • A/B Testing
    • Smart content 

    4. HubSpot CMS Enterprise

    HubSpot’s premium-level CMS, Enterprise, offers you everything you could ever want from a CMS. It boasts all the functionality of CMS Pro, plus some additional features that would usually require expensive, bespoke solutions to create. This includes:

    • Adaptive page testing
    • Content approvals
    • Custom web apps
    • Membership areas
    • Reverse proxy configuration
    • Content partitioning 
    decorative-icon-teal

    Planning your route into HubSpot CMS

    If you’re looking to move your website to HubSpot CMS, there are three main approaches you can take to get started on the platform. Each approach is different and the best one for you will depend on your requirements.

    Option 1: HubSpot migration

    HubSpot's website migration service provides a quick, low-cost route to the HubSpot Content Hub. Depending on your website's complexity, the migration can take as little as 2-6 weeks.

    Migration is ideal if you wish to retain your current site's navigation and user experience while benefiting from HubSpot Content Hub. Moreover, since the infrastructure is ready, you won't have additional maintenance or management concerns.

    Option 2: HubSpot themes

    For cost-effective entry to HubSpot CMS, consider starting with a marketplace theme. HubSpot offers a variety of themes created by different partners, providing options to suit your preferences.

    However, be cautious. Customising these themes can be complex and time-consuming. You might also find it challenging to adapt them to your exact design preferences. Additionally, you may find themes limit your ability to tailor the user experience to your ideal B2B buyers – a crucial aspect of B2B demand generation.

    Option 3: Bespoke build

    Custom website builds offer complete control over your site, allowing you to tailor the user experience and optimise performance. However, if you lack an in-house team, you'll need to partner with a HubSpot website developer. Their expertise in website strategy, copy, design, user experience, and development will help to enhance your user experience and convert visitors into leads.

    Keep in mind that custom builds are the priciest and most time-consuming option for HubSpot CMS. Costs vary and projects typically take 2-12 months to complete. 

    Getting started with the HubSpot CMS: What’s the right route for you?

    decorative icon orange

    HubSpot website design process

    If you're looking to create a new, bespoke, website using HubSpot CMS, we recommend using the following process.

    These steps lay the groundwork for a website that not only looks good but also functions effectively, engages your target audience, and supports your business objectives. Each step contributes to the overall success of your website.

    Step 1: Strategy

    The right website strategy provides the foundation for an effective website that serves your buyers' needs and generates demand.

    By creating a website strategy, you ensure that each step you take aligns with your overall website goals. It helps you create a website that enables buyers to discover you, find the content that's relevant to them, and convert when they're ready.

    example of a sitemap for website design

    Supply Pilot's new website sitemap

    Step 2: Branding

    A strong and consistent brand presence on your website is vital for resonating with your audience. Your brand conveys your company's identity, values, and unique selling points. Effective branding ensures that your website reflects your business accurately and resonates with your target audience.

    wavenet's brand guidelines document

    Wavenet's brand guidelines document 

    Step 3: Content

    Content is at the heart of your website. It's how you convey your message, deliver value, and share information about your solutions. Writing effective web content for online audiences is crucial. You can't simply copy and paste text from your sales brochure onto your website. Your website's copy should be easy to scan, understand, and harmonise with your brand and website design.

    A draft website page in Microsoft Word

    Content for one of our website pages

    Step 4: Wireframe

    Creating a wireframe is like designing the architectural layout of your website. It's essential because it defines the structure, organisation of content, and user experience.

    A well-thought-out wireframe is the foundation of a logical, intuitive, and user-friendly website. It helps visitors navigate your site easily, find information effortlessly, and understand the flow of content. Without a clear wireframe, your website's design will lack cohesion.

    an example of a website wireframe

    Mobile wireframe example from Looka.com

    Step 5: Website Design

    Design is the essence of your website's first impression. It should mirror your brand, weaving elements throughout and enhancing the user experience. A captivating and user-friendly design is key to keeping visitors engaged and on your site.

    A series of web page designs

    Acre Security's website design in Figma

    Step 6: Development

    Development brings your website's design to life. HubSpot CMS developers translate your design and functionality concepts into a fully functional website, ensuring it operates seamlessly and efficiently.

    When building a website in HubSpot, this phase typically consists of developing the website theme, templates and modules, interactive elements, and HubDB-driven content.

    a screenshot of hubspot's design tools

    Screenshot inside HubSpot design tools

    decorative-icon-yellow-white

    Our top tips for designing a website in HubSpot

    The website creation process is pretty similar, no matter which CMS you choose. However, to make the process as smooth as possible and ensure the final product meets your expectations, we recommend following these tips.

    Tip 1: Consider website editing restrictions

    HubSpot's known for its user-friendly editing tools that empower marketers to enhance their websites. Yet, when managing a large team, it's crucial to set boundaries on what people can edit. Certain parts of the website should remain rigid to maintain consistent branding and messaging. For example, use a dropdown select for colour options, rather than a colour-picker that enables anything to be selected.

    example of restricting colour options on a hubspot website

    Example: Using fixed dropdown colour options instead of an open colour picker

    Tip 2: Create a typography page

    Create a typography reference page that showcases your typography hierarchy, including headings, text styles, buttons, and form inputs. This consolidated page serves as a visual guide to ensure uniform typography throughout your website. It's especially valuable for developers, helping them align the typography with the design's intent.

    Additionally, including form fields is crucial as they're often overlooked in designs. This can lead to subpar form user experiences and reduce conversion rates.

    example of a website typography page

    Example: Typography page with different heading and text styles

    Tip 3: Keep blog and resources separate

    HubSpot's blog functionality is primarily designed for presenting written content in a blog format, displayed on a page as part of a blog listing. Given this specific purpose, a 'blog' is not the most efficient way to manage resources, especially when dealing with content in various formats.

    We recommend keeping your blogs in HubSpot's blog module and utilising HubDB to manage your resources more effectively.

    screenshot of HubSpot's resources library that's built using HubDB

    Example: HubSpot's resources library, built using HubDB

    decorative icon green

    How much does a HubSpot website cost

    With so many routes into HubSpot CMS, it's difficult to put a universal price on a new website. Ultimately, it'll cost whatever you're willing to spend.

    However, when thinking about cost, there are some standard things to consider.

    • HubSpot Content Hub cost: The price of HubSpot Content Hub will depend on the tier you require - free, starter, professional, or enterprise.
    • Domain name: As with any website, you'll require a domain name. You can obtain a domain through free and paid services.
    • DNS management: If you're creating a website with a new domain, you may need to add a new DNS zone. This may incur a small cost.
    • Marketplace themes: You must pay to use some HubSpot marketplace themes.
    • Bespoke website creation: Working with a HubSpot partner to create a custom website will vary in cost, based on your needs and the agency's fees.

    Typical HubSpot website costs

    • HubSpot CMS Pro (most popular): £315/mo
    • Domain name: £0.99 - £10.00/yr
    • Bespoke website build: £10,000 - £100,000 (heavily dependent on requirements)
    decorative-icon-green

    Selecting a HubSpot website design partner

    The most common route into HubSpot CMS is to create a bespoke website, and this means getting help from a HubSpot website design agency. When selecting a partner to work with, here are a few things to look at to that will help you validate their credentials:

    1. Review the HubSpot Inspire Gallery. Check the agency's work in the HubSpot Inspire Gallery – a collection of HubSpot CMS websites. It's a reliable reference for assessing the quality of their work.
    2. Look for relevant HubSpot accreditations. These are hard to earn and indicate a high level of expertise. Pay special attention to the HubSpot CMS Advanced Accreditation for websites.
    3. Check out their reviews. Visit the HubSpot Partner Directory to find customer reviews. Don't just count them; focus on reviews related to website projects to gauge their performance.
    4. Assess portfolio and results. Visit the agency's website to review their HubSpot CMS projects. Agencies that can showcase measurable results from these websites earn bonus points.
    5. Check relevant HubSpot Impact Award wins. Has the agency won any HubSpot Impact Awards, especially those related to website results? If they've won awards in the past, you can be fairly confident they know how to create impactful websites.

    Get help with HubSpot website design

    We've specialised in website development on HubSpot since its release, and created over 120 HubSpot websites. We're the go-to agency for exceptional HubSpot websites that drive growth. 

    hubspot-cms-websites