---
title: "How to Add a Swipe or Slide Effect on Elementor Tabs?"
url: https://theplusaddons.com/docs/swipe-or-slide-effect-on-elementor-tabs/
date: 2023-02-13
modified: 2026-08-05
lang: en
author: "Aditya Sharma"
description: "When you have a long list of tab items, keeping the design intact can be a challenging task. The Tabs/Tours widget in The Plus Addons for Elementor includes a Swiper..."
image: https://theplusaddons.com/wp-content/uploads/2023/02/How-to-add-swiper-effect-on-Elementor-Tabs_-1024x536.jpg
word_count: 336
---

# How to Add a Swipe or Slide Effect on Elementor Tabs?

## 

- The Plus Addons for Elementor Tabs/Tours widget includes a Swiper Effect option that makes Elementor tab titles swipeable or scrollable when a long list of tab items threatens the layout.
- Swipe mode makes tab titles move horizontally by dragging across the tab bar, while Slide mode shows arrows for click-based navigation through the titles.
- Loop keeps tab title navigation cycling continuously, and Center Mode appears with Slide to place the active tab title at the center of the tab bar.

When you have a long list of tab items, keeping the design intact can be a challenging task. The Tabs/Tours widget in [The Plus Addons for Elementor](https://theplusaddons.com/) includes a Swiper Effect option that lets you make Elementor tab titles swipeable or scrollable, keeping your layout clean regardless of how many tabs you have.

*To check the complete feature overview documentation of The Plus Addons for Elementor Tabs and Tours widget, [click here](https://theplusaddons.com/docs/tabs-tours-elementor-widget-settings-overview/).*

**Best Used For:**

- Websites with long horizontal tab lists that overflow on smaller screens- Product or feature comparison pages using tabbed navigation with 8+ items- Knowledge base or documentation pages with many tab categories

***Requirement – This widget is a part of The Plus Addons for Elementor, make sure it is installed and activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/tabs/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Adding a Swipe or Slide Effect on Elementor Tabs (Step-by-Step)

To do this, add the Tabs/Tours widget to the page, go to **Extra Option > Swiper Effect**, and turn on the toggle.

![Swiper Effect option in Tabs/Tours widget in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/02/Tpae-Tabs-Tours-Swiper-Effect.png)

In the **Mode** dropdown, select how the tab titles should move when there are too many to display at once.

- **Swipe** – The tab titles become swipeable horizontally. Visitors drag across the tab bar to reveal more titles. Use this when you want a touch-friendly tab navigation on mobile devices.

- **Slide** – Arrows appear next to the tab titles so visitors click to navigate through them. Use this when you want desktop-friendly scrollable tab navigation with visible navigation controls.

Enable the **Loop** toggle to make the tab title navigation cycle continuously, so there is no defined start or end point.

With the **Slide** option selected, the **Center Mode** option becomes available. Enable it to position the active tab title at the center of the tab bar. Use this when you want the selected tab to stay visually anchored in the middle of the navigation row.

![Slide mode with Center Mode in Tabs/Tours widget in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2023/02/slider-tab-preview.gif)

That completes the setup for the Swipe or Slide Effect in the Tabs/Tours widget.

Also, check [How can you use an Elementor template inside the tabs widget](https://theplusaddons.com/docs/elementor-template-inside-tabs-widget/).