How to Create an Image Popup in WordPress

Sometimes the fastest way to get a message in front of your visitors is a single image. A well-designed graphic can announce a sale, promote an upcoming event, display a coupon code, or point people toward an important page, all without a wall of text.

That’s exactly what an image popup does. It appears above your page content, usually with a dimmed background, so visitors notice it immediately instead of scrolling past it the way they might with a regular banner. And because the entire image can be clickable, one tap takes them straight to your offer.

The problem is how most WordPress popup plugins expect you to build one. Many push you into a separate drag-and-drop builder with its own interface and learning curve. Others limit you to a handful of predefined templates that never quite match your design.

ConvertForce takes a simpler approach. It uses the native WordPress block editor, so creating an image popup feels the same as adding an image to a post or page. You insert an Image block, style the popup container, and publish. No page builder, no new editor to learn. And since it’s the block editor, you can always add other blocks later if a future campaign needs them.

In this tutorial, you’ll learn how to create a clean, image-only popup in WordPress using the free ConvertForce plugin, from installation to publishing, along with tips to make sure visitors actually engage with it instead of instantly closing it.

Step 1: Install and Activate ConvertForce

First, you need to install ConvertForce on your WordPress website.

From your WordPress dashboard, go to Plugins → Add New Plugin.

Search for “ConvertForce” in the search box. Once the plugin appears in the results, click Install Now.

After the installation is complete, click Activate.

You can also download ConvertForce from the WordPress.org plugin repository and upload the ZIP file manually.

Once the plugin is activated, you’ll see a new ConvertForce option in the WordPress admin sidebar.

Step 2: Create a New Lightbox Campaign

Now, go to ConvertForce → New Campaign from your WordPress dashboard.

Enter a descriptive name for the campaign. This name is only visible inside your WordPress dashboard, so choose something that will help you identify the popup later.

For example, you could name it:

• Summer Sale Image Popup
• New Product Announcement
• Homepage Discount Banner
• Black Friday Promotion

Next, choose the campaign type.

ConvertForce supports notification bars, lightbox popups, and slide-ins. For an image popup, select Lightbox Popup. This campaign type displays your content over the page while dimming the background behind it.

After selecting the campaign type, you’ll be taken to the editor.

Step 3: Add an Image to the Popup

The campaign editor works similarly to the editor you use for WordPress posts and pages.

Click the plus (+) icon to add a new block.

Search for the Image block and insert it into the popup.

You can then:

• Upload a new image from your computer
• Select an existing image from the Media Library
• Insert an image from a URL

Choose the promotional graphic you want to display.

You could use an image containing:

• A discount announcement
• A coupon code
• A product launch message
• An event promotion
• A seasonal sale
• A newsletter offer
• A limited-time deal

Since the image is the entire popup, it needs to do all the work. Use a graphic that communicates the main message quickly. Visitors should understand the offer, the action, and any deadline without needing anything else on the screen.

Step 4: Customize the Image Popup

Once you’ve added the image, you can customize both the Image block and the popup container.

Select the Image block to access the standard WordPress image settings. From there, you can adjust its size, alignment, aspect ratio, resolution, alternative text, and other available options.

You can also select the main ConvertForce popup block to customize the overall lightbox.

Remove Unnecessary Margin

The very first thing you can do is to remove the unnecessary margin from the image block. Simply select the image block and make the margin 0 from the styles tab.

Adjust the Popup Width

Open the block settings and find the size controls.

Use the Max Width setting to control the maximum width of the popup. ConvertForce uses a default maximum width of 500 pixels, but you can increase or decrease it depending on your image design.

A wider popup may work well for landscape promotional banners. A smaller width may be more suitable for square or portrait graphics.

Always check how the popup looks on mobile devices before publishing it.

Configure the Close Button

Visitors should always have an easy way to dismiss the popup.

ConvertForce lets you enable a close button and control its size and position. You can use an icon, such as an “X,” or display custom text like “Close” or “Dismiss.”

You can also allow visitors to close the popup by clicking the dimmed area outside it. This option is enabled by default.

Make sure the close button remains visible over your image. If your graphic has a dark background, use a light close icon. If it has a light background, a darker icon will usually be easier to see.

Step 5: Make the Image Clickable

An image popup becomes more useful when visitors can click it to visit a relevant page.

Select the Image block and use the link option in the block toolbar to add a destination URL. This turns the entire image into one large clickable area, which works especially well on mobile devices.

You might link the image to:

• A product page
• A pricing page
• A sale landing page
• A registration page
• A coupon page
• A blog post
• An external offer

Make sure the destination matches the message shown in the image.

For example, if the image promotes a 20% discount, clicking it should take visitors directly to the discounted product or offer page, not to a generic homepage.

Because the image is the only element in the popup, the graphic itself should make the next step obvious. If you want visitors to click, design the image so it looks clickable: include the offer, and consider adding a visual prompt such as “Shop Now” or “Claim the Offer” directly inside the graphic.

Since ConvertForce uses the block editor, you can also add other blocks to the popup, such as headings or buttons, if a future campaign calls for it. For this tutorial, however, we’re keeping the popup image-only, which keeps the message clean and gives visitors exactly one thing to do.

Step 6: Choose Where the Image Popup Appears

After designing the popup, decide where it should appear on your website.

ConvertForce lets you display a campaign across your entire site or target particular pages, posts, or post types. Just click on the Campaign tab and configure display conditions.

You could show the image popup:

• On every page
• Only on the homepage
• On a specific landing page
• On individual blog posts
• On product-related pages
• On a particular post type

The right display location depends on the offer.

For example, a site-wide seasonal sale may be relevant to almost every visitor. A popup promoting a particular product, however, will usually perform better on pages related to that product.

Avoid displaying every popup everywhere. A targeted promotion is generally more relevant and less intrusive than a generic site-wide message.

Step 7: Configure When the Popup Appears

Next, choose when the image popup should appear.

The free version of ConvertForce includes a page-load trigger. This displays the popup after the visitor opens a qualifying page.

You can also add a delay before the popup appears.

Instead of showing it immediately, consider waiting a few seconds. A delay gives visitors time to see your website and understand the page before the promotion interrupts them.

A delay of around five to ten seconds can be a reasonable starting point, although the ideal timing depends on your audience and the type of page.

ConvertForce Pro also includes advanced triggers such as:

• Exit intent: Shows the popup when a visitor appears ready to leave
• Scroll depth: Shows it after the visitor scrolls through a selected percentage of the page
• User inactivity: Shows it after the visitor has remained inactive for a specified period

These triggers can help you present the image at a more relevant moment in the visitor’s journey.

For this tutorial, you can use the page-load trigger with a short delay.

Step 8: Set the Display Behavior

In addition to deciding when the popup appears, you should control how frequently the same visitor sees it.

ConvertForce provides display frequency and closing-behavior options.

The display frequency determines whether the popup appears on every qualifying page load or only once during a visitor’s session.

The closing behavior determines whether the popup can appear again after the visitor dismisses it.

For most promotional image popups, showing the campaign once per session is less intrusive than displaying it repeatedly.

You should be especially careful with the “Hide forever” option. It can prevent visitors from seeing the same campaign again after closing it, which is useful for one-time announcements. However, it may not be suitable for promotions you want returning visitors to see again later.

Choose the behavior based on the importance and duration of your campaign.

Step 9: Publish and Test the Image Popup

Once you’re satisfied with the design and settings, click Publish.

The campaign will begin appearing on your website according to the display conditions, trigger, and behavior settings you configured.

Open your website in a private or incognito browser window to test it as a new visitor.

Check the following:

• The popup appears on the correct pages.
• It appears after the expected delay.
• The image loads clearly and at the correct size.
• The image links to the intended destination.
• The close button is visible and works properly.
• Visitors can close it by clicking outside the popup, if enabled.
• The popup looks good on desktop, tablet, and mobile.
• The frequency settings work as expected.

Pay particular attention to the mobile version. An image that looks clear on a desktop screen may contain text that is too small to read on a phone.

If something doesn’t look right, return to the campaign editor, make the necessary changes, and update the campaign.

Tips for Creating an Effective Image Popup

Creating the popup is straightforward. Creating one that visitors actually notice and interact with requires more thought.

Keep the Message Simple

An image popup should communicate one main idea.

Avoid filling the graphic with several offers, long paragraphs, or multiple coupon codes. Visitors should understand the message within a few seconds.

Use Readable Text

Make sure any text included in the image is large enough to read on smaller screens.

Test the popup on a real mobile device rather than relying only on the desktop preview.

Compress the Image

Large images can slow down your page and delay the appearance of the popup.

Compress the image before uploading it and use an appropriate file format. WebP is often a good option for promotional graphics because it can provide strong image quality with a smaller file size.

Match the Image to the Destination

The page visitors reach after clicking the popup should continue the same message and design.

If the popup promotes a particular product, send visitors directly to that product. If it announces an event, link to the registration page.

A mismatch between the popup and its destination can reduce trust and conversions.

Don’t Show It Too Quickly

Displaying a popup immediately after the page loads can feel disruptive.

Give visitors enough time to understand the page before presenting the promotion. You can also use scroll-depth or exit-intent triggers when appropriate.

Make It Easy to Close

Never hide or obscure the close button.

Visitors who aren’t interested in the offer should be able to dismiss the popup immediately and continue browsing the website.

Target Relevant Visitors

A highly relevant popup on a small number of pages can perform better than a generic popup shown across the entire site.

Use display conditions to connect each image campaign to the pages where its message makes the most sense.

Frequently Asked Questions

Final Thoughts

An image popup is one of the simplest ways to highlight an important promotion without redesigning your homepage or adding the same banner to several pages.

With ConvertForce, you can create the entire popup using the WordPress block editor. Add your promotional image, customize the popup container, make the image clickable, choose where it appears, configure the timing, and publish the campaign, all without using a separate page builder.

The key is to keep the image focused, display it to the right visitors, and avoid showing it too aggressively.

Start with one clear offer, test the popup on different screen sizes, and adjust its design, targeting, and timing based on how visitors respond.