Skip to main content

How to Add the Bikebook Workshop Widget to Your Website

This guide explains how to integrate the bikebook Workshop Widget into your website with ease. The process is straightforward and designed to help you display your workshop information in a way that suits your website’s look.

Updated over 2 months ago

Get Your Bikebook Widget Rolling

First, log in to your Bikebook account and head to Widget Settings. You can get there two ways:

You'll find your code – it's pre-configured with your ID and colour choices. This prevents you from using the wrong info.

What is the Widget About?

This widget lets your customers connect with your shop right from your website. Choose from:

  • Inline Widget: Puts the widget directly on your webpage.

  • Popup Widget: Shows up when someone clicks a button you set up. You can customise both to match your shop's colours.

Installing the Widget

Inline Widget:

  1. Grab the Code: Copy the code snippet from your Widget Settings page. It is ready to go!

  2. Paste and Go: Add a Custom HTML block to your website builder (like Wix, WordPress, or Squarespace) and paste the code. No need to change anything.

  3. Resize (Optional): If you need to adjust the widget's size, tweak the pixel values in the code's style attributes.

Popup Widget:

  1. Add the Files: Paste the link and script tags from your Widget Settings page into your website's `<head>` section. This loads the widget's style and function.

  2. Set the Trigger: Use the popup code snippet (from Widget Settings) for your button's "onclick" event. It has already got your ID and colours.

Now, when someone clicks the button, your widget pops up!

That's It!

Following these steps makes setting up your Bikebook widget a breeze. We've pre-set everything, so you can focus on getting your shop online and reaching more customers. Happy wrenching!

Did this answer your question?