How To Use The Image Stack Widget By Element Pack Pro

  • BdThemes
  • How To Use The Image Stack Widget By Element Pack Pro

Table Of Contents

How To Use The Image Stack Widget By Element Pack Pro

In this documentation, we will demonstrate how you can customize the Image Stack widget brought to you by Element Pack Pro.

Inserting The Image Stack Widget

inserting image stack widget

Open your page in Elementor editor, search by Image Stack widget name, and drag-drop it on the page.

Please note that you need both Elementor and Element Pack Pro installed before you can use this widget.

Work With The Content Tab

Image Stack Section Customizations

Go to Content > Image Stack

Step-1

Find the Add Item, Image Size, and Alignment options. Increase your Item by clicking the Duplicate Sign and you can also decrease/remove your item by clicking the Cross sign.

S1 2 - BdThemes

Step-2

Inside each item box, you will see three tabs (Content, Tooltip, and Style).

S2 2 - BdThemes

For Content, find the Media Type (Image & Icon), Image/Icon field, and Link field options.

S3 2 - BdThemes

Step-3

For Tooltip, find the Text field and Placement options.

S4 1 - BdThemes

Step-4

For Style, find the Border Color option.

S5 1 - BdThemes

Work With The Style Tab

Items Section Customizations

Go to Style > Items

Step-1

In this section, you will see two tabs (Normal and Hover).

In Normal mode, find the Icon Color, Background Type (Classic and Gradient), Background Color, Border type, Border Width, Color, and Border Radius options.

S6 1 - BdThemes

Step-2

Also find the Item Size, Icon Size, Spacing, Stack Spacing, and Box Shadow options.

S7 2 - BdThemes

Step-3

In Hover Mode, find the Icon Color, Background Type (Classic and Gradient), Color, Border Color, and Box Shadow options.

S8 3 - BdThemes

Customizations of Stack Animations

Go to Style > Stack Animations

In this section, you will see two tabs (Item Hover and Stack Hover).

In Item Hover mode, find the Translate (Translate X and Translate Y) option.

sa1 - BdThemes

Then find Rotate (Rotate X, Rotate Y, and Rotate Z) option.

sa2 - BdThemes

Also find the Scale (Scale X and Scale Y) option.

sa3 - BdThemes

Also find the Skew (Skew X and Skew Y) option.

sa4 - BdThemes

And find the Transition (Duration, Delay, and Easing) option.

sa5 - BdThemes

In the Stack Hover mode, find the Translate and Rotate options.

sa6 - BdThemes

All the Animation effects help make your design more attractive and awesome.

Customizations of Tooltip Section

Go to Style > Tooltip

Find the Tooltip Width, Text Alignment, Text Color, Arrow Color, Background Type, and Color options.

t1 - BdThemes

Then find the Border Type, Width, Border Color, Border Radius, Padding, Typography, and Box Shadow options.

t2 1 - BdThemes

All done! You have successfully customized the Image Stack widget on your website.

Video Assist

https://www.youtube.com/watch?v=maLIlug2RwM

You can watch this video featuring the usage of the Elementor Image Stack widget. Don’t forget to visit the demo page for more examples and designs with this feature.

Thanks for staying with us.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 14-days money-back guarantee.
Need any further assistance? Call Us:+880 1700 55 95 95
Our supported payment system and security badge