About
When using the Learning path widget, courses can be displayed in specific interactive areas called zones. To configure these, you must set the positioning option to "In zones" within the Fields preferences of the widget and then select "Configure zones" to open the configuration modal.
Available information
The configure zones modal is divided into three tabs: Desktop, Tablet, and Mobile. Each device type must be configured individually to ensure the path remains responsive.
The modal interface provides the following tools:
Zone preview – A visual display on the left that shows the recognized zones and their placement.
Zone list – A list on the right side of the modal showing all valid SVG elements identified as zones, organized by their group ID.
Interactive highlighting – Hovering over an item in the zone list highlights the corresponding area in the zone preview and vice versa.
How to assign a course to a zone
By default, all recognized zones are disabled. To assign a course to a zone, follow these steps:
Open the selection menu for a specific zone in the zone list.
Choose one of the following assignment options:
Assign course automatically – The widget will automatically assign an available course to this zone.
Assign course manually – Use the search field to select a specific course from the searchable dropdown menu to pin it to this exact location.
Save changes to apply the zone mapping to your widget.