Tutor LMS – Course Tags Element

Overview

The Course Tags element in Tutor LMS displays a list of tags associated with the current course. Tags help categorize courses, making it easier for students to find relevant content. This element provides customization options for styling, alignment, and label settings.

Features

• Displays course tags as buttons.
• Provides label customization for better clarity.
• Includes styling options for buttons, text, and background.
• Allows direct links on tags for easy navigation.
• Supports alignment settings (left, center, right).

Available Controls

Content Controls

1. Enable/Disable Label – Option to show/hide the label for course tags.
2. Custom Label – Set a custom label text (e.g., “Tags:”, “Course Topics”, etc.).
3. Enable Tag Buttons – Display tags as clickable buttons.
4. Enable Direct Links – Tags will be clickable and redirect to related course lists.
5. Alignment Options – Align tags to left, center, or right.

Style Controls

Label Styling

1. Label Color – Customize the color of the label text.
2. Label Typography – Adjust font size, weight, and style.

Tag Button Styling

3. Tag Text Color – Change the color of tag text.
4. Tag Background Color – Customize the tag button background.
5. Tag Border – Adjust border width, style, and color.
6. Tag Padding & Spacing – Modify padding inside the button and spacing between tags.
7. Tag Hover Effects – Set hover background and text color for better interaction.

Alignment & Layout Styling

8. Alignment Settings – Align tags to left, center, or right.
9. Tag Display – Choose between inline or block layout for tag buttons.

Dynamic Behavior

• The Course Tags element automatically fetches and displays tags assigned to the current course.
• If the course has no tags, the element remains hidden.
• Users can click on tags to view other courses with the same tag.

Use Case

• Enhances course navigation by grouping related courses.
• Helps improve course discoverability through categorized tags.
• Can be placed anywhere on the course page, such as near the course title or description.