Fraud Blocker
  • Home
  • Products
  • Support
  • Blog
  • Contact

Table Of Contents

How to Use Interactive Card Widget

Let’s know about the Interactive card widget by Element Pack and how it works. Over the whole documentation, I’ll include some instructions one by one. Just, follow the guide and go ahead.

So, let’s dive into the doc.

To Insert Widget

Inserting the Interactive Card widget

It is very easy to place the Interactive Card widget. Only go to the Elementor panel and search Interactive Card in the search bar. Then, drag and drop the widget in the section you prefer.

Content Tab

The Content Tab having some handy sections will really help you to have a structure of the Interactive Card widget etc.


interactivecardwidget 2 - BdThemes

Simply, go to the Content tab > Layout.

Mainly, this section will let you add an image to the card. Additionally, you can edit the content(for example, Title, Subtitle, Text) and use the on/off switcher button to manipulate content on the user interactive card.

Note: If you select the position Right/Bottom, you’ll be able to add wavify effect to the card just by switching on the Show Wavify Effect button.

Read More

interactivecardwidget readmore - BdThemes

Go to Content tab > Read More.

You see! This section works to make you able to add text and link to the call to action button. Moreover, you can use OnClick event.


interactivecard badge - BdThemes

Come to the Badge section from the Content tab. Here, you can name the badge and set the position. Additionally, you can set the Offset value.

Note: If you switch on the Badge switcher, then you’ll discover the button corresponding.

Style Tab

Now, let’s work with the Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design the Elementor Interactive Card widget. 

Styling with the tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Card Content

interactivecard style 1 - BdThemes

Here, both in Normal and Hover mode, you can style the contents in the card. See the image example up.


interactivecard style 2 - BdThemes

Now come to the Image section. This section will allow you to style all about the Image attached with the Elementor Interactive cards. You might add effects to the card such CSS Filters effect.

Mostly, you can handle the image hover and opacity from this section. And you’ve got the possibility to do all these things in both Normal and Hover.

Title, Subtitle and Text

interactivecard style 3 - BdThemes

In all three sections, you will be able to add color, adjust spacing. Just, go to the sections one by one.

Read More

interactivecard style 4 - BdThemes

In general, here, you might add the attention effect to the call to action button ( for example, See Details).

See, the tabs – Normal and Hover will let you beautify the call to action button. Just, go to the Style tab > Read more.


interactivecard style 6 - BdThemes

Go to the Style tab > Badge and style the badge.

Video Assist

To sum up, I hope you’ve noticed what is Interactive Card widget is, developed by Bdthemes, and how it works for you. Watch the video inserted above. If you want to discover what more is possible to do using this one, you can visit the demo page.

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 30-days money-back guarantee.

BdThemes is the sole owner of #1 market-leading addons for Elementor such as Element Pack Pro, Prime Slider, Ultimate Post Kit, Ultimate Store Kit, Pixel Gallery, and more useful plugins.

This website is powered by Element Pack Pro and Rooten Theme.

New Year Sales Are Giving up to ~70% Price Off!! on our products | Coupon: HNY2023

Need any assistance? Call Us:+880 1700 55 95 95

Copyright © 2023 BdThemes. All Rights Reserved.