If you manage events, schedules, classes, performances, or announcements, adding a live calendar to your website can massively improve how your audience stays informed. At UpTo (UpTo.com), we’ve made this incredibly simple: every calendar you create comes with a copy-and-paste embed snippet that works on any WordPress site—no plugins required.
Below is a quick guide on how to add your UpTo calendar to WordPress using three common approaches:
- The WordPress Block Editor (Gutenberg)
- Page Builders like Elementor
- Direct theme or template placement for advanced users
Your UpTo Embed Snippet
When you create an embeddable calendar in UpTo, you’ll receive a snippet that looks something like this:
<div id="upto-calendar-container-LAaO" class="upto-calendar-plugin"><script>!function(c,b,a){function d(h){var e=document.getElementById("upto-calendar-container-"+c),f=document.createElement("SCRIPT"),g="https://upto.com/js/plugin.js";f.onreadystatechange=function(){if(f.readyState==="loaded"||f.readyState==="complete"){f.onreadystatechange=null;h()}};f.onload=function(){h()};f.setAttribute("src",g);e.parentNode.insertBefore(f,e)}d(function(){upto.init(c)})}("LAaO");</script></div>
Just paste it in—WordPress will handle the rest.
Option 1: Embed Using the WordPress Block Editor (Gutenberg)
This is the easiest method, and it requires no plugins at all.
Steps
Open the page or post where you want your calendar to appear.- Click the + icon to add a new block.
- Choose Custom HTML.
- Paste in your UpTo embed snippet.
- Click Preview to confirm it displays correctly.
- Publish or update the page.
- Works instantly
- No extra WordPress plugins
- Ideal for most users
Option 2: Embed in Elementor
If your site uses Elementor, embedding the calendar is just as easy.
Steps
Open your page with Elementor.- Drag the HTML widget into the section where the calendar should appear.
- Paste the UpTo embed snippet into the widget’s HTML field.
- Click Update.
If the calendar looks clipped or cut off
Some layouts restrict overflow. To fix this:
- Edit the container/section
- Set Overflow: Visible
- Or adjust padding so the calendar has breathing room
Elementor handles the script injection cleanly—no compatibility issues.
Option 3: Embedding in a Theme Template (Advanced)
For those who want their UpTo calendar hard-coded into a layout:
Steps
- Open your theme or child theme’s template file (e.g.,
page.php, a custom template, or a widget area). - Insert the embed snippet wherever you want the calendar to appear.
- Save and upload changes.
This is perfect for:
- Event-driven websites
- Theater and venue sites
- Schools, churches, nonprofits
- SaaS or community platforms needing persistent scheduling
Why UpTo Makes Embedding So Easy
We designed the calendar embed to be:
- Lightweight (loads asynchronously)
- Style-friendly (inherits your site’s design)
- Mobile-first
- Zero-configuration
Just drop it in and go—your events update automatically as you manage them inside UpTo.
Whether you’re using standard WordPress, Elementor, or custom templates, embedding an UpTo calendar takes less than a minute. It’s one of the fastest ways to bring dynamic, live scheduling into your website without maintaining plugins or fighting with code.
If you haven’t set up your UpTo calendar yet, you can get started at: UpTo.com