Filtering your public booking page or iframe helps show your bookers specific events on your schedule when creating filter buttons or embedding different iframes within your website.

This guide covers:

Your unfiltered public booking page URL will look like this (this example page is called grow):

https://bookwhen.com/grow

You can find this link at the top of your schedule page:



How to create filters

The public page can be filtered by dates, locations, entries and tags. This is done by adding filters to the URL.

We have a Google Sheet that can help you to construct both filtered links and filter buttons. Click here to open the Google sheet, then select Make a copy and follow the instructions.

If you prefer to construct your filtered link manually, just follow the steps outlined below.


Date Filters

To filter your page to only show events from a specific date onwards, add the following filter to the end of your public booking page URL:

?start=2022-01-01

You must ensure the date format is - YYYY-MM-DD.

For example:

https://bookwhen.com/grow?start=2022-01-01


Location Filters

To filter your entries by a specific location, you will need the unique location code, which you can find on that location's edit page. You can find your locations under Settings then Locations:

Then select the location you wish to filter by and the Edit button:

You can then copy the code from the URL in the search bar:

You can now create your filter URL. In this case, the URL would need to be appended with ?location=epojhv6suohe

For example:

https://bookwhen.com/grow?location=epojhv6suohe

Please note that the filtered URL will only show entries with this exact location.


Entry Filters

Entry Filters work in the same way as location filters. You can get the entry code from the URL by selecting the Entry, then Edit Entry:

You can find find the code in the search bar:

Your filter URL, in this case, would be appended with ?entry=8yr7put8ede4

For example:

https://bookwhen.com/example?entry=8yr7put8ede4


If you wanted to filter on multiple entries, we would recommend using tags; see below.


Tag Filters

Tags are a great way to group different entries. For example, you might want a tag for your adult classes and your children's classes. 

Tag 1 = adults
Tag 2 = children

Once you've applied these tags to your relevant entries, you can easily filter by these by just adding ?tags=adults or ?tags=children

For example:

https://bookwhen.com/example?tags=adults

https://bookwhen.com/example?tags=children


Please note:

  • Tags are case sensitive, so make sure your URL reflects any capitals in the tag.

  • It's best to keep your tags as simple as possible and avoid using any special characters.

  • If your tags have spaces, like "adult classes", you will need to replace the space in the tag in the URL with a '+' like this:

https://bookwhen.com/example?tags=adult+classes


Using your filters

Now that you've created filter URLs, you can insert them to make navigating your booking page easier for your customers.

In your public page description, you can either link out to your filtered pages, create hyperlinks or use create filter buttons like this:

Read how to create filter buttons here and view the above as a live example here.


Filtering iframes

You can filter iframes in the same way as you would filter a public page URL. To find your iframe code, select Page Setup on your public page:

If for example, you have copied the following iframe code from the public page settings:

<iframe src="https://bookwhen.com/example/iframe" frameborder="0" scrolling="yes" seamless="seamless" style="display:block;border:none;width:100%;height:900px;"></iframe>

You would modify the URL in the iframe code by adding the filter section to the end. For example, if you'd like to filter it by date, it would look like this: https://bookwhen.com/example/iframe?start=2020-01-01

This means the iframe code you end up using will look something like this:

<iframe src="https://bookwhen.com/example/iframe?start=2020-01-01" frameborder="0" scrolling="yes" seamless="seamless" style="display:block;border:none;width:100%;height:900px;"></iframe>

Did this answer your question?