Market Web Forge

Two Column Testimonial

Written by Shubham Mishra | Jan 6, 2026 1:29:38 PM

Showcase client feedback with impact using the Two Column Testimonial module. This layout beautifully balances testimonial content and visuals side by side for clear, engaging storytelling. Designed to highlight customer experiences, it helps build trust and strengthen brand credibility. With smooth transitions and a clean, modern structure, testimonials feel more authentic and readable. Fully responsive and customizable, it fits seamlessly into any page design across all devices.

Key Features of a Two Column Testimonial Module :

Two-Column Layout Design - Displays testimonial content and images side by side for a clean, professional presentation.

3 Unique Layout Options – Choose from three beautifully crafted slider layouts to match any design style.

Fully Mobile Responsive – Seamlessly adapts to all screen sizes for the best viewing experience.

Infinite Auto Slide – Testimonials slide automatically in a smooth, endless loop.

Slide Dots Option – Optional navigation dots enhance usability.

Modern & Clean Design – Sleek, contemporary styling fits perfectly into any modern website.

Easy to Edit – Quickly customize content, styles, and settings without hassle.

Easy to Integrate – Simple setup and integration into any page or theme.

Optimized for Performance – Lightweight and fast for smooth transitions and loading.

Smooth Animation Effects - Built-in fade or slide animations enhance visual engagement without affecting performance.

 

How to Set Up the Two Column Testimonial in HubSpot :

In the main dashboard, go to the ‘Content’ tab and select either ‘Website’ or ‘Landing Pages,’ depending on where you want to add the section. This lets you choose the right location for managing or updating your content.

Select the page where you want to apply the module.

Search for "Two Column Testimonial" and drag and drop the module into the desired location on your page.

Module Defaults Options: 

Layout ID :

Easily enhance navigation by adding an ID to the target section and using the same ID in an anchor link. This enables a smooth scrolling effect when users click a Call-to-Action (CTA) button, improving the overall user experience.

Layout Options :  

For the Two Column Testimonial module, choose from multiple professionally designed layouts to present customer feedback in a visually engaging way. Each layout offers flexibility in content placement and visual hierarchy, helping you create trust-driven testimonial sections that fit your brand perfectly.

Options : 

  • Layout 1 : Features a section heading controls and a two-column structure where the client image appears on one side and testimonial content on the other, ideal for a clean and focused testimonial highlight.
  • Layout 2 : Includes a heading and subheading with a modern two-column card design, combining client visuals and testimonial text with subtle background styling for enhanced emphasis.
  • Layout 3 : Displays a centered heading and description followed by a wide two-column testimonial card, perfect for showcasing detailed customer feedback in a bold, attention-grabbing format.

Sub Heading/Heading & Description: 

You can change the sub heading, heading and description text with show/hide also in All Layouts with the option to show or hide it, allowing for a flexible and customizable user experience.

  • Update the sub heading, heading and description
  • Easily manage and organize how content is shown based on user interaction

Slider Content : 

  • Image
    Easily personalize client images to match your brand and layout style. Upload custom photos, avatars, or logos directly from the HubSpot editor with full control over sizing and alignment.
  • Enter Client Comment
    Add the client’s feedback or review text. Use this space to highlight authentic experiences and build trust.

  • Enter Client Name
    Add the client’s full name to personalize the testimonial and improve credibility.

  • Enter Client Position
    Add the client’s designation, role, or company name to provide context and strengthen authenticity.

Left Content In Layout Two :

jQuery Add/Remove :

Users can add or remove jQuery JavaScript as needed, providing flexibility to enhance functionality or optimize performance based on their requirements.

Module Style Options: 

Module Setting :

Adjust the margins, padding and background colors to achieve your desired look and feel for the module. This flexibility lets you fine-tune the layout and aesthetics, ensuring your design is both visually appealing and user-friendly.

Heading & Description Setting :

In this module, you have full flexibility to customize the heading and description to perfectly align with your design vision. You can easily adjust the spacing around the text, apply text transformations such as uppercase or lowercase, and set the alignment (left, center, or right) to create the ideal layout. These options ensure your content remains visually balanced and responsive across all devices.

  • Text Styling Options
    Set font size, color, spacing, and apply text transforms like uppercase or capitalize.
  • Responsive Alignment
    Align your content (left, center, or right) for both desktop and mobile devices.
  • Spacing Adjustments
    Add padding or margins around your content to create visual balance.

Slider Card Setting :

You have full control over customizing the column box to align with your design preferences. Adjust the background, spacing, border and corners to create the perfect look for your layout. Tailor these elements to ensure your content stands out and blends seamlessly with the rest of your design.

  • Background Customization
    Choose a solid color, gradient, or even an image background for your column box.
  • Spacing Control
    Adjust the padding and margin to create the ideal distance between elements and prevent overcrowding.
  • Border Styling
    Set borders with customizable width, color, and style to frame your content attractively.
  • Corner Radius
    Round the corners to create smooth, modern edges for a softer design.

Slider Content Setting :

Take full control over your column content by customizing the typography, spacing, and alignment to match your brand's design style. You can adjust text transform options, icon size to make them stand out. Whether you’re updating typography, or configuring borders every detail can be tailored for a cohesive and visually appealing look.

  • Typography Customization
    Adjust font size, style, and color for headings, descriptions, and other text elements to create a consistent visual identity.
  • Spacing & Alignment
    Control padding, margin, and text alignment to ensure optimal content positioning and balance.
  • Text Transform
    Modify text case and style (uppercase, lowercase, capitalize) for better readability and emphasis.
  • Clients Info
    Customize the profile image, name and position.

Slider Arrows & Dots Settings :

Gain full control over slider navigation elements by customizing arrows and dots to match your brand’s visual style. Adjust size, color and spacing to ensure smooth interaction and a polished user experience. Whether you’re refining navigation visibility or styling active states, every detail can be tailored for consistency and clarity.

We hope you enjoy using our two column testimonial module to create a seamless experience for both your users and your marketing team. At Code Accelerator, we're committed to ensuring your HubSpot experience is exceptional. If you need a custom HubSpot module or require a tailored HubSpot CMS or CRM setup, please don’t hesitate to Contact Us.