Do you want accordion items side by side instead of stacked? A horizontal accordion shows each title as a slim vertical strip, and the open item fills the rest of the row.
The Accordion widget from The Plus Addons for Elementor turns horizontal with one switch.
To check the complete feature overview documentation of The Plus Addons for Elementor Accordion widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Edition: Pro — Horizontal Accordion is part of The Plus Addons for Elementor Pro. In the free plugin the option shows an upgrade notice instead of working.
- Widget to enable: Accordion, switched on under The Plus Addons > Widgets.
Steps
- Add the Accordion widget and your items. Three to six items work best.
- In Content > Special Option, turn on Horizontal Accordion and click the pencil next to it to open its settings.
- Adjust the settings below, then publish.
| Setting | What it does | Default |
|---|---|---|
| Layout | Layout 1 or Layout 2 — two arrangements of the title strip | Layout 1 |
| Height | The height of the whole accordion, up to 700px | — |
| Title Width | The width of each title strip, in px | 60 |
| Open Speed / Close Speed | How fast an item opens and closes, in milliseconds | 400 |
Click a title strip to open that item.
Limitations
- Not with On Hover Accordion. The Horizontal switch is hidden while On Hover is on.
- No Expand & Collapse Button or Slider & Pagination. Both are hidden while Horizontal is on.
- Keep the titles short. They run vertically in a narrow strip.
- Check small screens. Side-by-side items get very narrow on phones; consider a separate vertical accordion for mobile using Elementor’s responsive visibility.
Troubleshooting
The Horizontal switch is missing
Turn off On Hover Accordion first.
