HubSpot Magento Two-way Syncing Addon is an extension developed for our HubSpot Magento Integration that lets you sync your contacts between HubSpot CRM and Magento store bidirectionally.

If you install this addon, you can sync your contacts from HubSpot CRM to your Magento store or vice versa

For the installation process, visit the basic steps to upload or move plugins in the app/code/Makewebbetter/Package. Then you’ll have to run the Magento commands for the installation of the plugin on your Magento server.

Once you install the HubSpot Magento Two-way Syncing addon, you can start syncing your contacts bidirectionally from HubSpot CRM to Magento or vice versa.

All the HubSpot Magento Integration Plugin’s default properties (HubSpot Contact Properties & properties created through our HubSpot Extension) data will be imported through this addon on your Magento store.

In the Configuration, you can map the HubSpot Properties to the Magento Customer Attributes which can either be default Magento customer attributes or the custom attributes that you want the details to be saved.

Moreover, if you require any further properties to be synced from Magento to HubSpot according to your business needs, those can also be managed as custom properties.

You can go to the Customer Import and Syncing section to configure the settings of this addon from your Magento configuration.

In this section, you’ll find these settings:

• Enable HubSpot Customer Import: Enable/Disable the plugin.
• Select Store for Creating New Customer: Select the store you want to create new customers in.
• Required Attributes for Creating New Customer: Select the attributes or properties you want to create in your HubSpot portal.
  
  ( * Note: Email, First Name and Last name should be selected to create customers on Magento since these are the required attributes.)
• Field Mapping: Map the plugin’s properties with HubSpot’s contact properties.

After configuring the settings, click on the Save Config button to save your changes.

To view your synced customers in Magento’s backend, you can navigate to Customers > All Customers and you’ll see all the customers synced from either platform.

To view all the synchronized contacts in HubSpot CRM, go to your HubSpot portal and navigate to Contacts > Contacts and you’ll see the synced contacts data over there.

Academia is a free HubSpot theme to promote your educational academy or create our school website. It is designed to create attractive educational and e-learning websites. This theme for education websites has these remarkable features:

1. 27 Drag and drop modules  
2. 20 Ready to use templates & 11 System pages   
3. Zero coding lightweight theme with high speed 
4. Responsive HubSpot theme with a mobile-first approach 

Note: For our Academia Free HubSpot theme, we will provide free personalized 15m LIVE theme setup and support. Let us know if any modules are missing, and we can assist you with that as well. Simply get in touch with us.

These assets can be used to create visually appealing web pages using the HubSpot CMS. Let’s get this party started.

1. Modules: They are interchangeable objects that add various functionality to your page. You can simply drag and drop these on your page and start editing. There are 27 modules in the Academia HubSpot theme.
2. Templates: Templates are sample layouts for your ease in the Academia HubSpot theme. You can use these templates and replace the images and text according to your organization. There are 20 templates and 11 system pages in the Academia HubSpot theme.

Global Theme Settings: Any global setting on your website pages changes all the asses linked to it. Global content will be applied all over your website universally. Similarly, the settings remain unchanged for every page using that module with the global modules.

For creating a page in your HubSpot CMS using our Academia theme, follow these steps:

• Log in to your HubSpot account.  
• Go to Marketing > Website > Website Pages

• Locate Create option on the top right corner > Select the type of page you want to create from Website Page or Landing Page

• Name the page > Select Academia theme > Select desired template from the dropdown > Press Select Template

• Add meta description, add or remove modules, and other details before publishing the page. A page title is necessary before publishing any page.

Any customization done in the global settings will be applied to all Pages using those modules. It is a good option to keep your customizations constant across Collections and Default Pages.

To edit global styles, follow these steps:

• Locate the Edit Page Panel on the left side of the screen. Three options are available on this panel. Namely, Add, Contents, and Design.

In the academia theme, there are 2 global modules:

1. Website Header
2. Website Footer 

• Once you create a page, you can start editing them. There are 3 sections on the left panel named Add, Content, and Design. 
• Click on Content > View Website Header with navigation module and Footer at the bottom.
• Now you can edit the one you want first.

• From the Page Editor > Go to Content > Go to Header with navigation

• A Pop up will appear > Click Open in the global content editor

• Change the header according to your requirements > Publish the changes.

• From the Page Editor > Go to Content > Go to Footer

• A Pop up will appear > Click Open in the global content editor

• Change the header according to your requirements > Publish the changes.

Note: Publishing any change in the website header and footer will change all your website assets.

Changing blog templates allows you to decide your blog pages’ look and feel. To do so:

• From your HubSpot account > Go to settings > On the left panel, locate and go to Website option > Select Blog > Select Template. 

• Select the edit page option and continue editing if you want to start editing this blog page.  

To change system templates,   

• From your HubSpot account > Go to settings > On the left panel, locate and go to the Website option > Select Pages

• Select System Pages > Choose the Academia system page type from the dropdown 
• Save the changes > You will have applied system templates on your website.

You can edit the theme settings through the following:

• Go to Marketing > Website > Website Pages > Choose any page to edit or create one
• Go to Edit Page Panel on the left > Design > Edit Theme Settings

Here you have the following options, under which you can make a set of changes.

You can make changes in the Global Colors, Global Fonts, and typography. Press Apply Changes after editing these.  

You can edit the header, footer, spacing, corners, buttons, tables, image performance, and forms. Press Apply Changes after editing these.

Under the blog setting, you can edit the sidebar of the blog post. Press Apply Changes after editing these. 

Under system page settings, you can edit the Error 404, Error 500, Password Prompt, Reset Password Request, and Email Unsubscribe. Press Apply Changes after editing these.

Under the scroll to top option, you can edit the Icon fill color, Icon background color, and Icon corners. Press Apply Changes after editing it. 

There are 6 re-usable sections in the Academia HubSpot theme. For implementing re-usable sections all you need to do is 

• Hover over any of the sections > locate and click the plus icon> Choose from the list of reusable sections > Publish changes.

You can show and hide FAQs or vast sections of text, adjust their height for mobile, tablet, and desktop appearances, and modify the background color, heading, border, and shadow.

Here you have the banner layout choice, banner content, banner image, banner breadcrumb choice, Enable reverse order (mobile), Background overlay, Banner content alignment, Banner inner spacing, and content color.  

Under the blog grid module, you can display the list of blogs on the page. You can edit the content and style select the bogs to display, title color, and button of the card.

You can place a button anywhere on your page using the button module. You can set the border radius, enable/disable box-shadow, alter the font color, and more to adjust the look of this button, enable a primary and secondary button and customize its text and add URLs.

If you want to edit the blog listing details, you need to go to Settings > Website > Blog > Select Academia Theme in Current View > Template > Set the number of posts per listing page > Save 

The Counter module adds a multi-column section to your page. You can use it to display numbers like the number of scholars you’ve assisted, the number of schools you’ve served, and the NGOs through which you provide free education. You can edit the icon image, counter text display condition, and counter spacing. 

The footer copyright module allows you to display your copyright text on the bottom of the page along with terms and conditions, and privacy policy page links. 

The footer navigation module is only for the footer menu where you can show a few quick links to your website.

The form module allows you to include forms on the page. You can select any form from the list of existing forms or create a new one too along with Recaptcha.

Header control module enables adding search, language switcher, button links, button type, button style, button text, add editing box-shadow, select display mode, and placeholder text on the website header.

Header toggler is left-aligned by default. However, you can choose an icon or image for the toggle open and close option. You can further edit image size, maximum size, image loading, etc. 

Under the icon box, you have the edit column count choice, icon or image selection, editable icon box, icon styling, content, icon box spacing, and card background.

The image module allows adding images anywhere on the page. You can edit the image size, set alt text, image loading, image alignment, and image border-radius.  

Under the listing layout choice module you can choose the listing layout, column count choice, enable different tabs and descriptions for each, edit listing content, box-shadow, background color, enable overwrite icon color, title color, border-radius, content color, alignment, grid button, and edit tag text and background.

You can enable the custom logo under the logo module. The logo is a very crucial aspect of your educational website.

Use the map module to display your location on the map for the visitors. Under the map module, you can edit the map API, pointer detail, map JSON, map zoom level center latitude and longitude, enable overwriting corners and height.

Add a menu bar on your webpage using the menu module. Select a menu from the existing option or create a new one. You can also decide the maximum levels that can be expanded from the tree menu. Other options include adding texts, background, border, etc.

The notice module allows you to display any kind of notice on your website page. As an educational website, you will need to display multiple notices for students, faculty members, and visitors. Under the notice module, you can add multiple notice cards and edit their content like title, links, date, description, etc.    

Our partner module helps you to show your collaborators or sponsors on your web page. There is layout choice (slider & listing), enable description, slider settings, navigation, alignment, corner, inner spacing, and background color.   

Using the team module you can display the team members on your webpage. With the layout choice, you can select the layout. You can also add or remove team members along with the image, image size, designation, name, and text.

Portfolio tabs allow you to add portfolios to your webpage. Select layout, enable or disable tabs, add or remove tabs, enable/disable item link, border radius, background, add mini title, and enable/disable box-shadow. 

Through the sidebar module, you can edit the primary and secondary buttons, icon boxes, and title tags.

The social follow module allows you to add your social media links along with an icon, icon color, size, background, corner spacing, and alignment.

The spacer module allows you to add space on your web page and add a space between modules etc. You can set the background color, height for desktop, mobile, and tablet respectively.    

For displaying testimonials on your landing page, you can use this module. You have the testimonial layout choice, option to hide/show social icons, enable/disable slider dots, navigation, and change navigation icon.    

The title content module allows adding content anywhere on your website page. You can edit the title content on your website page along with adding a subtitle, primary CTA, and secondary CTA.

The video popup module is for adding a video to your landing page or website page. You can edit the video icon or image, add a video link, enable/disable overlay, and corners. 

There are 20 templates in the Academia HubSpot theme. You can simply select the template you want to use and edit the content, title, logos, and modules

Charity is a free HubSpot theme for all the charitable trusts and organizations serving people selflessly. Using this HubSpot theme, you can easily create a high-speed, responsive, and cleanly designed website to raise awareness online. Its major features include:   

1. 27 Drag and drop modules and 16 reusable sections
2. DIY theme settings with no coding requirements  
3. 11 Ready to use templates & 7 System pages   
4. Multi-Language support 
5. Lightweight theme with a mobile-first approach 

Note: We provide free personalized 15m LIVE theme setup and support for our Charity HubSpot theme. Also, please let us know if any modules are missing. We would be happy to assist you. Please do not hesitate to contact us.

Schedule a No-Cost Meeting

Using the HubSpot CMS, You can leverage all Charity theme assets to build a visually appealing website for your non-profit organization. Let’s get this party going.

1. Modules: The Charity theme has 27 modules. The modules are interchangeable objects adding functionality to your website pages. They can be dragged and dropped anywhere on the page and edited according to your needs.
2. Templates: There are 11 templates and 7 system pages in the Charity theme that you can use as sample layouts. You can replace images, logos and edit the content on these templates for your website.

Global Theme Settings: Global settings on your website pages alter all the assets on your website. For example, if you make changes in any global module, those changes will be reflected in every page using that module.

Follow these steps to create pages in the Charity HubSpot theme:

• Log in to your HubSpot account > Go to Marketing > Website > Website Pages

• Locate and press Create button on the top right corner > Select one from the Website Page, Landing Page, or blog.

• Give a name to the page > Select Charity theme > Choose & Select a template from the dropdown

• Add or remove modules, meta descriptions, and other details before publishing the page. A page title is mandatory for publishing any page.

Edit global styles to keep uniformity across pages on your website. To edit global styles, follow these steps:

• From Edit Page Panel on the left side of the screen. Add, Contents, and Design options are available.

• Go to Design > Click ‘Edit Theme Settings’. This will take you to theme settings.
• You can now change the global colors, spacing, website header,  buttons, fonts, website footer, global fonts, typography, tables, blog settings, and system pages. 

In the Charity theme, there are 2 global modules:

1. Website Header
2. Website Footer 

You can edit global modules after creating a page. From the left panel go to Content. Website Header with navigation module and Footer at the bottom are global modules ready for editing.

• From the Page Editor > Go to Content > Go to Header with navigation
• A Pop up will appear > Click Open in the global content editor
• Change the header according to your requirements > Publish the changes.  

• From the Page Editor > Go to Content > Go to Footer
• A Pop up will appear > Click Open in the global content editor
• Change the header according to your requirements > Publish the changes.

Note: Publishing any change in the website header and footer will change all your website assets.

You can finalize the look and feel of your web pages by changing blog templates. To do so:

• Go to settings from your HubSpot account > locate and go to Website option from the left panel > Select Blog 

• Select Template > Hit the edit page option to continue editing if you want to change the blog page settings. 

In order to change system templates on your website,   

• Go to settings from your HubSpot account> locate and go to Website option on the left panel > Go to Pages > Select System Pages

• Choose the Charity system page type from the dropdown > Save the changes > System templates will be applied on your website. 

You can set the templates for:

1. 404 Error Page
2. 500 Error Page
3. Password Prompt Page
4. Search Result Page  

To edit the theme settings:

• From Marketing > Website > Website Pages > Choose a page to edit or create one
• Go to Edit Page Panel on the left > Design > Edit Theme Settings

You have the following alternatives to choose from, each of which allows you to make a series of adjustments.

You can edit the Global Colors, Global Fonts, and typography. Press Apply Changes after editing these.

You can change the header, footer, spacing, corners, buttons, tables, image performance, and forms. Press Apply Changes after editing these.

You can edit the sidebar of the blog post under the blog setting. Press Apply Changes after editing these.

You can edit the Error 404, Error 500, Password Prompt, Reset Password Request, and Email Unsubscribe under the system page setting. Press Apply Changes after editing these.

The Charity theme has 16 re-usable sections. For applying re-usable sections:

• Hover over any of the sections > Click the plus icon> Choose from the list of reusable sections > Publish changes. 

You can modify the background color, heading, border, shadow, show and hide FAQs or vast sections of text, adjust their height for mobile, tablet, and desktop appearances using the accordion module. 

Here you have the banner layout choice, banner content, banner image, banner breadcrumb choice, Enable reverse order (mobile), Background overlay, Banner content alignment, Banner inner spacing, and content color.  

Enable the benefactor module to display your non-profit organization’s most valuable and revered benefactors. You can change the module’s layout to three or four columns in a single row, change the content, and change the design, among other things. It’s a beautiful module for showcasing your sponsors and patrons.

You can display a list of blogs on the page using the blog index module. You can arrange the blogs in an index. You can also edit the styles of the image and content card.

For editing blog listing details, Go to Settings > Website > Blog > Select Charity Theme in Current View > Template > Set the number of posts per listing page > Save

Using the button module, you can place a button module anywhere on the page. Other settings are:

set the border radius, enable/disable box-shadow, alter the font color, and more to adjust the look of this button, enable a primary and secondary button and customize its text and add URLs.

The card module allows you to showcase cards on your website page. You can add multiple cards and adjust settings. For e.g. enable/disable the icon, enable/disable box-shadow,etc.

Using the client module, you can display your partners or brands you have helped/ collaborated with through your charitable organization.

You can use it to display numbers like the amount you’ve raised for a cause. The Counter module adds a multi-column section to your web page. You can edit the icon image, counter text display condition, and counter spacing. 

If you want to collect donations from your website to support your cause, you need the donation module. Select the module and alter settings, i.e. amount label, title, and donation button. You can add multiple fixed amount options. 

Note: To get the hidden amount property for collecting donations from this form, contact our support team and we will add this functionality for you.

The feature listing module displays the amazing stories or featured sections of your charitable trust website. You can choose the layouts and add multiple cards. Additionally, you can add images, enable grayscale images, adjust progress, and edit card corners.  

The footer copyright module allows you to display your copyright text on the bottom of the page along with terms and conditions, and privacy policy page links.   

You can select any form from the list of existing forms or create a new multiple field form too along with layouts and Recaptcha. You can include forms on the page using the form module.

Header control module enables adding search, language switcher, button links, button type, button style, button text, select display mode, and placeholder text on the website header. 

Header toggler does not have any editable option in the content part. You can style the module by changing the icon color and spacing.

You can insert icon boxes on your website pages. Under the icon box, you have options to edit the icon box layout, column count, image selection, and icon box spacing.

Add images anywhere on the page using the image module. You can edit the image size, set alt text, image loading, image alignment, and image border-radius. 

The logo is a very crucial aspect of your educational website. You can enable the custom logo under the logo module.

Use the map module to display your location on the map for the visitors. Under the map module, you can edit the map API, pointer detail, map JSON, map zoom level center latitude and longitude, enable overwriting corners and height. 

Add a menu bar on your webpage using the menu module. Select a menu from the existing option or create a new one. You can also decide the maximum levels that can be expanded from the tree menu. Other options include adding texts, background, border, etc. 

The progress bar module shows the progress on a particular process or donation in your case.

The social follow module allows you to add your social media links along with an icon, icon color, size, background, corner spacing, and alignment.

Just as the name suggests, the spacer module allows adding spaces on the web pages. You can set the background color, height for desktop, mobile, and tablet respectively.  

For displaying multiple testimonials on your landing page, you can use the testimonial module. You have the testimonial layout choice, option to hide/show social icons, enable/disable slider dots, navigation, and change navigation icon.   

The title content module allows adding content anywhere on your website page. You can add content to different titles on your web pages.

The video popup module is for adding a video to your landing page or website page. You can edit the video icon or image, add a video link, enable/disable overlay, and corners.  

There are 11 templates in the Charity HubSpot Theme.

There are 7 system pages in the Charity HubSpot theme.

The Environment HubSpot theme is a free non-profit theme that works best for public charities, non-governmental organizations, and other foundation websites. This Hubspot theme has:

• DIY theme with flexible Drag and Drop customization
• High page speed and lightweight 
• 28 modules, 6 pre-built templates, and 11 system pages 
• Mobile responsive with easy theme settings

Note: We will offer free personalized 15m LIVE theme setup and support for our Environmental Non-Profit HubSpot theme. If you find any modules missing, let us know, we will assist you in that too. Just contact us.

Using the HubSpot CMS, you can use these assets to create visually appealing web pages. Let’s get started. 

Here are a few things that you will encounter while using any HubSpot theme:

1. 1. Modules: They are interchangeable and self-contained objects that add functionality to your page. They concentrate on a specific aspect and, when correctly combined, produce wonders for your UI/UX. You will be able to drag and drop these wherever you wish in the Environmental theme. There are 28 modules in this theme.
   2. Templates: This is the sample layout that comes with the theme. You can use these to replace your services and content on your website, or you can start from scratch. There are pre-existing 11 templates and 11 system pages in this theme. 

• Global Theme Style: Backgrounds, headings, buttons, images, and form fields can all have default design options defined in the theme style settings. These options override and replace the theme’s styling options. Global modules remain the same throughout the website. Wherever you have those modules on the website pages, the settings remain unchanged.  

1. Global Content: Information that appears on numerous pages, such as the header or footer of a website The drag and drop page editor allows you to edit global content directly.

For creating a new page in this HubSpot theme, you can use a page template and customize it accordingly. Follow these steps:

• Log in to your HubSpot account through the HubSpot portal. Go to Marketing > Website > Website Pages.

• A Create button can be found in the top right corner. Click Create. Select the sort of page you want to create by clicking on it. Website pages, landing pages, and blogs are all options.

• After you’ve chosen the page type, name the page > Click Create Page.

• Now select the Environmental theme and a template after selecting the page type. There are 11 templates included with the theme, including Our Benefactors, Our Cause, Landing Page Donation, and more. Choose which one you wish to make. Click Select Template.

• After you’ve chosen a template, your page will be created successfully. You can now add or remove modules by the drag and drop method as needed. Add meta descriptions, page titles, and other required information, before publishing the page. A page title is necessary before publishing a page.

Customizations that will be applied to All Pages and/or Collections are known as global customizations. If you want to keep your customizations constant across Collections and Default Pages, this is a good option.

To edit global styles, follow these steps:

• An Edit Page Panel appears on the left side of the screen once you successfully create a page. Three options available on this panel are:

1. Add
2. Contents
3. Design 

• Click Design, you’ll see an Edit Theme Settings button. Click ‘Edit Theme Settings’ to make global changes to the theme.

Note: What you change here will affect all of the pages and assets. 

You can make changes in the following global styles:

In the Environmental HubSpot theme, we have created two global modules:

1. Website Header
2. Website Footer

After creating any page you can start editing it. On the left side of any created page locate Edit Page Panel. Three opinions available on this panel are:

• Add
• Contents
• Design 

Click on Content, you’ll see the Website Header module at the top and the Footer module at the bottom.

For editing website header:

• On the page editor, go to Edit Page panel > Design > Edit Theme Settings

• Select Website Header > Make desired changes 

• Publish the header. It will be updated universally.

Under the website header in the Environmental theme, you will find the Menu, Background, and Top Bar options.

Under the menu, you can change the following settings related to the menu on your header:

1 Link

Select the link color, mobile link color, and link hover/active color.

2 Dropdowns 

Make changes in the text, background, border style and color, and width of the dropdowns on your website.

After making changes click on Apply Changes.

You can change the background color of your header. Just put in your color hex code and apply changes.

The Top Header Bar is a section above your main menu that allows you to display additional content on top of the header. You might display a secondary menu, language, a message such as a phone number, search, social media icons, and a cart if you have an online store.

In our theme, you can set the top bar by following these steps:

• Go to Website Header > Click Header Top Bar 

• Push the slider button to enable the top bar.
• Set the background color of the top bar
• Apply Changes.  

For editing website footer:

• On the page editor, go to Edit Page panel > Design > Edit Theme Settings

Select Website Footer > Make desired changes on the footer background and text.

• Press Apply Changes. It will be updated universally.

Under the footer, you have the option to edit the website footer text and background. 

Please Note: Publishing the changes on these modules will take effect on all your pages so be sure while doing any modifications.

You can choose a template for your blog pages using Environmental Theme blog templates. This aids you in deciding how your blog pages will appear. By default you can create a template for the following:

1. Blog Post: Template for a single blog post.
2. Blog Listing: Template to list all your blog entries in one place. 

To change blog templates follow these steps:

• Go to your HubSpot account’s settings > Scroll down to the left panel > Select Website from the dropdown menu.

• From the drop-down, select the blog option > Choose the templates option. 
• Go to the Current View option > From the drop-down select Environmental.

• Now select the blog listing page and click on the edit page to continue editing the existing blog template. Select the module through from drag and drop method and apply changes.
• You can select the number of posts per listing page, select to show summaries and images, and the option to use feature images in listing summaries. 

You can use system templates to create a template for system pages such as error pages, password prompts, and search results.

To alter the system templates, follow these steps:

• Go to your HubSpot portal’s Settings > Scroll down to the left panel
• Click Website dropdown > Select Pages 

• You will see several sections. Select the System Pages section > Set a template for the system pages after clicking it.

Among the system pages, there are Errors, Password Prompts, and Search Results. 

Errors

Among the error pages, there are 404 and 500 error pages. To use either of the two pages. 

• Go to Settings > Navigate to Website > Select pages from drop-down > Select System Pages.

• Choose the Environmental 500 or 404 Error page from the drop-down menu
• The page template will be used.

For using the password prompt page:

• Go to Settings > Navigate to Website > Select pages from drop-down > Select Password Prompt Page.

Choose the Environmental Password Prompt from the drop-down option. And our password prompt page will be applied.   

For the search result page:

• Go to Settings > Navigate to Website > Select the environmental template from the dropdown menu > Select Search Result Page.

You can also select the email subscription template. 

• Go to Settings > Marketing > Email > Subscriptions 
• From the dropdown menu, you can select the Environment theme for the Subscription preference page, Subscription Update confirmation Page, and Unknown Contact subscription confirmation

After you have saved your modifications, you will have applied the Environmental template to your chosen pages.

You can alter the following settings using these options in the edit theme settings option.

Under global colors, you can edit the color on every page of your website globally. To change Global Color Settings:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Global Colors     
• Set Primary color > Secondary color > Tertiary color > Title color > Body color > Apply Changes

Using global settings, you can change the fonts to appear everywhere on your website pages, blog pages, and system pages. For changing global fonts:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Global Fonts
• Set Primary Font > Secondary Font > Apply Changes  

Using spacing, you can set the spacing between modules and text on your website pages, blog pages, and system pages in a universal manner. To set spacing:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Spacing
• Set vertical spacing > Maximum content width > Apply changes

Typography is one of the most crucial design aspects. Everything from font style to structure to character and structure is covered by typography. For each heading type, you can set the font, text transform, and mobile font.

For making changes in the typography:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Typography

• Choose heading type from h1, h2, h3, h4, h5, and h6. 
• Set Transform option from Capitalize, Upper Case, none, or Lowercase.

• Set Mobile font. The mobile font will make text appear in the selected font on mobile devices.
• Set body and link font > Apply Changes

Under buttons, you can change the button style, corner radius, spacing, and padding of primary and secondary buttons n your website pages. To change button settings:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Buttons

• Select the primary button or secondary button and make changes in its normal state, hover state, and focus state.
• You can also set the border, background, and text for different buttons.

• Set spacing and corner radius > Apply Changes. 

To change forms settings: 

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Forms

• Under forms you can change the title, labels, help text and alter field settings. 
• Apply Changes

To make changes in the tables:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Tables 

• Set header font & color, body text & background, footer text & background, cells spacing & border.  
• Apply changes. 

For altering blog settings:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > Blog Settings  

• Hit Blog Post > Make changes in the Content > Container width & Paragraph 
• Selec to Hide/Show author name/time stamp/tags/Related post > Apply Changes

For system pages modifications follow these steps:

• Go to Marketing > Website > Website Pages > Edit Page Panel > Design > Edit Theme Settings > System Page Settings
• Now you can decide which page settings you want to carry out > Apply Changes

• Check the checkbox to enable error image 
• Replace or remove the error banner image 
• Set Alt text and image loading 
• Apply changes 

Under email unsubscribe and password prompt page settings you can 

• Enable disable both these pages
• Replace/Remove banner image, alt text, and loading 
• Apply Changes

To work with the re-usable sections all you need to do is hover over any of the modules > locate and press the plus icon> select from the list of reusable sections > publish changes.

There are 6 re-usable sections in the Environmental HubSpot theme.  

Here is the list of all the modules available in the Environmetal theme. To work with modules, here are the things you need to keep in mind:

1. You need to create a page or use a template for changing modules on the page.
2. Simply select the module, drag it anywhere and drop it on the page.
3. To edit any module hover over the module > locate pencil icon on the top right of the model > Start editing the module from the module settings on the left       
4. To delete any module from the page, hover over the module > locate and click the delete icon 

This module can assist you in creating an area where users can toggle between showing and hiding FAQs or vast sections of text. Its height may be adjusted for different devices, such as mobile, desktop, and tablet. You can also modify the color of the background and heading, as well as the border and shadow.

Enable the benefactor module to display the most precious and revered benefactors of your non-profit organization. You can edit the layout of the module to three or four columns in a single row, edit the content, and style, etc. It is a very attractive module to feature your sponsors and patrons.

In the blog listing module, you can display a set of blogs on your blog page. You can change its content and style. Using a fantastic category of blog entices interested individuals to explore new articles by navigating simple.

The button module will assist you in placing a button on your page. Set the border radius, enable/disable shadow, alter the font color, and more to adjust the look of this button. You can also enable a primary and secondary button and customize its text and add URLs.

The case study module allows you to showcase a comprehensive examination of a single person, service, problem, group, location, event, organization, or phenomenon. In social, educational, clinical, NPO, and business research, case studies are frequently employed.

The Counter module adds a multi-column section to your page. Each of these columns has some content as well as a counter. You can use it to display numbers like the number of businesses you’ve assisted, the number of clients you’ve served, and the nations to which you provide solutions on your about us or home pages.

The donation module is specifically for your website if you want to urge volunteers to donate for your cause. Just select the module and alter settings, i.e. title, amount label, and donation button. You can add multiple fixed amount options.

You will need to create a contact property for the donation amount in your form. This form field shall remain hidden in the form. 

You can choose between image or icon type from this section. List your features on this page. You can use the card or overlay layout. You can add multiple feature cards on your page with a progress bar with customizations in their content, image, links, and alt text. 

Allow users to filter blogs and content by categories with the use of a filter module. You add multiple categories, tabs, and portfolios. By default, all cases are listed. But, the initial filter setting will allow users to set the initial filter only for a single category at a time.

A hero banner is the enormous, oversized banner image that users will view as soon as they arrive on this page. Layout, background color, banner header, heading color, layout, image, banner paragraph, and banner color can all be customized. Update the links and use a banner CTA.

This module provides an area where you can display several cards. Each of these cards has a symbol, and you can choose how many cards to show in each column. You can also change these cards’ layout, count, and text orientation.