Course Duration

Show the course duration (how much time it would take for a student to finish the course) with the Course Duration add-on.


Label: Set the label of the Course Duration widget.

Layout: Choose from the predefined layout for the Course duration widget.

Alignment: Set the alignment from the preset alignment options for the contents of Course Duration widget.

Gap: Use the slider to set the exact gap distance between your Course Duration widget text and duration number.


Here you can choose the attributes of the content of the Label and the duration value.


Choose the color of the text from a wide range of colors from the color palette.


Choose your desired typography from the tile. Once you click on the configuration button you will find the following

Family: Set the font family of your texts.

Size: You can define the size of the text from here. To customize the size of the text click on the gear icon and adjust according to your design. You can set the custom size according to PX, EM, or Percentage. It is also a responsive feature so you can set different

Weight: Set the font-weight. Normally the font-weight is the thickness of a font.

Transform: Lets you apply your preferred capitalization format to the text.

Style: Choose from different styles for your texts such as oblique, italic, etc.

Decoration: Select the decoration for your texts. You can choose between underline, overline, line Through, etc.

Line Height: It’s the difference between lines, adjust it the way you want to.

Letter Spacing: It controls the space in between letters, defines the gap the way you want to.


You can set the alignment of your add-on properties. Choose between left, middle, and right alignment. This is a responsive option so you set different alignment for different types of devices.

Was this helpful?