> For the complete documentation index, see [llms.txt](https://utd-bv.gitbook.io/manual-shopify-theme-ultra/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://utd-bv.gitbook.io/manual-shopify-theme-ultra/ultra-sections/sections-and-snippets/compare-slider.md).

# Compare slider

<figure><img src="/files/KtQYU1jXQkdFsvjki5Dw" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/etqvACW8h9AjQYpwAwH7" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/XFzjVjdnr5vb8lddgIKw" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/bKzgVXFcvVtIuZIuuxbA" alt=""><figcaption></figcaption></figure>

In order to add a section, you need to go to **`Customizer`** → **`Add Section`** → **`Compare slider`** .

## **Section settings**

### General

<figure><img src="/files/j5jHzNf6p0WsqT1AejKd" alt=""><figcaption></figcaption></figure>

1. **`Enable 4th product preview`** - the setting allows you to show part of 4 product on the desktop;
2. **`Label` -** the setting allows you to select a label for the section;
3. **`Heading` -** the setting allows you to set a heading for the section;
4. **`Text` -** the setting allows you to set a text for the section;
5. **`Button label` -** the setting allows you to set a label for the section button;
6. **`Button link` -** the setting allows you to set a link for the section button;
7. **`Button style` -** the setting allows you to set the style for the section button. Available for selection: "Primary", "Secondary", "Primary with border", "Secondary with border";
8. **`Property first label` -** the setting allows you to set a label for an option;
9. **`Property second label` -** the setting allows you to set a label for an option;
10. **`Property third label` -** the setting allows you to set a label for an option;
11. **`Property fourth label` -** the setting allows you to set a label for an option;
12. **`Property fifth label` -** the setting allows you to set a label for an option;
13. **`Property sixth label` -** the setting allows you to set a label for an option;

### Layout

<figure><img src="/files/IKmClMucAyGCJJ6fuSHI" alt=""><figcaption></figcaption></figure>

1. **`Container width`** - a container width of the section. If the “Inherit” value is selected then the container width is based on the group 'Layout' settings in the Theme settings;
2. **`Desktop offset top`** - the **top** indent of the section on the **desktop**;
3. **`Desktop offset bottom`** - the **bottom** indent of the section on the **desktop**;
4. **`Mobile offset top`** - the **top** indent of the section on the **mobile**;
5. **`Mobile offset bottom`** - the **bottom** indent of the section on the **mobile**.

## **Blocks settings**

### Product

<figure><img src="/files/6wcLUMpHEixO5uBbAkcp" alt=""><figcaption></figcaption></figure>

1. **`Product`** - the setting allows you to select product;
2. **`Property first value` -** the setting allows you to set a value for an option;
3. **`Property second value` -** the setting allows you to set a value for an option;
4. **`Property third value` -** the setting allows you to set a value for an option;
5. **`Property fourth value` -** the setting allows you to set a value for an option;
6. **`Property fifth value` -** the setting allows you to set a value for an option;
7. **`Property sixth value` -** the setting allows you to set a value for an option;

## Theme content

<figure><img src="/files/By4DWkF7CMNWxyaPx7cd" alt=""><figcaption></figcaption></figure>

1. **`Product title` -** the setting allows you to set a value for the "Product title" label. It is used for accessibility. The value is required;
2. **`Property label` -** the setting allows you to set a value for the "Property label" label. It is used for accessibility. The value is required;
3. **`Property label` -** the setting allows you to set a value for the "Property value" label. It is used for accessibility. The value is required.

## Information

1. The section is displayed if two or more blocks are added;
2. Options are displayed if a label is set for them.