With this element, you can showcase your team members in a clean and interactive layout. On hover, it displays their name and designation, and on click, it opens a pop-up with more details about the person.
Required Setup
- Bricks Builder installed & activated.
- You need to have the WDesignKit plugin installed and activated.
- Make sure you’ve created an account and logged into it.
- This is a pro element, so make sure you have the WDesignKit Pro license activated in your WDesignKit account.
- Make sure you’ve downloaded the Immersive Slider element.
How to Activate the Immersive Slider Element?
Go to
- WDesignKit → Widgets → Browse Widgets.
- Search the element name and select Bricks as the Page Builder.
- Click on the Download icon.
Use Cases
Use this Immersive Slider when you want to display images in a visually immersive and interactive slider with smooth transitions and modern effects. It is ideal for creating eye-catching hero sections and stylish image showcases.
Best For:
- Hero Sections: Create a bold and engaging hero area with animated slides and striking visuals.
- Image Showcases: Display featured images, portfolios, or creative visuals in a smooth, immersive slider layout.
- Landing Pages: Add an interactive slider to landing pages to capture user attention and highlight key content.
- Product Highlights: Showcase products or collections with images, titles, and counter numbers for a premium look.
- Creative Portfolios: Present photography, design work, or visual projects in a modern and engaging way.
- Marketing Sections: Highlight campaigns, promotions, or brand stories with stylish slide transitions and effects.
- Storytelling Sections: Use slides with titles and navigation text to guide users through a visual story.
- Responsive Websites: Ensure the immersive slider works smoothly across desktop, tablet, and mobile devices.
- User Engagement: Encourage users to explore content by offering smooth animations and interactive navigation.
- Modern & Professional Layouts: Ideal for websites that want a sleek, dynamic, and visually consistent slider design.
How to Use the Immersive Slider in Bricks?
Add the Immersive Slider element to the page.
LAYOUT
You can select a pre-defined style from the Style dropdown.
Note : From this tab, based on the style you selected, you will see different options to add the content.
You can choose a pre-defined animation style from the Style dropdown under the Animation heading.
Note: Based on the animation style you select, you will see different animation effects and related options.
CONTENT
From the Slides section, you can add the image items. By default, you’ll find four repeater items, open it.
In the Title field, you can add the main heading text for the slide.
From the Left Navigation Text field, you can add the text displayed on the left navigation area.
From the Right Navigation Text field, you can add the text displayed on the right navigation area.
Note: The Right Navigation option will not work in Style 2.
In the Counter Number field, you can add the slide number or counter text.
From the Select Image field, you can upload or choose the image to be displayed for the slide.
You can click on the + ADD ITEM button to add more items.
EXTRA OPTIONS
From the Overlay Effect option, you can enable or disable the overlay effect on the slider.
When enabled, it adds a visual overlay on the slides to improve text readability and enhance the overall design.
Then, from the Style tab, you can further customize the style of the Immersive Slider.
