Now is your last chance to buy a lifetime license before we switch to annual pricing. Existing licenses will be unaffected.
read more

How to Setup The Events Calendar with Oxygen

How to Setup The Events Calendar with Oxygen

Updated: March 28th, 2023, for v6 of The Events Calendar.

In this tutorial, learn how to set up The Events Calendar to work with Oxygen.

Setup:

To begin, install The Events Calendar plugin and Oxygen on a website.

Creating the Events Template:

After setting up both Oxygen and The Events Calendar, it is time to create an Events template. To do this, go to Oxygen > Templates in /wp-admin and create a new template. In this example, we'll call it "Events," but you can name it whatever you'd like.

Next, set the template to inherit your Main template, and then set the template to apply to the following scenarios:

  • Singular > Events
  • Archive > Post Types > tribe_events

Lastly, you may also need to set the priority to a higher number if any other templates could be applied to the event pages or events archive on the front end. You can read more about templating in our Templating Overview documentation.

With your template settings complete, save and publish the template. Then open it in Oxygen.

Editing the template in Oxygen:

After Oxygen is open, you'll need to add some custom code to the template to display information from The Events Calendar plugin. There are two ways to add this code, and you can choose either option.

Option 1 - Manually add the elements:

First, add a Section element to your template via +Add > Basics > Section. Now, add a Code Block inside the Section element via +Add > Basic > Code Block.

Next, select the Code Block element, go to the PHP & HTML tab, and add the following PHP to the Code Block element:

Option 2 - Cross-Site Copy the elements:

As an alternative to the steps mentioned above, if you're using Oxygen 4.1 or later, you can import the entire Section with the Code Block mentioned above by copying the JSON below and importing it into your site (how to use Cross-Site Copy and Paste in Oxygen):

Conclusion:

After you have added the necessary code using either option above, save your template. You should now see both the Single Event and Events archive pages should work as expected, and no additional steps are necessary.

You should now be able to customize your layouts and site as desired!

2 comments on “How to Setup The Events Calendar with Oxygen”

Leave a Reply

Your email address will not be published. Required fields are marked *

Author
Phe Simmonds
Phe Simmonds

Follow along with this tutorial

Create Test Install

Get Oxygen Today

Lifetime, unlimited site license

Need more help?

Copyright © 2024 Soflyy
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram