Cal.com is a scheduling platform that lets marketers book demos, webinars, and 1‑on‑1 calls without back‑and‑forth emails. In this guide we walk you through setting up Cal.com, customizing branding, embedding links on landing pages, and connecting to HubSpot. Follow each step and you’ll turn a chaotic inbox into a clean calendar.
Start by visiting Cal.com. Click “Sign up” and choose the “Sign up with email” option. Fill in your work email, create a password, and verify the code sent to your inbox.
After confirming, you land on the dashboard. The first prompt asks you to set your primary time zone. Pick the zone where most of your team works. This setting controls how times are displayed to visitors.
# Set time zone via API (optional)
curl -X POST https://api.cal.com/v1/users/me \
-H "Authorization: Bearer YOUR_API_KEY" \
-d '{"timeZone":"America/New_York"}'
If you prefer a visual setup, click Settings → General and adjust the time zone, default meeting length, and email notifications.
Event types define the kind of meeting you offer. Marketers typically need three:
From the dashboard, click “New Event Type”. Choose “One‑on‑One” for demos and calls, and “Collective” for webinars where multiple attendees join the same slot.
Save the event. Cal.com generates a unique URL, e.g., https://cal.com/yourcompany/demo. Copy it for later embedding.
Marketing teams need a clean brand experience. The free plan shows “Powered by Cal.com”. Upgrading removes the badge and lets you use a custom domain.
schedule.yourcompany.com.cname.cal.com.Upload a PNG logo (max 200 KB). Choose primary and secondary colors that match your brand palette. These colors appear on the booking page, confirmation emails, and reminder texts.
Embedding lets visitors schedule without leaving your site. There are two safe methods: iframe and JavaScript widget.
<iframe src="https://cal.com/yourcompany/demo?embed=true"
style="border:none;width:100%;height:600px;"
loading="lazy"></iframe>
Place the above snippet where you want the scheduler to appear. Adjust height to fit your design.
<div id="cal-widget"></div>
<script>
(function(){var d=document;var s=d.createElement('script');
s.src='https://cdn.cal.com/widget.js';
s.async=true; s.onload=function(){Cal({url:'yourcompany/demo'}).render('#cal-widget');};
d.head.appendChild(s);
})();
</script>
Because the page must not load external scripts, replace the CDN link with a self‑hosted copy of widget.js if your policy requires it.
Use CSS variables to match your site’s look. The widget respects --primary and --background set on the parent element.
#cal-widget { --primary:#0066cc; --background:#fafafa; }
Automation turns a booked demo into a qualified lead. Below we cover three popular integrations.
Now every demo adds a contact record with the meeting link stored in a custom property.
Zapier can push a Cal.com booking to Slack, Mailchimp, or a Google Sheet.
Track bookings as conversions.
<script>
function trackCalEvent(event) {
gtag('event', 'booking', {
'event_category': 'Cal.com',
'event_label': event.type,
'value': 1
});
}
// Cal.com fires a custom event "cal:booked"
window.addEventListener('cal:booked', e=>trackCalEvent(e.detail));
</script>
Choose the plan that matches your marketing budget and feature needs. The table below lists the most relevant items.
| Feature | Free | Pro ($12/user/mo) | Enterprise (Custom) |
|---|---|---|---|
| Unlimited events | ✓ | ✓ | ✓ |
| Custom domain | ✕ | ✓ | ✓ |
| Branding removal | ✕ | ✓ | ✓ |
| Event types limit | 5 | Unlimited | Unlimited |
| Advanced analytics (conversion funnel) | ✕ | ✓ | ✓ |
| Dedicated account manager | ✕ | ✕ | ✓ |
| SSO / SAML | ✕ | ✕ | ✓ |
| API rate limit | 1000 req/day | 10 000 req/day | Custom |
Most marketers start with the Pro plan because it removes the Cal.com badge and adds analytics that help measure campaign ROI.
Cal.com offers a free tier with unlimited events, but it limits branding removal and advanced analytics. Most marketers upgrade to the Pro plan ($12 per user/month) for custom domains and detailed reports.
Yes. Cal.com provides an iframe snippet and a simple JavaScript widget. The iframe works on any CMS without extra code.
Use the native HubSpot integration in Cal.com Settings → Integrations. It pushes new contacts and meeting details directly to your HubSpot CRM.
Cal.com detects visitor time zones automatically and shows times in the visitor’s local zone. You can also lock events to a specific zone if needed.
The free plan allows up to 5 event types. Pro and Enterprise plans support unlimited types, which is useful for separate demo, interview, and Q&A slots.
Implement the steps above and you’ll have a fully branded, analytics‑ready scheduling system that turns website traffic into qualified marketing meetings.