- Easy to use, DIY theme settings
- Drag and drop page builder with zero coding
- Highly customizable HubSpot modules
- High-speed SEO-friendly theme
- Multi-language support
- 25 theme modules
- 8 templates
- 6 reusable sections
- 6 system pages
2.Create Child Theme
As soon as you buy or download a theme, HubSpot will prompt you to start editing the page templates of the CMS theme. However, before rushing into starting your newly designed pages, consider creating a child theme.
Setting up a child theme of the ACTIVISM HubSpot theme
- preserves the ability of the updates to be applied to the parent theme.
- Additionally, anyone including us, a third party, or you can change the code on your portal and extend your requirements and theme styles that are not currently adjustable on the parent theme.
- Even if you’re not going to edit the theme at all, creating a child theme ensures, you can receive regular updates from the HubSpot marketplace without hindering your customizations.
- Once the theme has been purchased, you can build up to 5 child themes with separate branding under the same account. In fact, Users of CMS Hub Enterprise can set up as many as 10 child themes.
2.1.Steps To Create a Child Theme
- Open your HubSpot account > navigate to marketing > choose files and templates > select design tools
- Find the @marketplace folder for the Glambiz theme > right-click on the Activism theme folder > select create child theme > name the child theme
If you want to change the child theme location, do so by clicking change in the File location section. Select a folder > click select.
3.Edit Theme Settings
To access the theme settings, you first need to create a page > edit page option > theme > edit theme settings. From the edit theme settings, you can access different settings on the themes like global colors, global fonts, typography, buttons, forms, tables, website header, website footer, spacing, and system page settings.
The typography settings allow you to change the desktop font, line height, letter spacing, text transformation, etc., and change the mobile font height, line height, and letter spacing for headings, h1, h2, h3, h4, h5, h6, and the body. Additionally, you can alter the normal and hover link color.
To edit the tables on the website you have the following 4 sub-settings:
- Table header: Edit the text color and background of the table header.
- Table body: Edit table body text color and background color.
- Table footer: Change the table footer background and text color.
Table cells: Alter the border and spacing of table cells.
From the website header option, you can control the following:
- Background: Change the header background color.
Menu: Edit desktop and mobile header text, hover text font, active text font, edit dropdown text color, background color, hover text & background color. Additionally, you can also edit the active text font color which is only for mobile view.
From blog settings, you can access to two sub-settings:
- Sidebar: You can enable or disable sidebar and other sidebar widgets like, topics, popular posts, and subscription form.
Blog Post: Edit desktop and mobile content paragraph, alter image corners, enable or disable author name, timestamp, tags, and related posts.
4.Activism Theme Modules
There are 25 modules in this free HubSpot theme.
The accordion module can help you create a section to add FAQs or a large piece of content users can toggle to show or hide. You can add multiple accordions, as many as you like.
You have the icon position choice of left and right. You can add the title and content of each accordion and replace or remove the opening and closing icons.
From its style tab, you can edit icons, content, title, and text color.
Add blogs in listings with all other important details. You can display blogs on your website page with the blog listing module.
You can enable or disable blog meta information like tags, title, author, publish date, description, and button. You can edit the button text, and enable box-shadow and sidebar widgets.
The sidebar widgets include the search, popular posts, category, and subscribe button. You can enable or disable either of these.
From the style tab, you can control widgets and cards. You can change the card background color, content, and background color on hover, featured image corner radius, tags, titles, etc.
Add title and images in cards on your website pages.
You can select the column layout from one, two, and three. Enable title, description, enable icon box, and button image.
While you add multiple cards you can edit the card image, image loading, title, content, replace or remove the image at the button, image size adjustments, and maximum size.
From its style tab you can edit image corner radius and content alignment. From the overwrite styles option you can change content color.
Add a custom form according to your website’s requirements. You can add any form you want, like subscribe form, donation form, subscribe to the activism news feed, reach form, petition form, or event form.
You can select form layout from multiple field form, or single field inline form.
You can also add multiple form fields and edit the form content according to your needs.
From the style tab of custom form, you can enable/disable the border button, desktop alignment, enable form max-width, desktop & mobile form spacing, background color, and border of input fields, and overwrite button styles (change normal & hover text background and border color), change button radius, etc.
Collect donations from volunteers and sponsors via donation form. Contact us for customization.
You can edit the form contents, fields, etc. like other forms on your website.
From the style tab you can also change the background color max width, form title, and the border and background color of the input field.
The header controls can be edited from the global content editor. The header appears on the top of your website and landing pages. You can add multiple options for user navigation.
The header control module allows the user to enable a search option, select the display mode of the language switcher (localized, PageLang, hybrid), and button type, link, and text on the website header.
Add multiple icons and their descriptions on landing pages.
You can select the number of columns you want to display, select an image or icon for each column, edit compact content and enable box shadow.
From the style tab you can edit the icon box background and content color, desktop & mobile spacing, and change icon color.
The map module will add a virtual map to your website. If you have a physical office where you carry on your daily activities or ask people to come over for an event, you can definitely add this module.
You can edit the content (title, subtitle, and container), pointer details, Map JSON, alt text, and image loading.
Create single consecutive windows to show important details on landing pages along with a form.
You can add multiple contents to your tabs and edit each of its image, title, content, add button and attach form too.
You can edit navigation title background color, controls background color, overwrite styles, etc.
The testimonial module can be used to display various testimonials on your landing page.
You can add multiple testimonials on your landing pages and replace or remove the slider arrow image for the previous and next testimonials.
For every testimonial you add, you can remove or replace the client image, adjust the size, alt text, image loading, client review content, and replace or remove pattern images.
The title content module allows you to add a title on any page. There is an option to add a mini title, edit content, and add primary & secondary buttons.
You can enable a mini title, format content, and place a button with the title content.
From its style tab you can edit the text container background color, enable maximum width, desktop and mobile spacing, and content alignment, description, etc.
Using the video module, you can add a video to your website or landing pages. These are very easy to work with and increase your page’s engagement rate.
You can replace or remove the video poster, select icon content, play icon, etc.
You can select either icon over image or content over the image. The default option for video pop-ups is an icon over the image.
From the style tab, you can select desktop and mobile alignment, and enable overlay, frame, and corner border radius.
There are 6 reusable sections that you can use with a single click. They are:
The social follow module allows you to add your social platforms like Twitter, Instagram, Facebook, and LinkedIn on your website pages, header, or footer.
From the style tab of the social follow module you can overwrite icon color, change the background color, corner radius of the icons, desktop, and mobile horizontal alignments, etc.