About this plugin
This plugin was developed to address the limitations of Calendar Embed (The Events Calendar)
when it is used inside an iframe embedded in a sidebar.
By default, Calendar Embed enforces several behaviors that are not suitable for sidebar integration:
- events open in a new browser tab
- event content is loaded inside the iframe
- unnecessary interface elements are displayed (description, subscription, etc.)
- iframe height is not properly controlled
This plugin provides a robust solution, without modifying The Events Calendar plugin, by relying
on a controlled JavaScript interception and targeted CSS rules.
Main Features
- Calendar displayed in monthly view only
- Removal of unnecessary elements in the embed context:
- custom description
- calendar subscription block
- Sidebar-optimized iframe:
- 100% width
- fixed height (600px)
- no border
- no internal scrolling
- Click behavior fix:
- neutralization of Calendar Embed JavaScript
- events open in the same browser tab
- CSS and JavaScript conditionally applied to Calendar Embed pages
- Procedural, lightweight, and maintainable code
- No template overrides
- No theme dependency
Setup
◆ How To Configure Event Calendar Embeds
- Insert the iframe into the sidebar using a custom HTML block.
- Copy and paste the code below into the HTML block.
- In the code, replace the URL in the src attribute with the embed URL provided by Calendar Embed(Menu: Events/Calendar Embed, then click on Get Embed Snippet).
- The inline CSS ensures a fixed iframe height in the sidebar context.
Integration code example:
fr/calendar-embed/XXXXXXXX/embed/" frameborder="0" scrolling="no"> </iframe>
👉 This plugin has no settings page.
No additional configuration is required.
Démo
See the plugin in action on our demo site
Discover our other plugins
◆ Easy Custom Event Tickets
◆ Editor Custom Color Palette
◆ Slider Galerie Native Responsive
◆ Filter Bar Custom Post Type
◆ Rouergue Création Top Notice Bar