In this How To guide, we will be showing you how to embed Appointment booking functionality in CCLE and other pages/apps.
First, you will create a widget in LibCal. From your appointment page, click on "Widget/Embed Code". | |
Here, you have some options. You can change what the button will say by changing the "Button Text" (it defaults to "Schedule Appointment"). | |
You can also change the default colors (black, grey, and white). You'll see the changes appear on the preview button. | |
Important: Do not include a jQuery Library if you are embedding this button in a LibGuide. It will break the functionality of your research guide (you won't be able to edit it anymore) and Springshare will have to assist you in fixing it. | |
Once you have styled your button as you like it, copy the embed code. You can place this embed code in a number of places. | |
If you would like it to be linked to your account in LibGuides, go to your account box and click the pen in the top right corner. | |
Scroll down. Copy and paste the embed code into the LibCal Widget Code box. It will now appear in your profile as seen above. | |
Now, you can simply map this profile box to your LibGuide and it will appear in your guide. Click "Add Box". For the type of box, choose "Profile". Now, type your name. Click save. | |
Your profile box with Schedule button is now embedded in your LibGuide. | |
Similarly, you can embed this button in CCLE by switching your editing to Source/HTML instead of regular text editing. (In |
Canvas, it's called HTML. In LibGuides, it's called Source.) HTML editing is usually represented by the symbol </>. Once you paste your embed code and switch back to regular text, you will see your Schedule Appointment button. | |
Note: if you're in |
Canvas, it may not have proper styling at this point. | |
Once you click "Save and Display", you'll see it properly styled. |
For assistance with the LibCal widget, please submit a Jira ticket to the LibApps team. Thank you!