Embed bookafy | bookafy

How to display the scheduling page for users of your app

First, you can embed our booking application within your website, without the API. We offer button code and and Iframe, both can be found in the integrations page You can display the scheduling page for users of your app when you initialize one of three embed types based on information from the API such as the scheduling page link. To do this, you’ll need to generate an OAuth or personal access token for either public or private use, respectively.

To display the landing page of a specific user

  1. To display the current user’s landing page link, make a call /users/me to retrieve current user’s details. The landing page link can be found in the scheduling_url property. Proceed to step 4.

  2. To retrieve a specific user’s landing page link in an organization, use a personal access token generated by an admin or owner, then make a call to /organization_memberships including the organization query parameter in your request to get a list of users in the organization. Each returned user will have a scheduling_url property which contains the landing page link. Proceed to step 4

  3. To display the event scheduling page of a specific user, make a call to /event_types to get a list of event types associated with a user or an organization. The event type’s link can be found in the scheduling_url property. Proceed to step 4

  4. To use the link to initialize an embed, replace the myLink variable with the landing page link or event type link found in the scheduling_url property.

    1. To initilize an inline embed, use bookafy.initInlineWidget({url: myLink});

    2. To initialize a pop-up embed, use bookafy.initPopupWidget({url: myLink});

    3. to intialize a pop-up text embed, use bookafyinitBadgeWidget({ url: myLink, text: 'Schedule time with me', color: '#006bff', textColor: '#ffffff', branding: true });
      Note: The pop-up widget will require you to pass extra information when initializing the embed which define the floating button’s text and style.

To pass UTM and pre-filled information to each embed type, see the advanced embed options Help Center article.