Xpro Elementor Addons

⌘K
  2. Home
  4. Docs
  6. Xpro Elementor Addons
  8. Free Elementor Widgets
  10. Step Flow

Step Flow

How to Install Step Flow Widget for Elementor

Xpro Step Flow widget for elementor is a perfect FREE widget that allows users to design creative step-by-step flow charts and visual diagrams for your WordPress websites. You can delight visitors in a great way with custom icons, badges, 4+ separators layout, and much more using our intuitive step flow widget options. Elementor Step Flow Widget allows you to showcase your site in a presentable form and increase the overall credibility of your site.

You can create as many flow charts with dozens of customization features to match your website’s theme. So it’s time to see how you can fully utilize this incredible free widget for your Elementor websites.

Requirement

You need to install and activate the free version of Xpro Elementor Addons. If you already have the plugin installed, just make sure the step flow widget is ‘Enabled’ from the Xpro Elementor Addons dashboard. , so you can find it in the Elementor editor.

To enable the widget, simply follow these steps:

Step 1

Click on the Xpro Addons option available on the WordPress Dashboard Menu. Now from the menu that appears toggle towards the Widget Tab.

Step 2

Scroll down the Widgets tab of the Xpro Addons Dashboard, to find the Step Flow Widget, and then toggle the button ‘ON’ to enable it.

How to Use Xpro Step Flow Widget for Elementor

Xpro Step Flow is the best widget to present beautiful visual diagrams in a visually appealing way that will instantly grab your site visitor’s attention. Style the step flow in Elementor the way you want with tons of styling customizations.

It’s simple, FREE, fun, and time-saving! Here’s how to use this wonderful Elementor Step Flow widget.

Step 1

Click on the Xpro Addons section available in the Elementor Editor.

Step 2

From the Xpro Addons section, simply drag’n’drop the Step Flow widget on your desired page location.

This is the default view of our Xpro elementor Step Flow widget.

How to Add Content in Step Flow Widget for Elementor

Start from the General Section under the Content Tab. Here you can perform the following options.

  • Add an icon to your step flow from the icon library or custom SVG.
  • Add title & description from the Title and Description options.
  • Add text to the badge from the Badge Text option.
  • Enable/Disable the separator option.
  • Adjust the alignment of the content.

Check out our Free Theme Builder for Elementor. You can customize default templates of your website as you like. It’s the best alternative of Elementor Pro.

By Xpro Elementor Addons

How to Style Step Elementor Flow Widget

Toggle towards the Style Tab. Starting from the Media Section, here you can do your favorite part of customizations. Scroll the bars option to adjust the size of the media and its background and bottom spacing.

After that, you can also change the color of the icon and its background separately. The widget also allows you to add a border or box shadow to the step flow to make it more prominent on the site.

How to Style Title and Description in Step Flow Widget for Elementor

You can amazingly customize the title and description of your step flow to give a brief overview of your flow chart to the visitors. Head towards the Style Tab. Here you can change the typography and color of the title from the Title Section. Similarly, you can style your descriptions from the Description Section.

How to Style Separator in Step Flow Widget for Elementor

At first, you can add any of 4 different unique layouts. You can also add a border to the separator. Scroll the bars options to adjust the thickness and the distance of the separator. At last, add the colors best according to the theme of the site to look more pleasing on the website.

How to Style Badge in Step Flow Widget for Elementor

Simply head towards the Badge Section of the Style Tab. You can perform the following style customizations from this section.

  • Adjust the position and offset the position
  • Adjust the typography and color of the badge text
  • Add a classic, gradient or an image background
  • Add a border with custom color and radius

The attractive use of step flow will look something like this on your Elementor website.

Best Step Flow Widget for Elementor

This is all from our Step Flow Widget for Elementor. I hope now you have a better understanding of how to fully utilize our easy-to-use Step Flow widget and create astonishing flow charts for your websites. If you want to explore and add attractive carousel features to your WordPress site then head over to our Xpro Elementor Testimonial Carousel Widget and Team Carousel Widget for Elementor.

Moreover, If you want to explore and add more attractive Elementor widgets then check our complete list of free Elementor widgets and download our free Elementor addons now.

How can we help?