Progress Metrics Pro Documentation

Overview

Progress Metrics Pro is a dynamic module designed to showcase progress metrics and milestones seamlessly within HubSpot pages. Featuring an intuitive interface, this module empowers users to display progress through customizable metrics cards alongside images. With the flexibility to replicate and modify elements, users can create multiple instances of this module, each offering comprehensive customization options for text, alignment, images, and icons.

Key Functionalities

  1. Metrics Customization: Set and visualize progress metrics, allowing for dynamic updates and representations of milestones.

  2. Two-Column Layout: Utilize a structured two-column layout, offering the perfect space to pair metrics cards with accompanying images for a visually compelling presentation.

  3. Text Styling and Alignment: Customize text attributes such as color, font, size, and alignment for each metrics card to match the webpage's aesthetics and content requirements.

  4. Icon Integration: Seamlessly integrate icons into the metrics cards. Choose from HubSpot's default icon library or upload custom icons for personalized visual elements.

Usage Guide

  1. Adding the Module:

    • Effortlessly incorporate the Progress Metrics Pro module into your HubSpot pages by dragging and dropping it within the desired section using the page editor.

  2. Configuring Metrics Cards:

    • Customize each metrics card individually by defining the progress metrics, adjusting text styles, and aligning content as per the page layout.

  3. Adding Images:

    • Upload or select images to complement the metrics cards, adjusting alignments (top or bottom) to ensure a visually balanced presentation.

  4. Icon Selection:

    • Enhance the visual appeal of metrics cards by choosing icons from HubSpot's default library or uploading personalized icons.

How to Customize

  1. Setting Progress Metrics:

    • Define and update progress metrics to accurately represent milestones, providing a clear visual representation of achievements.

  2. Text Styling:

    • Modify text attributes like font, color, size, and alignment for each metrics card, ensuring consistency with the webpage's design language.

  3. Image Alignment:

    • Choose suitable image alignments (top or bottom) concerning the metrics cards to create an aesthetically pleasing layout.

  4. Icon Selection:

    • Select icons from HubSpot's default library or upload custom icons to complement metrics cards and enrich their visual appeal.

Support and Assistance

For further guidance on utilizing Progress Metrics Pro or any inquiries, please refer to our support documentation or contact our customer support team.

Back To Module >>