Go to athemes.com

ProUsing the Image Card

Explore the Image Card widget demo here.

Want to display images with stylish overlay effects and text? The Image Card widget in aThemes Addons lets you create visually engaging cards with built-in hover effects like Lily, Sadie, and Marley – ideal for portfolios, team members, and featured content.

In this guide, we’ll walk you through how to use the Image Card widget in aThemes Addons for Elementor.

Table of Contents
  1. Activating the Widget
  2. Exploring Widget Options
  3. Customizing Styling Options

Before you get started, make sure you’ve installed and activated the aThemes Addons plugin on your WordPress site along with Elementor. This widget requires aThemes Addons Pro.

Activating the Widget

Navigate to the aThemes Addons dashboard in your WordPress admin area and enable the Image Card widget by toggling it on.

Exploring Widget Options

Configuring the Content

The Content section provides the following options:

  • Image – Upload or select the background image for the card.
  • Heading – Enter a title to display on the card.
  • HTML Tag – Choose the HTML tag for the heading (H1, H2, H3, etc.).
  • Description – Add a short description text to appear on the card.
  • Link – Add an optional URL to make the card clickable.

Choosing the Effects

The Effects section lets you select a hover animation style:

  • Effect – Choose from hover effects such as Lily, Sadie, and Marley. Each effect provides a unique animation when visitors hover over the card.
  • Box Alignment – Set the content alignment to left, center, or right.

Customizing Styling Options

The styling options let you fine-tune the visual appearance of the image card:

  • Dimensions – Set the max height, min width, and max width of the card.
  • Overlay Color – Choose a color overlay that appears on top of the image.
  • Image Opacity – Adjust the opacity of the background image.
  • Heading Style – Customize the typography and color of the heading text.
  • Description Style – Set the typography and color for the description text.
  • Border Radius – Round the corners of the card in both normal and hover states.
  • Box Shadow – Add a shadow effect to the card for added depth.

That’s it! You’ve successfully set up and styled the Image Card widget using aThemes Addons Pro for Elementor.

Next, would you like to add interactive hotspots to your images? Check out our guide on using the Image Hotspots widget to learn more.

image_print