1. Home
  2. Docs
  3. Xpro Addons For Beaver Builder
  4. Modules
  5. Before After Comparison

Before After Comparison

Introduction

How to set the orientation of the before-after comparison module to diagonal style?

Yes, Xpro Addons for beaver builder provides theunique and elegant options to set the orientation of before and after comparisonto diagonal style with two options Diagonal Left and Diagonal Right and it’s very simple to implement.

Step 1: Head over the Before After Comparison module setting in the Xpro Media Modules section.
Step 2: Drag and drop the Before After Comparison module.
Step 3: Go to the General tab and select the Photos from Media Library for Before After Comparison.

Step 4: Now, go to the Setting tab and select the option for Diagonal Left or Diagonal Right from the Dropdown menu in the Orientation section and make the other necessary changes according to your requirements in the setting section.

Step 5: Then, go to the Style tab and select the style changes like Overlay Background Color, Icon Color, Label Position, and Typography, etc.

Step 6: Finally, Before After Comparison layout will be displayed on your web page, and when you Mouseover the layout, the Orientation of Before After Comparison will be seemed Diagonal.

Was this article helpful to you? Yes No

How can we help?