> For the complete documentation index, see [llms.txt](https://conusyntax.gitbook.io/products/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://conusyntax.gitbook.io/products/widget-blueprints/wbp_stepperbutton.md).
# WBP\_StepperButton
Allows players to navigate through a predefined range of options using side-to-side navigation arrows.
#### Behavior
Each **Stepper Button** is driven by a **Gameplay Tag** (e.g., `CharacterCreator.Gender`, `CharacterCreator.Race`, or `CharacterCreator.Groom.Hairstyle`). This tag serves two primary purposes:
* **Automatic Initialization**: The button uses the assigned tag to determine its data bounds and range of options.
* **Logic Execution**: It defines which internal function to trigger when the player selects an option from the range.
#### Initialization
The stepper initializes in the **Initialize Stepper Button** collapsed graph. The system reads the assigned Gameplay Tag to establish data bounds and populate the range:
* **Gender**: Initializes the range for Gender options.
* **Race**: Initializes the range for Race options.
* **Hairstyle**: Gathers the available Groom Assets for the range.
#### Using the Stepper Button
1. Place a **WBP\_StepperButton** widget.
2. In the **Details**, go to **Button** ➞ **Attributes**.
3. **Set** **Gameplay Tag**: Assign the Gameplay Tag that corresponds to the data type you want this stepper to control.
{% hint style="warning" %}
If no Gameplay Tag is assigned, the stepper will fail to initialize, and the navigation arrows will remain inactive.
{% endhint %}
### Available Functions
The blueprint contains a library of functions to support various data types. Ensure your Gameplay Tag is connected to the corresponding nodes in the **WBP\_StepperButton** graph:
#### Set Functions (Execution)
These apply the selected data to the Character.
#### Initialize Functions (Setup)
These functions define the content range for the stepper.
