How To Add Vertical Divider In Elementor? (A Super Simple Way)

Disclosure: Some of the links in this post are affiliate links. This means, if you click on the link and purchase the product, I will receive a commission at no additional cost to you. Don’t worry, I only recommend products or services that I have personally used and believe will add value to my readers.

Adding a vertical divider in Elementor is not straightforward. However, there is a way to do it easily and without writing any code.

Given below are the steps to add a vertical divider in Elementor:

  1. Install and activate the PowerPack Addons for Elementor plugin from the WordPress Plugins Repository.
  2. Edit the page with Elementor on which you want to place the vertical divider.
  3. Scroll down to the PowerPack Elements group in the left-side Elementor panel.
  4. Drag-and-drop the Divider widget on the page from under the PowerPack Elements group.
  5. Set the Direction field to Vertical in the left-side Divider widget settings panel.
  6. Style the Divider widget as needed.
  7. Save your changes.

Let’s take a detailed look at each of these steps now.

How To Add Vertical Divider In Elementor Using PowerPack Addons For Elementor Plugin

First, install and activate the free PowerPack Addons for Elementor plugin.

Then, edit the page on which you want to place the vertical divider.

Scroll down to the PowerPack Elements group until you see the Divider widget. Do not confuse this Divider widget of PowerPack plugin with the default Divider widget of Elementor. I wish the PowerPack team had named their Divider widget differently to avoid confusion. But unfortunately, they haven’t.

PowerPack Divider widget

Now, drag-and-drop the Divider widget from under the PowerPack Elements group on to the page. In the below image, you can see that I have added the Divider widget in the middle column.

Drag-and-drop Divider widget

Then, in the left-side Divider widget settings panel, set the Direction field to Vertical to align the divider vertically.

Make Divider vertical

Save your changes.

And that’s it!

That is how you add a vertical divider in Elementor without any hassles or writing code.

You can now adjust the widths of the columns to get the look that you want.

Alright!

Related Further Reading:

Video Tutorial

Download Website Builders’ Toolbox


What’s Next?

Play around with the PowerPack Divider widget’s settings to change the look and feel of the vertical divider.

There are a lot of settings that you can tweak to get the perfect look-and-feel for your divider.

And if you found this small tutorial useful, then please share it with your friends who might find it useful too.

About The Author

Leave a Comment

Your email address will not be published. Required fields are marked *