Progress Bar

The Progress Bar module allows you to visually display progress or skill levels using bars, circles, or half-circles. It offers multiple styles, color options, and typography controls to create an engaging way to show progress values on your website.

How to add module on page

https://diviextended.com/documentation/divi-plus/add-module-to-page/

Configuration

• Layout
  Choose the progress bar layout: Bar, Half Circle, or Circle.
• Bar Direction (Bar layout only)
  Choose the direction for the bar to fill: Horizontal or Vertical.
• Show Striped
  Toggle to display striped styling on the bar.
• Show Progress Number
  Toggle to show the percentage number on the bar or circle.

Bar styling

• Bar Size
  Set the thickness/height of the bar in pixels.
• Bar Empty Color
  Choose the color for the unfilled portion of the bar.
• Bar Filled Color
  Choose the color for the filled portion of the bar.
• Bar Rounded Corners
  Set the corner radius (Top Left, Top Right, Bottom Left, Bottom Right) of the bar in pixels.

Percentage text

• Percentage Align
  Align the percentage number (left, center, right) within the module.
• Percentage Font / Weight / Style
  Customize the font family, thickness (weight), and text style (italic, uppercase, underline, etc.).
• Percentage Text Color
  Choose the color for the percentage number text.
• Percentage Text Size
  Set the font size (in pixels) for the percentage number.
• Percentage Letter Spacing
  Adjust the spacing (in pixels) between characters in the percentage text.