If you wish to embed a specific filtered view of your online booking calendar, this article is for you.
Currently you can filter your online booking according the following criteria:
Event Type (Classes, Special Events, Appointments)
Location
Trainer
Choose the filtered view you would like to embed
Open your online booking calendar in a browser page. If you are not sure go to Settings > Online Booking Calendar > Share Your Calendar. Copy the link, open a new browser page and paste it.
On the right-hand side, you will now see all available filters. Select the filter you want to use to create a "filtered" view of the calendar.
Copy the URL that is shown in the address bar
Get the code to embed
Go back to FitogramPro and go to Settings > Online Booking Calendar > Share Your Calendar > Integration.
Under Integration you choose "Embed on website" > Iframe
Copy the code
In the code, replace https://widget.fitogram.pro/your_domain with the URL you previously copied
⚠️ Please note that "?fito-embedded=true" should remain part of the URL
Paste the code into your website
Example:
This is the standard HTML iframe code copied from FitogramPro:
<!-- Fitogram Booking Tool starts here -->
<iframe
frameborder="0"
scrolling="yes"
src="https://widget.fitogram.pro/my_domain/?fito-embedded=true&w=/list-view"
width="100%"
height="800px">
</iframe>
<!-- Fitogram Booking Tool ends here -->
I would like to show only my appointments. The URL of this filtered view is https://widget.fitogram.pro/my_domain/?f=type/Appointment&w=/list-view
So, the code for my filtered view will look like this:
<!-- Fitogram Booking Tool starts here -->
<iframe
frameborder="0"
scrolling="yes"
src="https://widget.fitogram.pro/my_domain/?f=type/Appointment&w=/list-view"
width="100%"
height="800px">
</iframe>
<!-- Fitogram Booking Tool ends here -->
#link booking tool #show booking tool on my website #link calendar #show calendar online