HubSpot Community Blog

Jnix284
by: Most Valuable Member | Elite Partner
Most Valuable Member | Elite Partner

Pro Tips for Setting up Your FREE HubSpot Theme

If you’re new to CMS Hub or are thinking about building your website with a FREE theme using the new Free Tools for CMS Hub, then you won’t want to miss these helpful tips to get your site up and running right the first time!

 

You might be thinking, why do I need to read this article 🤔 HubSpot has an awesome step-by-step guide included in my account, can’t I just follow that?

 

Jnix284_0-1661276044147.png

 

Yes, yes you can. And you should. 🙌 This article will walk you through the setup AND share some pro tips to make it all just a bit easier so you end up with the right theme for you!

 

Pick a Free Theme

If you’re coming from WordPress, you probably know a lot about themes, if you’re new to websites all around, a Theme is a collection of assets to make building your website easier and provides a consistent design for your site.

 

First up, browse the included HubSpot themes:

Jnix284_1-1661276301244.png

 

HubSpot includes 🔥 8 Free Themes 🔥 already installed that you can choose from, here’s what you need to know to help choose the best one for you.

 

As you read about the themes, think about which one you would pick.

 

Barricade 🚧 designed to appeal to the construction industry, great for trade professionals, fabricators, installers, remodelers, and contractors.

 

Education 👩‍🏫 this theme targets those in the ed sector, like preschools, daycares, primary schools, private schools, and higher ed, but it’s also a great template if your main focus is on training, consulting, or advising.

 

Growth 🌳 my personal favorite, this theme is a well rounded theme that’s focused on helping you grow, with all the essential elements to build a launchpad website.

 

Martech 👨‍💻 this is a great go-to theme if you’re a freelancer, starting an agency, or have a marketing/technology related business.

 

Rally 🎨 ideal for designers, agencies, and service providers in the design industry.

 

Session 💭 have a compelling story to tell? Session is great for local businesses or small business owners looking to jump start their marketing.

 

Sprout 🌱 are you an app developer, SaaS startup or focused on technology? Sprout will take your seed idea and help you grow.


Vitality 👟 ideal for the health and wellness industry, from boutique fitness studios to dieticians, trainers and more.

 

Jnix284_2-1661276442392.png

 

🛑 So, which would you pick?

 

But wait, just by looking at the thumbnails and reading the name, you could probably figure all of that out so how is this helpful?

 

By now you're probably wondering what you really need to know about choosing a theme...

 

It’s not about the design 🙈 truth is, ANY of these themes could work for any of the industries I mentioned, or didn’t mention. Once you configure your theme settings to match your brand and start adding your own content, the design takes on a new life.

 

You could choose Sprout and make it look like Vitality, design is one of the most flexible aspects that comes with using a theme.

 

It is important to note that not all themes have the same design settings, more on that later. 

 

⚠️ Here’s what you should really base your decision on: capabilities!

 

HubSpot Theme Modules

Every theme includes the same common modules that will allow you to build sections to cover most of the content you need for your website.

 

Jnix284_3-1661276707579.png

These modules are included with every theme, whether it is an included HubSpot theme, a free theme from the marketplace, or even a paid theme.

 

  • Rich Text
  • Image
  • Heading
  • Call-to-Action*
  • Form
  • Image Gallery
  • Button
  • Icon
  • Divider
  • Follow Me
  • Video
  • Meetings
  • Payment*

*requires compatibility with your HubSpot subscription tier and available features

 

Barricade Modules

Looking for a Logo Gallery or Pricing Table? Barricade is your go to theme with well-balanced module choices.

 

Jnix284_4-1661276944481.png

 

Education Modules

Need to showcase Events or an Image Gallery? Education is your go-to theme with all the basics.

 

Jnix284_5-1661276944498.png

 

Growth Modules

Looking for an Accordion, Offer Card, Pricing Card, Tabs, or Image Gallery? Growth has these and more (that’s why it’s my go-to free theme). 

 

Jnix284_6-1661276944484.png

 

 

Martech Modules

Need a Card section, logo gallery, and testimonials? Martech is a great basic theme, be careful, this has the fewest modules and least flexibility (IMO).

 

Jnix284_7-1661276944495.png

 

 

Rally Modules

Need a Feature item, Image grid, stats, and team members? Rally has these, plus not only does it have a pricing card, but it also has a price template to build your pricing page even quicker. Another go-to theme that has well-rounded functionality.

 

Jnix284_8-1661276944483.png

 

 

Session Modules

Need to build quick and easy Landing Pages? Session has a great landing page template and basic modules.

 

Jnix284_9-1661276944483.png

 

 

Sprout Modules

Looking for a Pillar Page, pricing, and stats? Sprout is definitely your theme and has templates for all the key pages you’re looking for.

 

Jnix284_10-1661276944451.png

 

 

Vitality Modules

The custom modules are limited with Vitality, but there are great templates with custom sections that can help build your pages quicker, especially if you offer classes.

 

Jnix284_11-1661276944430.png

 

What you’ll probably find, is that these themes really are a great starting point, especially if you’ve never built a website before.

 

If you're moving from WordPress or another CMS, they probably lack a feature or two that would make things easier for you in the long run.

 

This is where you have to ask yourself the most important question: What are your short-term and long-term website plans for moving to CMS Hub? 

 

Need to build a page quickly so you can capture leads or provide contact information while you build your website? These themes will help you build a few pages really quickly.

 

Need a 5-7 page website with basic capabilities? These themes check all the boxes.

 

If you need a little more than that, that is where the marketplace comes in. The next decision you'll need to make is whether you will launch with one theme and build with another later, or if you want to stick with the same theme from the start.

 

There are currently 👏 140 Free themes 👏 available in the marketplace, all with different features and capabilities. 

 

It’s going to be hard, but put your design preferences aside and try to focus on capabilities. Look at the demo sites, review the list of modules, and find the one that will help you convey your unique value proposition and brand story in the best way possible.

 

If you need more customization or have a lot of content that needs more advanced modules, it is worth taking the time to review paid themes.

 

For paid themes, you should use a similar approach: focus on features and functionality to make sure the theme has the flexibility you need to achieve the design you want.

 

Paid themes range from $1 to $1500, but compared to a custom website development project, a paid theme can save you thousands right from the start. 

 

Free or Paid, another consideration you should keep in mind is the available support. This ranges quite a bit from theme to theme and depending on you and your team's skill base, you may not need it at all or you might rely on it quite a bit.

 

That’s a whole 'nother topic for a different blog, so let’s stick with free themes and get back to the setup.

 

Theme Setup

You’ve picked your free HubSpot theme, now comes the fun part. Setting up the colors, fonts, and design elements to represent your brand!

 

Jnix284_12-1661278359582.png

 

I’m going to walk through the steps using Growth, but it’s a similar process for the included HubSpot themes available.

 

First, you’ll choose your colors and fonts, if you don’t have a design in mind, there are preselected color palettes you can choose from to make it easier, or customize your own.

 

Jnix284_13-1661278420101.png

 

You can swap out the fonts for the existing color schemes on the right side of the page.

 

Jnix284_14-1661278464748.png

 

These fonts access the Google Font library, so you can browse available fonts to choose two that work best for your brand.

 

If you’re going to choose a script or handwritten style font, make sure you select it for your accent font, the secondary font used for headings, not your main font or your website will be difficult to read.

 

Jnix284_15-1661279423588.png

 

The template view will update as you make changes so you can preview the basic design.

 

Jnix284_16-1661279448170.png

 

The next step is to add your logo - it will need to be at least 50px tall, but you also don’t want it too much wider than 200px. While you can load any of the file types listed, choosing an SVG is going to provide the best rendering of the logo across all devices.

 

Jnix284_17-1661279510027.png

 

Now you’re ready to start building pages! unless…

 

Free Themes in the HubSpot Marketplace

Whether you tested the included themes and decided you need more or you knew from the start that you wanted to look at other options, there are a few more pro tips that will help you find the right free theme.

 

Now I know I told you not to focus on design earlier, that’s mostly true with marketplace themes.

 

Some themes have very distinct designs, or even industry-specific designs, while others are more flexible and adaptive, so it is important to understand these differences so you can determine what you need most (focused design or more flexibility). 

 

It will take a bit more time to find the right theme, but it will be well worth it to go through and try a few out. Besides, they're free to download!

 

Picking the right theme in the beginning and really testing them out will save you a lot of time later. Changing a theme later requires building all new pages, there's no easy way to migrate your content from one theme to another. 😳

 

For comparison, and to help explain the varying levels of theme settings and capabilities, I’ll walk through some of the theme settings for a free theme available in the marketplace (by fellow Community Champion, @Stephanie-OG ) called Bold.

 

Bold Theme

 

Jnix284_18-1661280623202.png

 

Once you download the free theme from the marketplace and open the theme settings, you’ll immediately notice a difference.

 

Jnix284_19-1661280654156.png

 

The interface is different from the HubSpot themes and you’ll have more flexibility to control the design.

 

Here’s a look at Global Colors:

 

Jnix284_20-1661280722962.png

 

And here’s an example for setting a border style to go with the BOLD theme:

 

Jnix284_21-1661280750321.png

 

As you can see, the developer of the theme has the ability to offer you as much or as little control as they want in determining what the theme will look like and how your site will behave.

 

We won’t go through all of the settings, but I do recommend choosing 3-5 free themes that have the features you are looking for to download and test yourself.

 

This will let you explore the theme settings, build a test page, look at the templates and modules, and get a feel for what your site could look like.

 

Pick something on your current website (or ideal website) that is fairly simple and also something that is what you consider to be the most complex and try to build those elements with the theme.

 

Can you get the layout how you want it? Does it look the way you want once your theme settings are configured? Is it easy to build with?

 

There are more than 300 themes in the HubSpot Asset Marketplace 🎉 both Free and Paid, which offers you more flexibility than ever to build a website using CMS Hub!

 

With CMS Hub Free and Free Themes, what do you have to lose? Get out there and start building your website today!

 

And then come back and learn about building pages in part two. 😎

15 Comments