Your HubSpot events page is either a Google Calendar iframe that looks like it was designed in 2008 or a static list of dates your marketing team updates manually. Neither option matches your brand, neither is interactive, and both make your site look like it was built by someone who gave up. Visitors land on your events page, see a cramped iframe with default blue styling and tiny 11px text, and leave. Or they see a plain list of dates with no filtering, no speaker details, and no way to distinguish a webinar from a product launch. This is the page that is supposed to drive registrations.
Stop paying monthly for Luma, Calendly, or AddEvent widgets that inject their own branding into your site. Stop embedding Google Calendar iframes that ignore your typography, your colors, and your dark mode. Calendar Pro is a native HubSpot module that lives in your page editor and looks like it was custom built for your site. It renders four distinct calendar views, supports event popovers with speaker cards and CTAs, filters by category, and ships with over 100 style controls. One purchase at $14.99. No API keys. No monthly subscription. No third-party scripts loading on your page.
Four Views for Four Use Cases
Calendar Pro ships with four calendar views, each designed for a specific use case. You choose the default view, and visitors can switch between them using a view switcher in the calendar header.
Month View
The month view displays a traditional calendar grid with color-coded event pills on each day. Visitors navigate between months using arrow controls. Days with multiple events stack them vertically, and when a day has more events than the visible space allows, a "+3 more" indicator appears. Each pill shows the event title and its category color, so visitors can scan an entire month and immediately see which days are heavy with webinars versus which days have product launches. This is the view most teams set as their default.
Week View
The week view renders a 7-day grid broken into hourly rows from morning to night. Events appear as blocks positioned at their exact start time and sized according to their duration. A 90-minute workshop at 2:00 PM takes up 1.5 row heights. When two events overlap in time, they display side by side in the same time slot rather than stacking or hiding one behind the other. This view is built for schedules where timing matters: training programs, office hours, recurring meetings.
Day View
The day view shows a single day from morning to night in a vertical timeline. Events appear as blocks with their full title, time range, and category color. This is the focused view for days with 8 or 10 events where the month view would just show "+7 more" and the week view would feel cramped. Conference organizers use this for day-of schedules where attendees need to see every session in sequence.
Timeline View
The timeline view is built specifically for conferences and multi-track events. It displays horizontal swim lanes for each track, room, or stage, with events positioned along a time axis. A design conference with 3 tracks (UX, Engineering, Product) shows 3 rows, each with its own events laid out left to right by time. Attendees can see what is happening in every track simultaneously and spot gaps or conflicts. No other HubSpot calendar module offers a multi-track timeline.
Event Popovers That Replace Page Redirects
Click any event in any view and a popover anchors directly to that event. The popover displays the event title, date and time, location, category badge, and a rich text description. If you have added a speaker, their headshot appears alongside their name and bio. A CTA button at the bottom links to your registration page, Zoom link, or any URL you configure per event.
This is not a modal that darkens the entire page and hijacks focus. It is a popover anchored to the clicked event, positioned intelligently so it does not overflow the viewport. Click outside the popover and it closes. Press Escape and it closes. Tab through the popover content and focus stays trapped inside until you dismiss it. The entire interaction is keyboard accessible and screen-reader friendly.
The point is simple: visitors should be able to browse your calendar, read event details, and click through to register without ever leaving the page. No redirect to a detail page. No full-screen modal that makes them lose their place. They click, they read, they register or they close and keep browsing.
Categories That Visitors Can Actually Filter
Every event in Calendar Pro belongs to a category. Categories are managed as a repeater field in the module settings, so your marketing team creates them directly in the HubSpot editor. A SaaS company might have Webinar, Product Launch, Office Hours, and Community Meetup. A university might have Admissions, Athletics, Academic, and Alumni.
Each category has its own color, configured in the Style tab. Webinars might be blue, product launches might be orange, office hours might be green. These colors appear as the event pill color in month view, the block color in week and day views, and the badge color in popovers. Visitors see the category filter bar above the calendar and can click any category to show only those events. One click to filter, one click to clear. When a filter is active, the calendar instantly updates to show only matching events.
This is not a dropdown buried in a corner. The category filters are visible, color-coded buttons that sit above the calendar grid. Visitors understand them without instructions. Your marketing team manages them without filing a dev ticket.
Dark Mode Without a Developer
Calendar Pro ships with over 100 style fields organized in the Style tab of the HubSpot editor. Background colors, text colors, border colors, hover states, popover backgrounds, category pill colors, header colors, navigation button colors. Every surface of the calendar is configurable.
Want a dark calendar on a dark page? Change the background to #1a1a1a, the text to #f5f5f5, the grid lines to #333333, and the popover background to #2a2a2a. The entire calendar transforms in the preview pane. No CSS overrides. No developer involvement. No theme file editing.
This matters because most HubSpot modules ship with hardcoded light mode colors or expose 5 to 10 color fields and call it customizable. Calendar Pro exposes every color, every border radius, every shadow, every spacing value. You control the Google Font for the calendar header independently from the event text. You set the border radius on event pills independently from the popover border radius. You choose whether the month grid has visible borders or floats on a clean background.
Teams running dark-themed sites (SaaS companies, creative agencies, gaming studios) do not have to fight the module to match their brand. Teams running light-themed sites with a specific color palette do not have to accept default blues and grays. The calendar looks like part of your site because you control every visual property.
Events Managed by Your Marketing Team
Events in Calendar Pro are repeater fields in the HubSpot page editor. Your marketing team clicks "Add event," fills in the title, picks a date and start time, picks an end time, selects a category from the dropdown, and writes a description in the rich text field. If the event has a speaker, they add a name, upload a headshot, and write a short bio. If the event needs a CTA, they add button text and a URL.
That is the entire workflow. No dev tickets. No external CMS. No API keys to configure. No webhook to set up. No third-party dashboard to log into. The same person who edits your homepage hero can add events to your calendar.
When an event needs to be updated, they open the page in HubSpot, find the event in the repeater, change the date or description, and publish. When an event is over and needs to be removed, they delete it from the repeater. The calendar re-renders automatically. There is no sync delay, no cache to clear, no "why is the old event still showing" conversation in Slack.
For teams with 20 to 50 events per month, this repeater-based approach is faster than any external tool. You are already in HubSpot editing pages. Your events live in the same editor. One workflow, one tool, one publish button.
No API Keys, No Monthly Fees, No Third-Party Scripts
Calendar Pro costs $14.99 one time on the HubSpot Marketplace. There is no monthly fee. There is no annual renewal. There is no per-seat pricing. There is no "free tier with a watermark" upsell. You pay once and use it on as many pages as you need in your portal.
The module runs on pure vanilla JavaScript. No jQuery. No React bundle. No external API calls. No Google Calendar API key to configure and rotate. No Calendly embed script loading 200KB of external JavaScript onto your page. No AddEvent subscription that costs $8 per month for basic features and $29 per month for the ones you actually need.
Zero external dependencies means zero privacy concerns about third-party scripts tracking your visitors. It means zero risk of a third-party service going down and leaving a broken embed on your events page. It means your calendar loads fast because it is not waiting for an external API response before rendering.
The CSS is scoped to the module instance, so you can place multiple calendars on the same page (one for webinars, one for in-person events) without style conflicts. Each instance has its own settings, its own events, its own category colors.
What You Can Build with Calendar Pro
Company Events Pages
The most common use case. Webinars, meetups, product launches, office hours, community events. Set month view as the default, create 4 to 6 categories with distinct colors, and your visitors can scan an entire month of events at a glance. Marketing teams at SaaS companies with 10 to 30 events per month use this setup to replace their Luma or AddEvent embeds.
Conference Schedules
Use the timeline view with swim lanes for each track or stage. A 2-day conference with 3 tracks and 40 sessions displays as a clean, scannable schedule where attendees can see every track simultaneously. Add speaker photos and bios to each event so attendees can read about presenters without leaving the schedule page. This replaces Sched, Whova, and other conference schedule tools that charge $500 or more per event.
Training Calendars
Week view with categories is built for this. A training company offering 5 course types across a weekly schedule uses category colors to distinguish Python workshops (blue) from data science bootcamps (green) from leadership seminars (orange). Visitors filter by the course type they care about and see only the sessions relevant to them. The hour-by-hour layout shows exact timing so learners can plan their week.
Editorial and Content Calendars
Marketing teams use month view with category colors to display their content calendar publicly. Blog posts in one color, podcast episodes in another, video releases in a third. This works well for media companies, content agencies, and creator brands that want to show their audience what is coming. The popover can include a teaser description and a CTA that links to the published piece once it is live.
Get Calendar Pro
Calendar Pro is available on the HubSpot Marketplace for $14.99. Full feature details, screenshots, and a live demo are on the Calendar Pro deep dive page. If you run into anything during setup, Studio Nope provides direct support through the marketplace listing.