---
title: "How To Create an Elementor Image Box?"
url: https://theplusaddons.com/docs/create-elementor-image-box/
date: 2024-03-14
modified: 2026-09-16
lang: en
author: "Aditya Sharma"
description: "An image box is the same idea as an icon box, with a photograph or an illustration doing the work instead of a glyph. It suits team members, product categories..."
image: https://theplusaddons.com/wp-content/uploads/2024/03/How-To-Create-an-Elementor-Image-Box_-1024x536.jpg
word_count: 683
---

# How To Create an Elementor Image Box?

## 

- Info Box widget crea un Image Box en The Plus Addons for Elementor al cambiar Select Icon a Image y usar Use Image As icon para elegir la foto desde la biblioteca de medios de WordPress.
- Style-1, Style-3 y Style-4 funcionan sin Pro, mientras que Style-2, Style-5 y Style-6 necesitan Pro y sin él muestran un box completamente vacío.
- Image Resolution controla el archivo que carga la página, con opciones Full, Thumbnail, Medium, Medium Large, Large y Custom; Full sirve el original completo y Thumbnail sirve un recorte pequeño de 150 por 150.
- Info Box limita cada widget a una sola imagen, no ofrece crop ni focal point control, y la imagen no se difiere con lazy load por el propio widget.

An image box is the same idea as an icon box, with a photograph or an illustration doing the work instead of a glyph. It suits team members, product categories and case studies, where a real picture says more than a symbol.

The **Info Box** widget builds one: it is the same widget you would use for an icon box, with its icon type switched to **Image**.

*To check the complete feature overview documentation of The Plus Addons for Elementor Info Box widget, [click here](https://theplusaddons.com/docs/info-box-widget-settings-overview/).*

***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/info-box/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** Free — this part of the Info Box works in the free plugin and in Pro.- **Widget to enable:** Info Box, switched on under **The Plus Addons > Widgets**. In the Elementor panel it appears under **Plus Essential**.- **Upload your picture first.** The field picks from the WordPress media library, so add the image there or upload it from inside the control.

## Build the Image Box

- Edit the page with Elementor and drag **Info Box** from the **Plus Essential** group onto the canvas.- Leave **Select Layout** on **Listing**.- Choose **Style-1**, **Style-3** or **Style-4** in **Info Box Style**. These three work without Pro and they differ in where the image sits relative to the text.- Fill in **Title Of Info Box** and **Description**.- Set **Select Icon** to **Image**.

A media field called **Use Image As icon** appears. Click it and pick your picture.

![The Select Icon dropdown set to Image and the Use Image As icon media field, with the picture on the canvas](https://theplusaddons.com/wp-content/uploads/2026/09/infobox-image.webp)

## Choose the Size WordPress Serves

**Image Resolution** sits just under the media field and decides which generated file the page actually loads.

| Image Resolution | What the page requests |
| ---------------- | ---------------------- |
| **Full** (default) | The original upload, at its full dimensions. |
| **Thumbnail** | The small square crop, typically 150 by 150. |
| **Medium**, **Medium Large**, **Large** | The standard WordPress sizes, in between the two. |
| **Custom** | Dimensions you type in yourself. |

> *This genuinely changes the file, not just its display size. Leaving it on **Full** makes a visitor download a large original for a small box, so pick a size close to how big the image appears on the page.*

## Style the Image

Open the **Style** tab and expand **Image**. That section holds the image's own width, spacing, border, radius and hover treatment. **Title**, **Description** and **Background Options** handle the rest of the card.

![A finished image box on the front end with a picture beside the title and description](https://theplusaddons.com/wp-content/uploads/2026/09/infobox-result-imagebox.webp)

![An image box shown on a published page](https://theplusaddons.com/wp-content/uploads/2024/03/Image-box-demo.png)

## How It Behaves

- The image replaces the icon rather than joining it — **Select Icon** picks one type at a time.- **Title Tag** defaults to **div**. Set it to **H3** if the box heads a real section of the page.- Switching **Select Icon** back to **Icon** does not lose your picture; it is remembered if you switch back.- The alt text comes from the media library entry for that image, so set it there.

## Limitations

- **One image per widget.** A row of image boxes means one widget per box, each in its own column. The **Carousel** layout repeats them in one widget, and it needs Pro.- **Style-2, Style-5 and Style-6 need Pro**, and without it they render a completely empty box rather than falling back to a free style.- **There is no crop or focal point control.** **Image Resolution** picks from the sizes WordPress already generated; reframing the picture means editing it in the media library.- The image is not lazily deferred by the widget itself, so a page of full-resolution image boxes is heavy. Choose a smaller resolution.

## Troubleshooting

### I cannot find a field to add the image

Set **Select Icon** to **Image** first. The **Use Image As icon** field only appears once that type is chosen.

### The image is enormous or very blurry

Change **Image Resolution**. **Full** serves the original, **Thumbnail** serves a small square, and the sizes in between usually suit a card.

### The whole box is blank

Check **Info Box Style** — **Style-2**, **Style-5** and **Style-6** render nothing without Pro.

### The image sits in the wrong place

The position is set by **Info Box Style**, not by a separate alignment control. Try **Style-3** or **Style-4** for a different arrangement.

## Related Docs

- [Info Box Widget: Settings Overview](https://theplusaddons.com/docs/info-box-widget-settings-overview/)- [How to Show a Services Box in WordPress using Elementor?](https://theplusaddons.com/docs/show-services-box-in-wordpress-using-elementor/)- [How to Create an Image Gallery in Grid Layout in Elementor?](https://theplusaddons.com/docs/create-image-gallery-in-grid-layout-in-elementor/)

## Frequently Asked Questions

**Q: What do I need before I can create an Elementor image box?**
A: The key requirement is that The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH is installed and activated, because the Info Box widget is what builds the image box. The image also has to exist in the WordPress media library first, since the control pulls from there. That matters because the widget is not uploading a brand-new asset on its own, it is selecting an existing media item.

**Q: Why can't I find the field to add my image in the Info Box widget?**
A: The image field only appears after Select Icon is switched to Image. That control decides whether the box uses an icon or a picture, so the media picker stays hidden until Image is chosen. A practical gotcha is that switching back to Icon does not delete the picture, it just hides it until you return to Image.

**Q: Which Info Box style should I use for a free image box?**
A: Style-1, Style-3, and Style-4 are the safe choices because they work without Pro. The page also says these styles differ in where the image sits relative to the text, so style choice affects layout as much as appearance. Style-2, Style-5, and Style-6 need Pro and will render a completely empty box without it.

**Q: How do I stop an Elementor image box from loading a huge file or looking blurry?**
A: Image Resolution controls the actual file WordPress serves, not just how big it looks on screen. Full sends the original upload at full dimensions, Thumbnail is typically 150 by 150, and Medium, Medium Large, Large sit between those extremes. For a small card, picking a closer size usually avoids both oversized downloads and blurry scaling.

**Q: Can I use one image box widget for multiple boxes on a page?**
A: One widget only holds one image box. If you want a row of separate image boxes, each one needs its own widget in its own column. The page also notes that Carousel layout repeats them inside one widget, but that setup needs Pro. That makes the choice between single boxes and repeated layouts important early in planning.

**Q: Why is my image box blank or in the wrong place?**
A: A blank box usually points to an unsupported style: Style-2, Style-5, and Style-6 render nothing without Pro. If the image is sitting in an unexpected spot, that position comes from Info Box Style rather than a separate alignment control. The page suggests trying Style-3 or Style-4 when you want a different arrangement.