HubSpot Portfolio Module

Portfolio Showcase Pro

A portfolio section for HubSpot CMS. Projects are rows in the page editor — an image or a looping video, a title, a summary, a media gallery, a write-up, a details list, tags and a link. Lay them out as a grid, a mosaic, a full-bleed stack or a carousel.

Demo

One set of rows, four layouts.

The same projects tessellate into a mosaic, sit in an even grid, stack full-bleed edge to edge, or run as a carousel that snaps and loops. A tile opens into a modal, a drawer or a lightbox, and previous and next move between projects without closing.

even gridmosaicfull-bleed stackcarouselmodaldrawerlightboxvideo tiles
Features

What this module does.

Every option below is a real, editable field in the HubSpot page editor.

01

Rows that fill, edge to edge or side to side

The mosaic is worked out at render and written as a grid position for every tile, once per breakpoint, so no row is left part empty. Each project carries its own tile size or takes a repeating pattern, and stacked tiles meet edge to edge.

02

A carousel that leaves the page alone

It peeks on both sides, snaps card to card, and loops so every arrow press has somewhere to go. A finger drags it, a trackpad throws it, arrows and the keyboard drive it. The wheel is never captured. Cards match height and the link sits on the bottom edge.

03

Projects open into a modal, a drawer or a lightbox

A media strip with images and video, a write-up, a details block whose labels are your words, tags and a link. An automatic setting picks the lightbox under a mosaic and the modal elsewhere.

04

Everything a project row holds

An image or a looping video, an eyebrow, a title, a summary, a media gallery, a rich-text write-up, a details list with your own labels, tags and a link out. Add one in the page editor without a developer.

05

Focus goes where it should

Focus moves into an opened project, is trapped there, and returns to the tile it came from. Escape closes it. Previous and next move between projects without closing.

06

Nothing loaded from anywhere else

It reads no HubDB table, connects to no service, loads no library and pulls nothing from another domain. It works on any HubSpot page template with no theme required.

07

Every value is an editor field

Colours, sizes, spacing, radii, weights, durations, easings and every visible string. Monochrome to begin with, and body font, heading font, accent colour and link colour inherit from your theme settings.

08

Reduced motion is respected

Where a visitor has asked for less movement the animation is switched off, tiles arrive in place, and video tiles show their posters instead of playing.

Setup

What it needs from you.

A picture or an MP4 near 1080p for each project, and the words. That is the whole input. Drop the module on a page, add a row per project, and pick a layout and an open mode — everything after that is a field rather than a ticket.

Keep project video near 1080p rather than 4K, the same ceiling that keeps a background video from stalling a page. The module leaves the mouse wheel alone, so a carousel never traps a visitor mid-scroll, and the mosaic recalculates its tile positions per breakpoint rather than leaving a half-empty row on a narrower screen.

Pricing

One-time price.

A single one-time purchase on the HubSpot Marketplace — no subscription.

Portfolio Showcase Pro
$79.99one-time

One-time price on the HubSpot Marketplace. Works on any HubSpot page template, with no theme required.

  • Standalone HubSpot CMS module
  • Grid, mosaic, full-bleed stack or carousel
  • No HubDB table, library or API key needed
  • Full Style tab so it matches your brand
  • Clean, documented HubL — no dependencies
  • Free updates and support
Get it on HubSpot
FAQ

Common questions.

What does Portfolio Showcase Pro do?

It puts a portfolio section on a HubSpot page. Projects are rows in the page editor. Each row carries an image or a looping video, an eyebrow, a title, a summary, a media gallery, a rich-text write-up, a details list with your own labels, tags and a link out.

How can the work be laid out?

As an even grid, as a mosaic where tiles of different sizes tessellate into filled rows, as a full-bleed stack of wide tiles meeting edge to edge, or as a carousel that peeks on both sides, snaps, drags and loops.

How does a project open?

In a centred modal, in a drawer from the right, or in a lightbox. An automatic setting picks the lightbox under a mosaic and the modal elsewhere. Previous and next move between projects without closing.

Does the carousel capture the mouse wheel?

No. The wheel is left alone, so the page scrolls past a carousel rather than getting caught in one. A finger drags it, a trackpad throws it, and arrows and the keyboard drive it.

Can a project tile play video?

Each project takes an image or a looping MP4 near 1080p, and the media gallery inside a project holds both images and video. Under reduced motion the animation is switched off, tiles arrive in place, and video tiles show their posters.

Does it need HubDB, a library or an external service?

No. Projects are editor rows. It reads no HubDB table, connects to no service, loads no library and pulls nothing from another domain. It works on any HubSpot page template with no theme required.

How much work is it to set up?

What it needs from you is a picture or an MP4 near 1080p for each project, and the words. Everything else is an editor field: colours, sizes, spacing, radii, weights, durations, easings and every visible string. It starts monochrome, and body font, heading font, accent colour and link colour inherit from your theme settings.

Is it keyboard and screen-reader operable?

Focus moves into an opened project, is trapped there, and returns to the tile it came from. Escape closes it. Arrows and the keyboard drive the carousel.

How much does it cost?

It is a one-time purchase of $79.99 on the HubSpot Marketplace, which includes free updates and support.