How to Embed a Calendar into WordPress

Posted on by Prakash Tiwari
Embed a Calendar

Adding a calendar to your WordPress site can improve user engagement and inform visitors about events, appointments, or important dates. Whether you want to display an event calendar, booking calendar, or schedule, embedding one in WordPress is simple. 

This article will show you the best ways to embed a calendar without coding skills.

Method 1: Embed a Calendar Using a Plugin

Plugins make it easy to embed calendars in WordPress. Many plugins offer customizable features, making it simple to display your calendar the way you want. Follow these steps to use a plugin.

Step 1: Choose a Plugin

Search for a calendar plugin in the WordPress Plugin Directory. Popular options include:

  • The Events Calendar (great for events and schedules)
  • Simple Calendar – Google Calendar Plugin (connects with Google Calendar)
  • Amelia (ideal for bookings and appointments)

Step 2: Install and Activate the Plugin

  1. Go to Plugins > Add New in your WordPress dashboard.
  2. Search for the calendar plugin you want.
  3. Click Install Now next to the plugin name.
  4. After installation, click Activate to enable the plugin.

Step 3: Set Up the Plugin

Once activated, the plugin usually adds a new menu in your WordPress dashboard. For example:

  • Go to Events > Settings to configure your calendar for The Events Calendar.
  • For Simple Calendar, connect your Google Calendar by following the setup instructions.

Step 4: Embed the Calendar

Most calendar plugins provide shortcodes to display the calendar on your site.

  1. Copy the shortcode from the plugin’s settings page.
  2. Go to the page or post where you want to display the calendar.
  3. Add a Shortcode Block in the WordPress editor.
  4. Paste the shortcode and click Update or Publish.

Your calendar will now appear on the front end of your site.

Method 2: Embed a Google Calendar

You can embed it directly into WordPress without a plugin if you already use Google Calendar.

Step 1: Make Your Google Calendar Public

  1. Open Google Calendar on your browser.
  2. Go to Settings by clicking the gear icon in the top-right corner.
  3. Select Settings for my calendars from the left-hand menu.
  4. Choose the calendar you want to embed.
  5. Under Access permissions for events, check the box labeled Make available to the public.
  6. Confirm your changes.

Step 2: Get the Embed Code

  1. Go back to the settings on your calendar.
  2. Scroll down to Integrate calendar.
  3. Copy the code under Embed code.

Step 3: Add the Embed Code to WordPress

  1. In your WordPress dashboard, go to the page or post where you want to display the calendar.
  2. Add a Custom HTML Block in the WordPress editor.
  3. Paste the embed code from Google Calendar.
  4. Click Update or Publish to save your changes.

The calendar will now show up on your site.

Method 3: Embed a Calendar Using an iFrame

If you use an external calendar tool or platform, you can embed it in WordPress using an iFrame.

Step 1: Get the iFrame Code

Most calendar tools, like Microsoft Outlook or Calendly, provide an iFrame embed code.

  1. Open your calendar tool and go to its sharing or embed settings.
  2. Copy the iFrame embed code.

Step 2: Add the iFrame Code to WordPress

  1. Go to the page or post where you want to embed the calendar.
  2. Add a Custom HTML Block in the WordPress editor.
  3. Paste the iFrame code.
  4. Click Update or Publish.

The calendar will be displayed on the front end of your site.

Tips for Customizing Your Calendar

Adjust the Size:
 Modify the height and width in the embed code to fit your site layout. Example:

    <iframe src=”your-calendar-url” width=”800″ height=”600″></iframe>
    Change Colors:
     Some plugins and tools let you customize calendar colors to match your site’s design.
    Add Filters:
     Use plugins like The Events Calendar to add categories or tags, making it easier for users to filter events.
    Make It Mobile-Friendly:
     Ensure the calendar is responsive so it displays well on all devices. Most plugins have responsive features built in.

      Conclusion

      Embedding a calendar in WordPress is simple and adds significant functionality to your site. Whether you use a plugin, Google Calendar, or an iframe, the process is easy and requires no technical expertise. Follow these steps to keep your visitors informed and engaged. With a calendar on your site, you can manage events, bookings, and schedules effortlessly.