---
title: "How to Add a Vertical Before and After Comparison Slider in WordPress?"
url: https://nexterwp.com/docs/add-a-vertical-before-and-after-comparison-slider-in-wordpress/
date: 2024-12-05
modified: 2026-03-31
author: "Aditya Sharma"
description: "Do you want to add a vertical before and after comparison slider in WordPress? This feature allows you to showcase transformations of vertical designs or elements, providing an engaging way..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-a-Vertical-Before-and-After-Comparison-Slider-in-WordPress_-1024x519.jpg
word_count: 207
---

# How to Add a Vertical Before and After Comparison Slider in WordPress?

## Key Takeaways

- Nexter Blocks includes a Before After block that allows users to create a vertical before and after slider in WordPress.
- Users can select 'Vertical' from the Mode section in the Content tab to configure the Before After block.
- The Before After block requires installation and activation of Nexter Blocks to function properly.

Do you want to add a vertical before and after comparison slider in WordPress? This feature allows you to showcase transformations of vertical designs or elements, providing an engaging way for visitors to see the impact of your work.

With the Before After block from Nexter Blocks, you can easily create a vertical before and after slider in WordPress.

*To check the complete feature overview documentation of the Nexter Blocks Before After block, [click here](https://nexterwp.com/docs/add-before-after-image-comparison-in-wordpress/).*

***Requirement  - This block is a part of the Nexter Blocks, make sure it's installed & activated to enjoy all its powers.***

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-before-after-image-comparison-slider/)

To do this, add the Before After block to the page and follow the steps - 

1. In the **Content** tab, select **Vertical** from the **Mode **section.

2. Then in the **Before Image** tab, you have to add the before image in the **Select Before Image** section.

In the **Before Label** field, you can add a label for the before image.

3. After that in the **After Image** tab, you have to add the after image from the **Select After Image** section.

In the **After Label **field, you can add a label for the after image.

Now you will see a vertical before and after comparison slider.