GETTING STARTED

Contact Support

If you purchased ProX theme and have any questions, or you're thinking about purchasing it please feel free to send us email to support@smarthubl.com and we'll get back to you ASAP.

Support availability:
Monday - Sunday
6am - 5pm EST


GETTING STARTED

Create child theme

You've installed ProX theme, great! Follow these steps to create your first page and start building your new site!

0

Theme Settings

Theme Settings Overview

Have a look at global theme settings that are available to you with ProX.


Theme Settings

Global Colors

This is where you want to add your brand colors, doing so it will be automatically applied across your whole site. Please have a look at this simple screen recording to see what does it look like when you use these options.


Theme Settings

Global Fonts & Typography

Select fonts you'd like to use globally across your site, you can choose different colors and fonts for paragraphs and headings.


Theme Settings

Call to actions

You are welcome to have three different CTA buttons across your site, plus you'll automatically have white buttons by default that you can use on image and dark backgrounds. To add buttons to your site use module Button or create a CTA from your HubSpot dashboard.

If you create a call to action button using HubSpot's CTA builder you can use these classes to apply theme's styling:

button--primary
button--secondary
button--tertiary

Watch this simple screen recording to see how you can style those using Call to actions theme options.


Theme settings

Forms

Style input fields, form title, labels and hints.


Theme settings

Layout

This is where you define how wide your site will be and set a padding between each section.


Theme settings

Landing pages

Choose background color you'd like to use for header and footer on landing pages.


Theme settings

Blog

You can set a custom background for listing page, tweak post page information and so much more.

Please have a look at simple screen recording to see what you can do to style your awesome blog.


Global header

Set up logo

Add two versions of your logo to make the most out of ProX theme. White logo will be used on templates and pages with dark background and the colored logo will be used on light backgrounds.


Global header

Settings



When your visitors start scrolling the pages on your website, with the sticky menu they will have easy access to your main navigation menu anywhere on the page. Please watch this simple screen recording to see what options you have to style your sticky menu.


Global header

Top bar

This is optional feature that comes with ProX theme. This is "section" that will appear on the top of your pages and can contain some contact information or whatever you like and site search field.

If you don't need this on your pages but want to have site search you can choose to display it next to menu items.


Global header

Set up different header style

Do you want to have transparent header on one of your pages and white header on the all other pages? Please have a look at this simple screen recording to see how you can achieve this. 


This is a global module, which means when you style your footer it will be applied on all of your pages. You can have up to five columns and you're welcome to add menu items or rich text inside each column.


Module

Accordion


Banner is top section of your page and we've added a TON of options for you here.

Type of content you could add to your banner is:

  • Text with animations
  • Static text
  • Call to action buttons

Background type of banner:

  • Image background
  • Video background
  • If you want to have slider in your banner refer to Slider module

Please watch this simple screen recording to see how you can make an awesome banner!



Module

Button


Module

Client logos


Module

Counter


Module

CTA section + image


Module

Heading with subheading


Module

Icon & text


Module

Image & text card


Module

Image with decorations


Module

Photo grid


Module

Pricing


Module

Quotes


Module

Recent posts


Module

Section styler

This is a super smart module that you'll want to use to add:

  • Overlay to image backgrounds
  • Apply parallax effect
  • Add a custom ID to some section that you can then link to from your CTA

Please have a look at this simple screen recording to see how you can use this module on your pages.


Module

Simple quote


Module

Simple CTA section


Module

Slider hero


Module

Tabs - horizontal


Module

Team


Module

Video background section

You can use this module to add awesome video background section on any page, anywhere you like! Best practice to use videos as backgrounds is to make a MP4 file and upload it to Files in your HubSpot account. Make sure to use files that are not bigger than 5 to 10 MB.

Please watch this simple screen recording to see how to use this module to add amazing video background sections.