# Slider Navigation Dots, Arrows and Page Pagination

{% hint style="info" %}
Slideshow, Image Banner, Product Block, Product Recommendations and Recently Viewed Product Sections will have separate settings for navigation arrow positions. 
{% endhint %}

## Dots Style

| Setting | Description                                                                                                                                                                            |
| ------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Style   | Select the style of slider pagination dots. Style 1: Dots will simply styled with its background, border and hover state color. Style 2: Dots group will also have a background layer. |

## Arrows Style

| Setting                                    | Description                                                                                                                |
| ------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------- |
| Style                                      | <p>Select the style of slider navigation arrows. Style 1: Arrows are carets.</p><p>Style 2: Arrows have longer tails. </p> |
| Enable Button Arrows 'Disable'?            | Show the arrow even when the slider has reached its end of items length.                                                   |
| Border Width                               | Determine the thickness of pagination arrow borders.                                                                       |
| Border Radius                              | Round the corners of arrow. The range is from 0% (arrow border is a rectangle), to 50% (arrow border is a circle).         |
| Width Arrows/ Height Arrows                | Determine the width and height of the arrow border.                                                                        |
| Size Icon Arrows                           | Determine the size of the arrow icon inside the border.                                                                    |
| Position Horizontal Arrow - (Unit % or px) | Fill in the desired positions of arrows horizontally relative to their slider.                                             |

## Pagination

Settings for page pagination such as blogs page.

| Setting   | Description                                                                                                                                                                                     |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Layout    | <p>Select the style for the pagination. <br>Style 1: Pagination arrows are text "prev" and "next".<br>Style 2: Pagination arrows are carets.<br>Style 3: Pagination arrows are long-tailed.</p> |
| Alignment | Align the Pagination cluster to the left, right or center of the products grid.                                                                                                                 |