creating category specific versions of OBW

We are often asked if you can do the following; have product specific pages on your website that deep-link into specific categories of product in your online booking wizard.

Here is how you do that:

  • Create a web-page that contains details about your specific content.
  • include a link (perhaps on a button) that deep-links into your chosen category..

like this:

If you wanted to show multiple categories, just use a comma to separate:,Road

here is how it could look on your page:

here is a working example on our website:

And here is what the HTML actually looks like.  We don't do this bit for you.  It will depend on your website and your website editor.  You web-developer should be able to do this for you.

We use Wordpress, and specifically Visual Studio plugin on our website.

<div class="wpb_wrapper">

<p><strong>Mountain Bikes</strong> &#8211; here you list all the cool features of your mountain bikes<img class="alignnone size-full wp-image-3415" src="" alt="" width="512" height="337" srcset=" 512w, 300w" sizes="(max-width: 512px) 100vw, 512px" /></p>



</div></div></div><div class="wpb_column vc_column_container vc_col-sm-6 vc_col-has-fill"><div class="vc_column-inner vc_custom_1513252357491"><div class="wpb_wrapper"><a href=";categories=Mountain" class="btn-shortcode dt-btn-m dt-btn default-btn-color default-btn-hover-color default-btn-bg-color default-btn-bg-hover-color" target="_blank" id="dt-btn-1"><span>Book Now!</span></a></div></div></div></div><div class="vc_row wpb_row vc_row-fluid dt-default" style="margin-top: 0px;margin-bottom: 0px"><div class="wpb_column vc_column_container vc_col-sm-6"><div class="vc_column-inner "><div class="wpb_wrapper">

<div class="wpb_text_column wpb_content_element " >

<div class="wpb_wrapper">

Some more detailed notes about getting it to work for 'real' category names.

What if you have 'complex' category names?  like:

'Mountain | Full Suspension'

'Road | Hybrid'

how do you get that to work?

well, this is the internet, and URLs have very specific rules about how it works

  1. spaces must be changed to %20
  2. case sensitive;  M is not the same as m

so using those rules we come up with: