Cascading Images/Slider Addon for WPBakery Page Builder

Introduction to Cascading Images/Slider Addon for WPBakery Page Builder

The Cascading Images/Slider Addon is a powerful tool for creating stunning image galleries and sliders using the popular WPBakery Page Builder plugin. With this addon, you can create a variety of image layouts, from simple sliders to complex cascading effects, to enhance the visual appeal of your website. In this tutorial, we will guide you through the step-by-step process of using the Cascading Images/Slider Addon to create a beautiful image gallery or slider.

Prerequisites

Before you start, make sure you have:

1. WPBakery Page Builder plugin installed and activated on your WordPress website.
2. The Cascading Images/Slider Addon installed and activated on your WordPress website.

Step 1: Adding the Cascading Images/Slider Addon to Your Page

To start using the Cascading Images/Slider Addon, you need to add it to your page. Follow these steps:

1. Log in to your WordPress dashboard and navigate to the page where you want to add the addon.
2. Click on the "Add Module" button to add a new module to your page.
3. In the "Add Module" window, select "Cascading Images/Slider" from the list of available modules.
4. Click "Insert" to add the module to your page.

Step 2: Configuring the Cascading Images/Slider Addon

Once you have added the module, you need to configure it to suit your needs. Follow these steps:

1. In the "Cascading Images/Slider" module, you will see a range of settings and options. Let's start with the "General" tab.
2. In the "General" tab, you can set the following options:
   • "Module ID": This is a unique identifier for the module. You can leave this as the default value.
   • "Module Class": This is a CSS class that will be applied to the module. You can leave this as the default value.
   • "Width": This sets the width of the module. You can set this to a fixed value or use a percentage.
   • "Height": This sets the height of the module. You can set this to a fixed value or use a percentage.
3. Click "Save" to save your changes.

Step 3: Adding Images to the Cascading Images/Slider Addon

Now that you have configured the module, it's time to add images to it. Follow these steps:

1. In the "Cascading Images/Slider" module, click on the "Add Image" button.
2. In the "Add Image" window, select the image you want to add from your computer or upload a new one.
3. You can also add a caption to the image by typing it in the "Caption" field.
4. Click "Add" to add the image to the module.

Step 4: Customizing the Cascading Images/Slider Addon

The Cascading Images/Slider Addon offers a range of customization options to help you achieve the desired look and feel. Follow these steps:

1. In the "Cascading Images/Slider" module, click on the "Advanced" tab.
2. In the "Advanced" tab, you can set the following options:
   • "Transition Effect": This sets the transition effect for the images. You can choose from a range of effects, including fade, slide, and more.
   • "Transition Duration": This sets the duration of the transition effect. You can set this to a fixed value or use a percentage.
   • "Pause On Hover": This sets whether the slider will pause on hover. You can choose from "Yes" or "No".
   • "Navigation Arrows": This sets whether the navigation arrows will be displayed. You can choose from "Yes" or "No".
3. Click "Save" to save your changes.

Step 5: Adding the Cascading Images/Slider Addon to Your Page

Finally, it's time to add the Cascading Images/Slider Addon to your page. Follow these steps:

1. In the "Cascading Images/Slider" module, click on the "Insert" button.
2. The module will be added to your page, and you can now see the images you added earlier.
3. You can resize the module by dragging the edges or corners.
4. You can also move the module by dragging it to a new location on the page.

Conclusion

That's it! You have now successfully added and configured the Cascading Images/Slider Addon to your WPBakery Page Builder page. With this addon, you can create a variety of image galleries and sliders to enhance the visual appeal of your website. Remember to experiment with the different settings and options to achieve the desired look and feel.