# Image comparison slider

**URL:** <https://meta.discourse.org/t/image-comparison-slider/264479>\
**Category:** Theme component\
**Created:** [May 10, 2023, 1:56am UTC](https://meta.discourse.org/t/image-comparison-slider/264479 "2023-05-10T01:56:37Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![Joseph\_Hansen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joseph_hansen/32/280051_2.png) [@Joseph\_Hansen](https://meta.discourse.org/u/Joseph_Hansen)\
**Post date:** [May 10, 2023, 1:56am UTC](https://meta.discourse.org/t/image-comparison-slider/264479/1 "2023-05-10T01:56:37Z")

</div>

| | | |
| --- | --- | --- |
| ℹ | **Summary** | Add a button to the composer to create a draggable interactive image comparison slider. |
| 🛠 | **Repository** | [GitHub - josephclaytonhansen/discourse-image-comparison-slider · GitHub](https://github.com/josephclaytonhansen/discourse-image-comparison-slider/) |
| ❓ | **Install Guide** | [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) |
| 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |

Install this theme component

This component adds a button to the composer to create draggable image comparison sliders. Slider settings such as direction or button icon can be customized from the admin settings.

 ![IMG_2908](https://global.discourse-cdn.com/meta/original/4X/1/1/9/11935a36f0aaceafce8c27006de3f67efdaf3d57.png)

[https://github-production-user-asset-6210df.s3.amazonaws.com/45859835/237227273-10e4e042-f751-4402-ae81-826b8e8b5113.mp4?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAVCODYLSA53PQK4ZA%2F20260601%2Fus-east-1%2Fs3%2Faws4\_request&X-Amz-Date=20260601T123112Z&X-Amz-Expires=300&X-Amz-Signature=e8a1f1868e3e4b56a9227443dd0f578914681729a9949dd7612fd4a5e1d1acfa&X-Amz-SignedHeaders=host&response-content-type=video%2Fmp4](https://github-production-user-asset-6210df.s3.amazonaws.com/45859835/237227273-10e4e042-f751-4402-ae81-826b8e8b5113.mp4?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAVCODYLSA53PQK4ZA%2F20260601%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20260601T123112Z&X-Amz-Expires=300&X-Amz-Signature=e8a1f1868e3e4b56a9227443dd0f578914681729a9949dd7612fd4a5e1d1acfa&X-Amz-SignedHeaders=host&response-content-type=video%2Fmp4)

This is my first foray into Discourse development, so I apologize if I’ve made any mistakes.

---

_[View the full topic](https://meta.discourse.org/t/image-comparison-slider/264479)._