This documentation is about the smaller elements available in the Tutor LMS tab under the Single Course tab.
Title
You can use the Oxygen Builder text field editor to change the typography of the title
Rating
Use this tab to change the appearance of the course rating:
- Stars size: change the size of the star in the rating system. The units are in px (pixels)
- Stars Color: use this RGBA color picker to select the color of the stars in the rating system.
Author
Use this tab to change the attributes for the Course Author field
- Image
- Height: Select image height. The units are in px (pixels)
- Width: Select image width. The units are in px (pixels)
- Font Size: Change the font size of the icon text
- Line Height: Use this to tweak the text position
- Label: You can use the Oxygen Builder text field editor to change the typography of the Author Label.
- Name: You can use the Oxygen Builder text field editor to change the typography of the Author Name.
Level
Use this tab to edit the Course Level field
- Label: You can use the Oxygen Builder text field editor to change the typography of the Level Label.
- Value: You can use the Oxygen Builder text field editor to change the typography of the Level value text.
Share
This tab changes the visuals of the social share icons
- Layout: Select between left and right align
- Label: You can use the Oxygen Builder text field editor to change the typography of the “Share” label.
- Original Icon: You can use the Oxygen Builder text field editor to change the typography of the Share Icons without hover.
- Hovered Icon: You can use the Oxygen Builder text field editor to change the typography of the Share Icons with hover.
Categories
Typography: You can use the Oxygen Builder text field editor to change the typography of the categories page
Duration
Typography: You can use the Oxygen Builder text field editor to change the typography of the Duration value.
Total Enrolled
Typography: You can use the Oxygen Builder text field editor to change the typography of the Duration value.
Last Update
Use this tab to change the attributes for the Last Updated value
- Image
- Height: Select image height. The units are in px (pixels)
- Width: Select image width. The units are in px (pixels)
- Font Size: Change the font size of the icon text
- Line Height: Use this to tweak the text position
- Label: You can use the Oxygen Builder text field editor to change the typography of the Last Updated.
- Name: You can use the Oxygen Builder text field editor to change the typography of the Last Updated.
About
Use this tab to edit the About section of the course.
Heading: You can use the Oxygen Builder text field editor to change the typography of the About section’s heading.
Paragraph: You can use the Oxygen Builder text field editor to change the typography of the About section’s paragraph.
Description
Use this tab to edit the Description section of the course.
Heading: You can use the Oxygen Builder text field editor to change the typography of the Description section’s heading.
Paragraph: You can use the Oxygen Builder text field editor to change the typography of the About section’s paragraph.
Curriculum
This tab contains all the customization options for the header section:
- Header Title: You can use the Oxygen Builder text field editor to change the typography of the curriculum title.
- Header Info: You can use the Oxygen Builder text field editor to change the typography of the curriculum header info.
- Topic Title: You can use the Oxygen Builder text field editor to change the typography of the topic title.
- Lesson Icon:
- Size: Select the size of the icon
- Color: Select the color of the icon
- Lesson Title: You can use the Oxygen Builder text field editor to change the typography of the lesson title.
- Spacing: Select the padding to be applied around the curriculum section
Benefits
Use this tab to change the benefits section:
- Title: You can use the Oxygen Builder text field editor to change the typography of the Benefits section’s title.
- Icon:
- Size: Select the size of the icon
- Color: Select the color of the icon
- Typography: You can use the Oxygen Builder text field editor to change the typography of the About section’s paragraph.
- Spacing: Select the padding to be applied around the benefits section
Requirements
Title: You can use the Oxygen Builder text field editor to change the typography of the requirements title
Content:
- Icon
- Color: Select the color of the icon
- Size: Select the size of the icon
- Typography: You can use the Oxygen Builder text field editor to change the typography of the requirements text
- Spacing
- Items Padding: Select the padding applied around the section
- Line Height: Select the vertical spacing between lines.
Target Audience
Title: You can use the Oxygen Builder text field editor to change the typography of the target audience text
Icon:
- Color: Select the color of the rating stars
- Size: Select the size of the rating stars
Typography: You can use the Oxygen Builder text field editor to change the typography of the target audience text
Spacing:
- Items Padding: Select the padding applied around the section
- Line Height: Select the vertical spacing between lines.
Materials
Title: You can use the Oxygen Builder text field editor to change the typography of the materials title
Icon:
- Color: Select the color of the rating stars
- Size: Select the size of the rating stars
Typography: You can use the Oxygen Builder text field editor to change the typography of the materials text
Spacing:
- Items Padding: Select the padding applied around the section
- Line Height: Select the vertical spacing between lines.
Thumbnail
Original Thumbnails: Change the look of the original video thumbnail.
- Opacity: Change the opacity of the thumbnail
- Background Color: Change the color of the thumbnail background
- Border Color: Change the color of the thumbnail border
- Border Width: Change the border width
- Margin: Add a margin around the video thumbnail
- Box Shadow: Toggle between inset and outset shadow
- Shadow Color: Use this RGBA color picker to choose a shadow color
- Shadow Horizontal Offset: Select the horizontal position of the shadow
- Shadow Vertical Offset: Select the vertical position of the shadow
- Shadow Blur: Select a blur intensity effect.
- Shadow Spread: Select how far the shadow spreads
Hovered Thumbnails: Change the look of the video thumbnail on mouse-hover.
- Opacity: Change the opacity of the thumbnail.
- Background Color: Change the color of the thumbnail background.
- Border Color: Change the color of the thumbnail border.
- Border Width: Change the border width.
- Margin: Add a margin around the video thumbnail.
- Box Shadow: Toggle between inset and outset shadow.
- Shadow Color: Use this RGBA color picker to choose a shadow color.
- Shadow Horizontal Offset: Select the horizontal position of the shadow.
- Shadow Vertical Offset: Select the vertical position of the shadow.
- Shadow Blur: Select a blur intensity effect.
- Shadow Spread: Select how far the shadow spreads.
Enrolment Box
Price: You can use the Oxygen Builder text field editor to change the typography of the course price
Add to Cart Button/Enroll Button
Button Paddings: Add a padding around the button of the Add to Cart Button. This button may also become “Enroll Now” if the course is set to free.
Background Color: Choose the background color of the button
Background Hover Color: Choose the background color of the button when mouse hovers over it
Typography: You can use the Oxygen Builder text field editor to change the typography of the button text’s typography
Borders: Use this tab to change the borders of the button.
- Currently Editing Border: Choose which border you want to edit
- Border Color: Select the border color
- Border Width: Select the width of the button’s border
- Border Style: Pick a border Style
- Border Radius: Pick a radius for the curved corners of the button. Use this to create a rounded square effect on the button. You can also click on “edit individual radii” to change each radius separately.
Hover Borders: Use this tab to change the borders of the button on hover.
- Currently Editing Border: Choose which border you want to edit
- Border Color: Select the border color
- Border Width: Select the width of the button’s border
- Border Style: Pick a border Style
- Border Radius: Pick a radius for the curved corners of the button. Use this to create a rounded square effect on the button. You can also click on “edit individual radii” to change each radius separately.
Shadow: Use this tab to change the appearance of the button’s shadow effect
- Inset: Check this if you want an inset border effect.
- Shadow Color: Pick the rgba color of the shadow color.
- Shadow Horizontal Offset: Use this field to change the horizontal position of the shadow.
- Shadow Vertical Offset: Use this field to change the vertical position of the shadow.
- Shadow Blur: Pick the strength of the blur effect.
- Shadow Spread: Pick how much the shadow will spread.
Hover Shadow: Use this tab to change the appearance of the button’s shadow on hover
- Inset: Check this if you want an inset border effect.
- Shadow Color: Pick the rgba color of the shadow color.
- Shadow Horizontal Offset: Use this field to change the horizontal position of the shadow.
- Shadow Vertical Offset: Use this field to change the vertical position of the shadow.
- Shadow Blur: Pick the strength of the blur effect.
- Shadow Spread: Pick how much the shadow will spread.
Instructors
Title: You can use the Oxygen Builder text field editor to change the typography of the instructor name
Author:
- Image
- Height: Select image height. The units are in px (pixels)
- Width: Select image width. The units are in px (pixels)
- Font Size: Change the font size of the icon text
- Line Height: Use this to tweak the text position
Bottom Info:
- Rating:
- Stars size: change the size of the star in the rating system. The units are in px (pixels)
- Stars Color: use this RGBA color picker to select the color of the stars in the rating system.
- Label: You can use the Oxygen Builder text field editor to change the typography of the instructor label.
- Value: You can use the Oxygen Builder text field editor to change the typography of the instructor name value.
Reviews
Title: You can use the Oxygen Builder text field editor to change the typography of the review title.
Review Avg:
- Rating Text: You can use the Oxygen Builder text field editor to change the typography of the review’s rating number (4 out of 5 star)
- Rating Star
- Color: Select the color of the rating stars
- Size: Select the size of the rating stars
- Total Count: You can use the Oxygen Builder text field editor to change the typography of the total review count
- Right Rating Bar
- Color: Choose the background color of the rating bar
- Fill Color: Choose the foreground fill color of the rating bar
- Height: Choose the height of the rating bar in pixels.
- Padding: Choose the padding between the bars and other elements
- Margin: Choose the margin for the rating bar
- Right Rating Bar
- Color: Choose the background color of the rating bar
- Fill Color: Choose the foreground fill color of the rating bar
- Height: Choose the height of the rating bar in pixels.
- Padding: Choose the padding between the bars and other elements
- Margin: Choose the margin for the rating bar
- Right Rating Text: You can use the Oxygen Builder text field editor to change the typography of the right rating text.
Review List:
- Image
- Height: Select image height. The units are in px (pixels)
- Width: Select image width. The units are in px (pixels)
- Font Size: Change the font size of the icon text
- Line Height: Use this to tweak the text position
- Name: You can use the Oxygen Builder text field editor to change the typography of the reviewer.
- Time: You can use the Oxygen Builder text field editor to change the typography of the review’s time.
- Stars
- Color: Select the color of the rating stars
- Size: Select the size of the rating stars
- Content: You can use the Oxygen Builder text field editor to change the typography of the review content.
- Spacing
- Padding: select how much padding you want around each of the review entries