🎓Course

A widget Course lets you integrate a specific course into your product or website to deliver contextual education.

Create a widget

To create a widget, click on the New button in the top left-hand corner. A drawer opens:

• Choose the rendering mode for your widget:

  • Embed: the widget appears as an embed and you can integrate it anywhere on your site or application.

  • Modal: the widget is in a window opened with a button.

  • Drawer: the widget is in a side panel opened with a button.

• Enter a title. 💡 This title will not be visible in the widget integrated into your application.

• Select a course using the search bar.

• Click on Create: that's it, your widget is ready to be integrated! 👉 Find out more here.

Edit a widget

You can edit a widget in two different ways:

• From the widget list, by clicking on the three small dots to the right of a widget's card and then on Edit.

• From the widget preview window, click on Edit.

The widget drawer opens, where you can edit :

• The widget's rendering type. Warning, switching your widget type requires you to update the code.

• The widget title

• The selected course: simply click on the X button at the top right of the selected course and use the search bar to find the required course.

Once you've made all your changes, you can save the widget by clicking on Save.

Widget preview

The widget preview depends on its rendering type:

• If it's an Embed or Modale widget: When you click on a widget card, a window opens. In this window, you can see a preview of the widget's rendering in your application or site (in the case of an embed, grey zones materialize the content of your site).

• If it's a Drawer widget: when you click on a widget's card, a side panel opens. Here you can see a preview of how the widget will look in your application or site.

At the bottom of the modal, there are several buttons:

• Get code: gives you the choice between sending the widget code directly by e-mail (with Send instructions) or retrieving and copying the widget code (with Copy code).
• Edit: opens the editing drawer.

Preview of a modal widget

Widget display

Many members of your site or application will be able to access your widget. Don't worry, they will only see the course if they have access to it:

• If the member is logged in and has access to the course, they will see the course and be able to complete their steps.

• If the member is not logged in and the course is public, they will only see the introductory stage of the course and will not be able to navigate through the stages.

• If the member does not have access to the course (because it is secret), they will not be able to view the course.

If the member completes one or more stages of a course from a widget, the corresponding activities will be taken into account and you will be able to find them in the Dashboard page of your Spot settings.

To ensure that the user sees the widget content while logged in, we recommend that you set up SSO authentication in the widget integration space.

🔑Single Sign-On

Once SSO has been set up, the JWT token authenticating the user can be transmitted directly to the widget script. Find out more here.

Deleting a widget

There are 2 ways to delete a widget:

• From the widget card, click on the three small dots on the right, then on Delete.

• From the widget editing drawer, click on the three small dots in the top right-hand corner, then on Delete.

Clicking on either of these two buttons opens a confirmation window.

Warning, all deletions are final!

If you delete a widget in your Spot settings, we recommend you also remove it in the code of your application or site - no worries if you forget, your members will only see an empty insert 😉