--- title: "How to Add Paginations in Elementor Horizontal Page Scroll?" url: https://theplusaddons.com/docs/add-paginations-in-elementor-horizontal-page-scroll/ date: 2023-03-17 modified: 2026-09-14 lang: en author: "Aditya Sharma" description: "A horizontal scroll section gives no clue how long it is. A small counter reading 2 / 4 answers that at a glance. The Paginate option in the Carousel Remote..." image: https://theplusaddons.com/wp-content/uploads/2023/03/How-to-Add-Paginations-in-Elementor-Horizontal-Page-Scroll_-1024x536.jpg word_count: 630 --- # How to Add Paginations in Elementor Horizontal Page Scroll? ## - The Plus Addons for Elementor Pro Horizontal Scroll widget turns each top-level section of an Elementor Library template into one horizontal slide, and a sticky section added through Sticky Section is not counted as a slide. - Carousel Remote connects to Horizontal Scroll by matching the same Unique Connection ID on both widgets and setting Remote Type to Horizontal Scroll. - Paginate in Carousel Remote shows a current slide / total slides counter, and Position Y Offset plus Position X Offset Right move the counter up, down, left, or right. - Separator Layout offers None, Default with a slash, or Custom with a Separator Icon, while the total changes when a slide is hidden on the current device. A horizontal scroll section gives no clue how long it is. A small counter reading *2 / 4* answers that at a glance. The **Paginate** option in the **Carousel Remote** widget from The Plus Addons for Elementor does it, once the remote is connected to the **Horizontal Scroll** widget. *To check the complete feature overview documentation of The Plus Addons for Elementor Horizontal Scroll widget, [click here](https://theplusaddons.com/docs/horizontal-scroll-elementor-widget-settings-overview/).* ***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.*** [LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/horizontal-scroll/?utm_source=tpae&utm_medium=docs&utm_campaign=text) ## Before You Start - **Edition:** **Pro** — Horizontal Scroll is only in The Plus Addons for Elementor Pro. With the Pro plugin switched off the widget is not in the editor at all, and a page that already uses it shows nothing where the widget was.- **Widget to enable:** Horizontal Scroll, switched on under **The Plus Addons > Widgets**.- **Second widget to enable:** Carousel Remote, also under **The Plus Addons > Widgets**. It is a Pro widget too.- **You need a template:** an Elementor Library template whose top-level sections are the slides. The widget turns each top-level section of that template into one horizontal slide. ## Step 1: Add a Connection ID to the Scroll Widget Select the **Horizontal Scroll** widget, open **Extra Options** and type a name of your own in **Unique Connection ID**. It has to be unique on the page. ![Unique Connection ID field in the Extra Options section of the Horizontal Scroll widget](https://theplusaddons.com/wp-content/uploads/2026/09/hscroll-unique-id.webp) ## Step 2: Point Carousel Remote at It Add the **Carousel Remote** widget to the same page and open its **Content** section. - Type the same value in **Unique Connection ID**.- Set **Remote Type** to **Horizontal Scroll**. ![Carousel Remote Content section with Unique Connection ID filled in and Remote Type set to Horizontal Scroll](https://theplusaddons.com/wp-content/uploads/2026/09/hscroll-remote-connect.webp) ## Step 3: Switch Paginate On - Open the **Paginate** section and switch **Paginate** on.- Under **Position Y**, use **Offset** to move the counter up or down.- Under **Position X**, use **Offset Right** to move it left or right. ![Paginate section of the Carousel Remote widget with the Paginate toggle switched on](https://theplusaddons.com/wp-content/uploads/2026/09/hscroll-remote-paginate.webp) ## The Result The counter sits over the slides and changes as they move: ![Counter reading 2 slash 4 over a horizontal scroll section with the second slide in view](https://theplusaddons.com/wp-content/uploads/2026/09/hscroll-result-paginate.webp) ## Changing the Separator On the **Style** tab, the **Paginate** section has a **Separator Layout** dropdown with **None**, **Default** (a slash) and **Custom**, which lets you pick a **Separator Icon**. The same section holds separate colours for the current number, the separator and the total. ## How It Behaves - The counter reads *current slide / total slides*.- The total is the number of top-level sections in your slides template, counted on the page. You do not type it anywhere.- A sticky section added through **Sticky Section** is not counted as a slide.- At runtime the Carousel Remote markup is moved inside the horizontal scroll section, so the counter stays on screen for the whole sideways run.- A slide hidden on the current device is removed from the strip, and the total drops accordingly. ## Limitations - The counter is an indicator only. It is not clickable, so it cannot be used to move between slides.- The wording is fixed to *number separator number*. You cannot put your own text around it.- Both widgets are Pro only. With the Pro plugin off, neither the slides nor the counter render.- The counter only ever counts top-level sections of the template. Inner sections are part of a slide, not slides of their own. ## Troubleshooting ### Nothing appears The two **Unique Connection ID** values have to match exactly, and **Remote Type** on the remote must be **Horizontal Scroll**. ### The total is wrong It counts the top-level sections of the selected template. Check for an extra empty section, or for sections you have hidden on this device. ### The counter sits in the wrong place Use **Offset** under **Position Y** and **Offset Right** under **Position X** in the **Paginate** section. ### I want a different separator Open the **Style** tab, then **Paginate**, and change **Separator Layout** to **Custom** to choose your own **Separator Icon**. ## Related Docs - [Horizontal Scroll widget settings overview](https://theplusaddons.com/docs/horizontal-scroll-elementor-widget-settings-overview/)- [Add a progress bar in horizontal page scroll](https://theplusaddons.com/docs/add-progress-bar-in-elementor-horizontal-page-scroll/)- [Add dots navigation in horizontal page scroll](https://theplusaddons.com/docs/add-dots-navigation-in-elementor-horizontal-page-scroll/)