How to Embed Koalendar in Joomla

You can easily add your Koalendar booking page to your Joomla website so visitors can book time with you without leaving your site.

There are 3 ways to embed your booking calendar:

1. 💻 Inline Embed – show your calendar directly on the page
2. 📍 Popup Widget – add a persistent “Book now” button to the corner of your site
3. 🔗 Popup on Click – open your calendar when someone clicks a link or button

All options are fully supported when using Joomla’s custom HTML options.

📑 Menu

• 📋 Step 1 – Copy your embed code
• 📝 Step 2 – Paste it into Joomla
• 🛠️ Troubleshooting
• 🤔 Which embed style should you use?

📋 Step 1 – Copy your embed code

1. In the Koalendar dashboard, click Share on the booking page you’d like to add.
2. Select Add to website.
3. Choose an embed style (Inline Embed, Popup Widget, Popup Text) and click Copy Code.

💡 Feel free to customise colours, text, icon, and positioning before copying the code.

📝 Step 2 – Paste it into Joomla

Option A – Custom HTML module (recommended)

1. In your Joomla admin panel, go to Extensions → Modules → New → Custom (HTML).
2. Choose a Position and set Show Title as needed.
3. Select the Code or Tools button (<>) and paste your Koalendar code.
4. Save & Publish — your calendar (or button) is live!

Option B – Directly in an article

1. Content → Articles → edit or create an article.
2. Click the Code (<> ) icon in the editor toolbar.
3. Paste the Koalendar code where you want it to appear.
4. Save & Preview.

⚠️ Embed disappeared? Go to System → Global Configuration → Text Filters and set your user group to No Filtering. This stops Joomla from stripping <iframe> and <script> tags.

🛠️ Troubleshooting

🤔 Which embed style should you use?

Mix and match styles across different pages if it helps users book faster.