- File:
sections/image-compare.liquid - Add section category: Text and media
- Used in: page.showcase
Section settings
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Heading | text | Before and after | ||
| Text | text | Drag the line to compare. | ||
| Before image | image_picker | Any size works; about 2000 px wide is enough. | ||
| After image | image_picker | Use the same crop as the before image. | ||
| Before label | text | Before | ||
| After label | text | After | ||
| Starting position | range | 10 to 90 %, step 5 | 50 % | |
| Color scheme | color_scheme | scheme-1 |
Custom colors
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Use custom colors | checkbox | Off | Overrides the color scheme for this section only. | |
| Background | color | #faf6f0 | Shown when section.settings.use_custom_colors. |
|
| Text | color | #2e241b | Shown when section.settings.use_custom_colors. |
|
| Button | color | #2e241b | Shown when section.settings.use_custom_colors. |
|
| Button label | color | #ffffff | Shown when section.settings.use_custom_colors. |
|
| Accent and links | color | #546633 | Keep text and background at a contrast of 4.5 to 1. Shown when section.settings.use_custom_colors. |
|
| Top padding | range | 0 to 160 px, step 4 | 48 px | |
| Bottom padding | range | 0 to 160 px, step 4 | 48 px |