CrankPal Documentation
Open the app

Setup

Customer portal and widget

What a customer can do in the customer area, how to brand it, and how to put the booking form on your own website.

Every workshop on CrankPal has a customer portal at its own address, for example laciclabile.crankpal.com. That address is public: it is the default view for anyone who opens it, and it is where your customers log in to see how the bike is doing, answer an approval request or book a slot. The staff app sits at the same address followed by /login.

Here you decide how that portal looks, and you pick up the widget code to paste into your own website, if you already have one. The page is under SettingsPortal & widget: it needs the manage_workshop permission.

What someone without an account sees#

Anyone opening your address without an account doesn't hit a closed door: next to the login form sits your shop front, with

  • name, full address, clickable phone and email, website;
  • your opening hours day by day, with a badge saying whether you are open or closed right now;
  • a map with your location and a directions button;
  • the list of bookable services, with duration and price including VAT;
  • a link to your Google reviews, if you set one on the workshop profile.

Below the shop front sits the appointment request form, and no account is needed to use it: the visitor picks a service, then a day and a time from genuinely free slots, leaves their contact details, and the request reaches you in Bookings as "to confirm". CrankPal creates the customer record automatically and offers them the option of opening an account.

What the customer sees#

Once inside the customer area, a customer finds:

  • an overview with their details and jobs in progress, highlighting approval requests still waiting on them;
  • your workshop page, with contacts and opening hours, from which they request an appointment;
  • my workshops: the list of workshops they have given access to. From there they accept or decline your invitation, and they can also revoke your access to their data: the cyclist's account belongs to them, not to you;
  • my bikes: the bicycles registered with you;
  • quotes, approvals and jobs: this is where they answer requests for extra work and follow their repairs;
  • invoices, with the outstanding balance at the top. If the document has a payment link, a Pay now button appears next to it;
  • messages, to write to you.

If you entered your Google reviews link in the workshop profile, the portal shows the customer a link to leave a review. See workshop profile and hours.

The look of the portal#

The portal already uses your workshop's logo and name, taken from the profile: you don't re-enter them here. What you choose on this page is:

  • the brand colour, which tints the buttons and accents of the customer area (there's a preview next to the picker);
  • an optional welcome message, up to 300 characters. It's the right place for one concrete line — what they can do from there — not for a slogan.

You save with Save customisation and the change is live straight away.

The widget for your website#

If you already have a website, there's no need to send customers elsewhere: you can embed two panels directly into your pages.

  • Booking card — the appointment request form.
  • Customer area login — the portal login.

Both brand themselves with your logo, name and colour. Next to each you get Preview, to see it before publishing, and Copy HTML, which puts the code on your clipboard: you paste it into the page of your site where you want it to appear.

The widgets need the workshop to have its own address (the profile slug). If it's missing, the copy button stays disabled and the page tells you so.

Authorize your site's domain#

For security the widget only lets itself be embedded by domains you have authorized: if you paste it onto a site that isn't authorized, the browser blocks it and a blank space is left where the panel should be. That isn't your mistake, it's the protection that stops any random site from reproducing your login form.

You manage the list yourself, in the same Widget for your website panel, above the two snippets:

  1. Add domain and type your site's address, for example www.yourshop.com.
  2. Save domains. The change is immediate: reload your site's page and the widget appears.

A few rules, all for the same reason — that list is a security setting:

  • https addresses only (localhost is the exception, for anyone testing locally);
  • no asterisks: *.yourshop.com isn't allowed, subdomains go in one by one;
  • apex and www count together: authorizing yourshop.com also covers www.yourshop.com, and the other way round;
  • up to 10 domains, enough for several sites or languages;
  • it takes owner permission: other staff members see the list but can't change it.

Common problems#

I changed the colour but the portal looks the same.

Reload the portal page: the colour is read when it opens. If the text field holds something that isn't a colour in #rrggbb form, it's ignored.

“Copy HTML” is disabled.

The workshop has no slug, that is, no address of its own. Set it in the workshop profile and the widgets switch on.

I pasted the code on my site but I see a blank panel.

Almost always it's a domain that hasn't been authorized yet: add it under Authorized domains of your site and reload. Check it's the same address that shows in the browser bar when you visit your site (with or without www makes no difference, but shop.com and shop.co.uk are two different domains). It's also worth checking that you pasted all the copied code, not just the first line.

I saved a domain and it says it isn't valid.

The list only accepts https addresses without asterisks: *.yourshop.com, http://yourshop.com and IP addresses are rejected, and the message tells you which entry. Type the domain on its own, with no trailing /page.

A customer can't book from the portal.

Check that you have services ticked as Bookable in the service catalog and that opening hours are set. If the workshop isn't taking bookings at the moment, the portal says so explicitly to the customer.