Meditrust Theme Documentation

1. Creating a Child Theme

By creating a child theme of the Meditrust Marketplace theme, you can safely apply one-off customizations such as custom CSS, JavaScript, or modules—while still receiving future updates from the HubSpot Marketplace without losing your changes.

A child theme allows you to extend Meditrust’s functionality while keeping the core theme intact and up to date.

Child Theme Files

When creating a child theme from Meditrust in the Design Manager, the following files will be automatically added:

• theme.json – Includes the required extends property that links the child theme to the Meditrust parent theme.

• child.css and child.js – Empty CSS and JavaScript files where you can add custom styles and scripts.
  These files only affect the child theme and can be renamed in the Advanced Options during setup.

How to Create a Child Theme

1. In your HubSpot account, navigate to Content → Design Tools.

2. In the left sidebar, go to @marketplace → Meditrust.

3. Right-click on the Meditrust theme and select Create child theme.

4. Enter a name for your child theme, choose the destination folder, and click Create Child Theme.

5. Once the process is complete, a confirmation message will appear indicating that your child theme is ready to use. Click Close to continue.

2. Theme Settings

To customize your theme's styling, including font, colors, and spacing, navigate to your theme settings. Any styles edited here will apply to all pages.

For any additional customization options needed in theme settings. Contact us at

Follow these steps:

• Click the settings icon in the main navigation bar of your HubSpot account.
• In the left sidebar menu, navigate to Content > Themes.
• Select your Meditrust theme.

Global Colors

Here, you can customize and establish the colors that will represent your brand.

Global Fonts

Here, you can set up the typography for your site. You can choose the typography settings for Primary Font (Body Texts) & Secondary Font (Headings). You can choose the Primary font from any Google Fonts and Its Color in the Primary font settings. You can choose the Secondary font from any Google Fonts and Its Color in the Secondary font settings.

Spacing

You can customize the container width and vertical and horizontal Spacing globally here.

Text

In this theme setting, You can customize the Typography settings of Body texts, Headings (H1- H6) and Link color & Link Hover color throughout the theme. In the Body Text Setting, You are provided with selecting the Google font of your need and font size, color, line height, font weight, and a boolean option to change the Font size on mobile if needed. SImilarly, you have the same options in Headings H1-H6.

Buttons

In this theme setting, You can define the buttons' styles.

Forms

You can customize the form styling inside these settings. You can customize the Form background color, Field background color, Label color etc here.

Tables

Here you can define the styles and look of the tables used in the website.

Website Header

In the Website Header Settings, You can choose the Background color of the Megamenu Header, Text Color, Menu link color and It’s hover state color, Menu link dropdown icon color, Child menu Background Color, Child menu link color, Child Menu Item Link hover state color and it’s Background color on hover state.

Website Footer

Here you can define the Global style of the footer of the website.

3. Page Templates

When you are creating a new page in HubSpot, you will have the option to choose from the available templates.

To access the available templates when creating a page in HubSpot, follow these steps:

• Log in to your HubSpot account and navigate to the Content menu.
• Find and click on the Website Pages or Landing Pages option.
• Click on the Create button to start creating a new page.
• In the page creation menu, you will find a section where you can select a template.
  
  
  

4. Blog Templates

Blog Listing Template

• Click the settings icon in the main navigation bar.
• In the left sidebar menu, navigate to Content > Blog.
• In the Current View section, click the first dropdown menu and select the blog you want to edit.

In the Blog Listing section, click the Actions dropdown menu to manage your blog post template:

• Select Change template to choose a different template. On the next screen screen scroll down a click Advanced options then select Use different template On the theme selection screen, choose Meditrust Blog Listing Page, then select your Blog Listing then click Use Template.
  
  

   

  Blog Post Template

• Click the settings icon in the main navigation bar.
• In the left sidebar menu, navigate to Content > Blog.
• In the Current View section, click the first dropdown menu and select a blog and select the blg you want to edit.

In the Blog Post section, click the Actions dropdown menu to manage your blog post template:

• Select Change template to choose a different template. On the theme selection screen, select Meditrust , then select your Blog Post template then click Done. In the bottom left of your template settings, click Save.

6. Modules

Apart from the theme settings, we provide advanced customization and content updation options in custom & global modules.

For any additional custom modules or customization needed in modules in the Azen theme. Contact us at resource@straightgrowth.com

Module Content Updation

Inside the edit page of a particular page, You can just click on a module and click on the content tab to update the Text, images, and other elements of the module.

Module Style Updation

Inside the edit page of a particular page, You can just click on a module and click on the Styles tab to update the styles of each element included in the module such as fonts, color, Background, etc.

Get Free Support

Need help setting up the module or customising it further?
We offer FREE 1-hour support for all our HubSpot modules.

Mail Us: resource@straightgrowth.com

Visit Website: https://www.straightgrowth.com/

👉 Book Your Free Support Session with Straight Growth