With just a few clicks, choose how to display the schedule on your website: show all classes or only selected types (with an optional start date), display selected teachers, and display selected branches.
Display only selected class types in the schedule
-
Go to your YOGO admin → 'Class Types'
-
Click on the class type you want to display in the schedule.
-
Copy the class type ID from the URL bar (see the animation below).
Go to your website and find the page where the schedule should be displayed.
Wordpress
To display the entire schedule, use the following code:
[yogo-calendar]
Display only selected classes:
[yogo-calendar class-types="xxxx"]
The ID you just copied replaces 'xxxx'. If you want to display more than one class type, simply separate the IDs with a comma.
Other website types, e.g., Squarespace, Wix, etc.
To display the full schedule, use the following code:
<div class="yogo-calendar"></div>
Display only selected classes:
<div class="yogo-calendar" data-class-types="xxxx"></div>
Display schedule from an optional start date.
If you want the schedule to be displayed from a specific date, you can insert the following code. When the start date has passed, it will simply continue to display from the current date.
Wordpress:
[yogo-calendar start-date="29/8-2022"]
Other website types, such as Squarespace, Wix, etc.
<div class="yogo-calendar" data-start-date="29/9-2022"></div>
The above can also be combined to display selected class types and an optional start date. In that case, it will look like this:
Wordpress:
[yogo-calendar class-types="xxxx" start-date="29/8-2022"]
Other website types, such as Squarespace, Wix, etc.
<div class="yogo-calendar" data-class-types="xxxx" data-start-date="29/9-2022"></div>
Display only selected teachers in the schedule
If you want the schedule to display a specific teacher or teachers, you can insert the following code:
Wordpress
Other website types, such as Squarespace, Wix, etc.
<div class="yogo-calendar" data-teacher="1234"></div>
If you want the schedule to display more than one teacher
<div class="yogo-calendar" data-teachers="1234, 1234, 1234"></div>
1234 is the teacher ID
Display only selected branches in the schedule
If you have more than one location enabled on YOGO and want the schedule to display a specific branch, you can use the following code:
Wordpress
[yogo-calendar branch="XXXXX"]
XXXXX is the branch name, which you can find in YOGO Admin -> Settings -> Branches.
Other website types, such as Squarespace, Wix, etc.
<div class="yogo-calendar" data-branch="XXXX"></div>
XXXXX is the branch name, which you can find in YOGO Admin -> Settings -> Branches.