Rouergue Creation Events Sidebar
·
This plugin provides a clean and controlled integration of Calendar Embed (The Events Calendar) into a WordPress sidebar.
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:
<style>
@scope {
iframe[data-tec-events-ece-iframe="true"] {
width: 100%;
max-width: 100%;
height: 600px!important;
}
}
</style>
<iframe
data-tec-events-ece-iframe="true"
src="https://votresite.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