# HTML Progress Bar

## Description

The HTML Progress macro adds a standard progress bar to your page. You can specify the progress, the max value, width and height.

## Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “html” in the Search box

Select the “HTML Progress” macro

## Macro Options

### **Value**

Enter a numeric value for the progress. This value corresponds to the Maximum Value.

### **Maximum Value**

Enter a numeric value for the maximum here. It represents 100% or a full progress bar. This value corresponds to the Value.

### **Height**

Enter a custom height for the display. Use a numeric value. It is interpreted as pixels. If Width is not set, the browser will automatically adjust the proportion.

### **Width**

Enter a custom width for the display. Use a numeric value. It is interpreted as pixels. If Height is not set, the browser will automatically adjust the proportion.

## Example

<div align="left"><figure><img src="https://3884669180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fs1Vtfb5fcOs06GOHo0WA%2Fuploads%2Fmq8pVuqmyQ9390hZkMVj%2Fimage2017-11-4_19-8-7.png?alt=media&#x26;token=e9d99a3b-45c7-4246-8182-969958b1d7fe" alt=""><figcaption></figcaption></figure></div>

<div align="left"><figure><img src="https://3884669180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fs1Vtfb5fcOs06GOHo0WA%2Fuploads%2F3LLzQxq1TLpmP9YwsRUp%2Fimage2017-11-4_19-9-36.png?alt=media&#x26;token=cb2e0340-bb7e-4809-93e4-9690cfe8369d" alt=""><figcaption></figcaption></figure></div>
