Skip to main content
New booking tools - Widgets 2.0 (multi-account)

Learn how to create and manage the new Widgets 2.0 when a user has access to multiple account

Ruta Vareikaite avatar
Written by Ruta Vareikaite
Updated over a week ago

๐Ÿฐ Multi-account user access

In some instances, one user may have access to more than one Appointedd account. Click here to learn more about multi-account structure.

The new booking Widgets 2.0 support multi-account structure, meaning that not only can you have one booking tools across multiple locations/business operations, but also benefit from additional functionality such as address finder and map locator. Introduction to Widgets 2.0 can be found here.

If your business has a single account, or you currently use a booking page rather than widgets, you may be interested in the below support articles:


๐ŸŒ Interactive examples to draw inspiration from

Feel free to make test bookings with the below widgets in URL format to explore various functionalities:

  • Multi-location - event list view for a specific event bookings with location list functionality - click here;

  • Multi-location widget with service and resource selection and map functionality - click here;

  • Multi-location widget with service and resource selection and location list functionality - click here;

  • Single location with service and resource selection - click here.

  • Single location - event list view for a specific event bookings - click here;


๐Ÿ”– How to create a multi-account booking widget

Follow the below steps to create your widget:

  1. Navigate to the Booking tools tab and select Manage booking widgets;

  2. Make sure you are on Widgets 2.0 tab and select + Create new button;

  3. Give a name to your widget (only visible internally for labelling purposes);

  4. Select whether you would like to include specific services or all services under a specific category that will widget will allow customers to book;

  5. Based on what you've selected in step 4, you will be able to assign services or categories to this widget from each account that you have access to - simply click on the pencil icon next to the accounts and select which services/categories should be included to the widget:

    6. When you click on an account name in the account list, a pop-up will display all services created on that account - simply tick which services you wish to make bookable via this widget and click Apply.

    In this step you can also determine the view that your service availability will be displayed:

    • Calendar;

    • Event view;

    • Custom (a mix between calendar and event view on a per service level)

      Learn more about the availability by scrolling down or by clicking here.

  6. Repeat this process to include services from other accounts or use +Bulk add functionality if the services across accounts have the same names. Learn more about Bulk add functionality.
    โ€‹
    Once you've added the relevant accounts, you'll see all enabled accounts with green ticks as well as the number of services applied per account and service availability view.

  7. If only one service per account is selected, you can tick the 'Hide service selection' box which would pre-select this service and take

  8. You can choose to include an interactive map to the booking flow by ticking the checkbox otherwise the account/location selection will show in a list format. Learn more about account selection here.
    โ€‹

  9. You will then need to define whether you wish to let the customers choose a resource or resource group and how this selection appears on the widget:

  10. Add your brand colours and custom fonts if you wish and save the widget.

  11. Once a widget is created, you can get the appropriate format of your widget by selecting one of the below:


๐Ÿง What are the different types of widgets and which one should I use?

A booking widget is a tool that's used to allow your customers to make bookings with your business.

There are various ways you can share your booking tools with your customers, and at Appointedd they come in three formats - embed, popover or URL.

Embed - add a snippet of code to your website that will embed your booking widget directly on your web page.

Popover - add a snippet of code to your website that will ad a book now button to your web page, triggering a small popup winder when clicked.

URL - a unique URL for your booking widget, hosted by Appointedd. Simply share it with your customers - no development effort needed.


๐Ÿ“† Calendar vs Event availability view

There are two views which your service availability can be displayed in - calendar and event.

We recommend you use:

  • Calendar view for those services where the availability is repeating on a regular basis or if there are a lot of various slots to choose from.
    โ€‹

  • Event list view when the availability is limited or if you wish to display the exact slots rather than the whole calendar.
    โ€‹

  • Custom selection when there are multiple services on the widget, and some services need to be in calendar view and some in event view - you will be able to further customise it in the following step:


โ€‹See below the difference between the two views:

  • Calendar availability view:

  • Event list availability view:


๐Ÿงฎ Bulk add functionality

Our bulk add functionality can be used to select services across multiple accounts all at once rather than enabling it on a per account basis.

This is extremely helpful in these situations, where:

  • a business has a lot of accounts and wish to make all accounts services bookable across selected accounts;

  • a business has a lot of accounts, where the services names are the same, and they wish to enable a specific service across all those accounts to be bookable on a widget.

Simply click on +Bulk Add button, tick which accounts should be included in your widget and select whether you wish to add All services across these accounts or search for a specific service.

Please note: The system will only display any specific service search results that are exact matches of the full service name.

If the exact service name match is found, the system will provide a number of accounts this service was found in.

You can then go ahead and select whether you wish this service to show in a calendar or event availability view.
โ€‹
Don't forget to click Add.


๐Ÿงญ Map functionality vs account list

1. Including the location search and map functionality

When the checkbox to include interactive map is ticket, the widget will apply a location finder search bar as the first step.

Please note: To ensure the map functionality works, you will first of all need to add account's coordinates (latitude and longitude) on each account.
โ€‹

Customers can either type in an address or use their location to search for the closest business locations. The results will display up to 6 accounts on the map.

The users can then either click on the locations on the map or from the list below and go ahead with the booking flow with services offered in that location.

2. Account list

Alternatively, if you'd rather have your customers choose their accounts from a list without a map instead, simply leave the checkbox empty. This way your customers will be presented with the account list in an alphabetical order to select their preferred account:

Click on the button below to check out our interactive widget example with the account list view:


๐ŸŽจ Branding

Colours

To change the colours of your booking widget, click on the colour box to choose from the colour picker or, if you have specific hex codes, paste or type them into the box below the colour picker.

Fonts

You can also apply custom fonts to your booking tool - simply switch ON the Custom Fonts toggle and apply your font URLs, which should point to a font file of format woff2 and be hosted on a server using HTTPS rather than HTTP.

Banner image

The banner image of the account will also apply to all widgets in URL format. This banner image can be added to the account via the Setup tab -> Edit business profile -> Banner image.

Service images

You can also apply service images which get displayed in the service selection step. To do this, go to the Setup tab -> Manage service -> Edit -> Image upload.

Resource images

If you offer resource selection to your customers, you can also upload images to the resource profile via the Setup tab -> Manage resources -> View info -> Edit resource -> Upload photo.
โ€‹

Please note: to show resource selection step and images, first make sure the account settings allow it by going to the Booking tools tab -> Customize your booking flow -> Service and resource selection and adjusting it accordingly. This will need to be adjusted in every account included in a widget.


โš™๏ธ Managing the widget list

All your saved widgets will show in a list which you can access via the Booking tools tab -> Manage booking widgets -> Widgets 2.0

  • To create a new widget, click on +Create new.

  • To edit an existing widget, click on the account name with the pencil icon.

  • To view how many different accounts this widget is across check the Accounts column.

  • To preview how this widget looks, select Preview.

  • To delete a widget, click on the Delete button next to it. You will be asked to confirm deletion and once it's been deleted, the action cannot be undone.


๐Ÿ”— How to view your widget in URL format

The widget URL will include the selected account's identifiable word (aka slug) in the link. This slug can be change by going to Booking tools tab -> Personalize your booking page -> Your booking page. If you don't see 'edit' next to the name, please get in touch with our support team to enable slug changes on your account.

If the selected account has a banner image in the profile information, a widget in URL mode will also display it.
โ€‹
In addition to this, you can also control whether the business name is displayed in the header of the widget by going to the Booking tools -> Personalise your booking page -> Show business name. We recommend keeping it either OFF or generic when there are multiple accounts added to the widget.


If you have any feedback we would love to hear it ๐Ÿ‘‚

Did this answer your question?