---
title: Image Swap Using Find & Replace
description: We've created both a video and some step-by-step instructions to help you learn how to swap an image on one of your web pages using SiteSpect's find and replace tool. This training video helps you lea
---

[Skip to content](https://doc.sitespect.com/knowledge/image-swap-using-find-replace#main-content)

English

Show submenu for translations

![Monetate-Logo-Full-Color-1](https://doc.sitespect.com/hs-fs/hubfs/Monetate-Logo-Full-Color-1.png?width=340&height=49&name=Monetate-Logo-Full-Color-1.png)

- [A/B Testing](https://www.sitespect.com/testing-and-experimentation/)
- [Personalization](https://www.sitespect.com/personalization-targeting/)
- [Recommendations](https://www.sitespect.com/recommendations/)

Open main navigation

Close main navigation

- [A/B Testing](https://www.sitespect.com/testing-and-experimentation/)
- [Personalization](https://www.sitespect.com/personalization-targeting/)
- [Recommendations](https://www.sitespect.com/recommendations/)
- English
  
  Show submenu for translations

 How can we help you?

- There are no suggestions because the search field is empty.

1. [Knowledge Base](https://doc.sitespect.com/knowledge?hsLang=en)
2. [Site](https://doc.sitespect.com/knowledge/site?hsLang=en)

# Image Swap Using Find & Replace

We've created both a video and some step-by-step instructions to help you learn how to swap an image on one of your web pages using SiteSpect's find and replace tool.

This training video helps you learn how to build an image swap Campaign.

 

 

<iframe class="hs-responsive-embed-iframe" height="480" src="https://www.youtube.com/embed/foctQZmI3lE?rel=0&amp;showinfo=0" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;" width="560" data-service="youtube" data-aura-rendered-by="12:2356;a" data-mce-fragment="1"></iframe>

 

 

#### Image Swap Using Find & Replace – Step-by-step Instructions

Your marketing department would like to test a new hero image that they believe will be more engaging and will result in more users clicking the **Buy Now** button. The following image shows the current PM [Clothing.CO](http://clothing.co/) home page.

![Image Swap Using Find & Replace - PM Clothing Co](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20PM%20Clothing%20Co.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20PM%20Clothing%20Co.png)

Your marketing department thinks that the following image will work better.

![Image Swap Using Find & Replace - Girl in Flower Field](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Girl%20in%20Flower%20Field.png?width=364&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Girl%20in%20Flower%20Field.png)

### Step 1 – Create a New Campaign

For this simple test, you’ll create a Campaign in SiteSpect's Campaign Builder. You can create most types of A/B tests using this simple, single-page form. To start creating the Campaign, select **New**, **A/B Campaigns**.

![Image Swap Using Find & Replace - Step 1 New Campaign](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%201%20New%20Campaign.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%201%20New%20Campaign.png)

### Step 2 – Specify the Campaign Name, Hypothesis, and Preview URL

To specify the Campaign Name, Hypothesis, and Preview URL:

1. Name the Campaign **More Engaging Hero** and select **Standard** as the **Type**.
2. Specify the following **Hypothesis** for the test: "Visitors are more likely to click Buy Now on the updated image." The Hypothesis helps others understand the why you designed the Campaign as you did and helps when it comes time for Campaign analytics.
   
   ![Image Swap Using Find & Replace - Step 2 More Engaging Hero](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%202%20More%20Engaging%20Hero.png?width=655&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%202%20More%20Engaging%20Hero.png)

### Step 3 – Create a Variation

In this step, use SiteSpect’s **Find and Replace** method to change the URL of the hero image to the one you’d like to test.

1. Change the name of **Variation 1** to **New Hero**.
   
   ![Image Swap Using Find & Replace - Step 3 Variation](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation.png?width=655&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation.png)
2. Specify the Trigger, which determines which pages to change. For this Campaign, enter /index.html. This means that changes are applied only when the URL contains /index.html. This is important because we want to make these changes only on the home page and not on any other pages.
   
   ![Image Swap Using Find & Replace - Step 3 New Image](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20New%20Image.png?width=528&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20New%20Image.png)
3. Specify the URL of the hero image in the **Find This** field, which determines what you want to change. The image below displays the URL as /assets/img/content/slider-06.jpg. This tells SiteSpect to locate this URL on the page.
4. Specify the URL of the new hero image in the **Replace With This** field, which determines the location of the replacement image. The image below displays the URL as /\_\_ssobj/static/SummerDresses3.jpg. This tells SiteSpect to replace what it found in the **Find This** field with the contents of the **Replace With This** field.
   
   ![Image Swap Using Find & Replace - Step 3 What to Change](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20What%20to%20Change.png?width=629&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20What%20to%20Change.png)

In addition to changing the image on the page, we're going to use this Variation to change the look of the secondary message that is called out in the following image.

![Image Swap Using Find & Replace - Step 3 PM Clothing Co](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20PM%20Clothing%20Co.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20PM%20Clothing%20Co.png)

To change the look of the secondary message so that it looks better with the new hero image, insert a style block before the closing \</head\> tag that specifies a new color as follows:

1. To add a Variation to the Variation Group, open the **three-dot** menu on the right side of the page and select **Add to All**. In this second Variation, you’ll specify how to change that text style.
   
   ![Image Swap Using Find & Replace - Step 3 Add to All](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Add%20to%20All.png?width=500&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Add%20to%20All.png)
2. Rename the new Variation to **Overlay Style** by clicking on the word Variation and typing over it.
   
   ![Image Swap Using Find & Replace - Step 3 Variation II](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation%20II.png?width=655&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation%20II.png)
3. Create a **URL Trigger**, select **Contains from** the **Trigger** pull-down, and specify /index.html. In the **Find This** field, enter \</head\> so that SiteSpect searches for the closing head tag.
4. In the **Replace With This** field, enter the text that you see in the image below. The text is here for you to copy and paste.
   
   ![Image Swap Using Find & Replace - Step 3 Variation Group](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation%20Group.png?width=655&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20Variation%20Group.png)
5. Finally, rename **Variation Group 1** to **More Engaging Hero**.
   
   ![Image Swap Using Find & Replace - Step 3 More Engaging Hero](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20More%20Engaging%20Hero.png?width=655&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%203%20More%20Engaging%20Hero.png)

### Step 4 – Select Metrics and a Key Performance Indicator

Drag and drop the Metrics that help you understand which Variation performed the best. The Key Performance Indicator (KPI) is the most important Metric for the A/B Campaign.

For this Campaign, you want to see if the new hero image increases the number of visitors who land on the Category Page, so drag and drop the **Category Page** Metric to the KPI area.

![Image Swap Using Find & Replace - Step 4 Metrics](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%204%20Metrics.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%204%20Metrics.png)

### Step 5 – Select an Audience

For this test, you want to include only visitors who are using a tablet. Drag and drop the **Device: Tablet** Audience into the **Include** area.

![Image Swap Using Find & Replace - Step 5 Audiences](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%205%20Audiences.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%205%20Audiences.png)

### Step 6 – Save the Campaign

1. To save the Campaign, click **Save**.
   
   ![Image Swap Using Find & Replace - Step 6 Save](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%206%20Save.png?width=500&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%206%20Save.png)

### Step 7 – QA the Campaign

To preview the Variation, click the **Preview** icon in the Variations area.

![Image Swap Using Find & Replace - Step 7 Original](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%207%20Original.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%207%20Original.png)

At the bottom of the page, the Preview Diagnostics panel displays the Variation changes applied to this page. Clicking the Buy Now button also displays the Category Page Metric in this area.

![Image Swap Using Find & Replace - Step 7 PM Clothing Co](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%207%20PM%20Clothing%20Co.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%207%20PM%20Clothing%20Co.png)

### Step 8 – Set the Campaign to Active – Running

When you first create a Campaign, it is in Review. After QA is complete, you can change the **Status** to **Active – Running**, which turns the Campaign on and allows visitors to be assigned to either the Control or the Variation. To change the Status of the Campaign:

**Note:** Data starts to appear in the Campaign about 45 minutes to 2 hours after the Campaign is made active.

1. Open the Campaign again: select **Build**, **Campaigns**, **Campaign List**, then select the Campaign.
2. In the **Status** field, select **Active - Running**.
   
   ![Image Swap Using Find & Replace - Step 8 Status](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%208%20Status.png?width=275&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%208%20Status.png)
3. Click **Save** at the bottom of the page.

### Step 9 – Results

The A/B Campaign has been running for two weeks now, and you’re ready to look at the results. The Performance Matrix shows comparisons of Metrics between the Control and Variation hero image.

![Image Swap Using Find & Replace - Step 9 Performance Matrix](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%209%20Performance%20Matrix.png?width=688&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%209%20Performance%20Matrix.png)

In the Metrics section, you can see a 60.92% lift in views (Totals) of the Category Page from 33.85% more visits (Uniques) than in the Control. Both comparisons are reporting at full confidence (99.99% Sig).

A/B Campaign Conclusion: Your new hero image encouraged more users to click through to the **Category** page.

![Image Swap Using Find & Replace - Step 9 Metrics](https://doc.sitespect.com/hs-fs/hubfs/Kbase%20Images/Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%209%20Metrics.png?width=292&name=Image%20Swap%20Using%20Find%20%26%20Replace%20-%20Step%209%20Metrics.png)

 

- [Get Started](https://doc.sitespect.com/knowledge/get-started?hsLang=en#main-content)

    - [SiteSpect Support](https://doc.sitespect.com/knowledge/get-started?hsLang=en#sitespect-support)
    - [Overview Information](https://doc.sitespect.com/knowledge/get-started?hsLang=en#overview-information)
    - [Intro to SiteSpect](https://doc.sitespect.com/knowledge/get-started?hsLang=en#intro-to-sitespect)
    - [Account Setup](https://doc.sitespect.com/knowledge/get-started?hsLang=en#account-setup)
    - [Artificial Intelligence](https://doc.sitespect.com/knowledge/get-started?hsLang=en#artificial-intelligence)
- [Dashboard](https://doc.sitespect.com/knowledge/dashboard?hsLang=en)
- [Build](https://doc.sitespect.com/knowledge/build?hsLang=en#main-content)

    - [Setting Up a Campaign](https://doc.sitespect.com/knowledge/build?hsLang=en#setting-up-a-campaign)
    - [Create a Client-Side Campaign](https://doc.sitespect.com/knowledge/build?hsLang=en#create-a-client-side-campaign)
    - [Create a Server-Side Campaign](https://doc.sitespect.com/knowledge/build?hsLang=en#create-a-server-side-campaign)
    - [Metrics](https://doc.sitespect.com/knowledge/build?hsLang=en#metrics)
    - [Audiences](https://doc.sitespect.com/knowledge/build?hsLang=en#audiences)
    - [Triggers](https://doc.sitespect.com/knowledge/build?hsLang=en#triggers)
    - [Variations](https://doc.sitespect.com/knowledge/build?hsLang=en#variations)
    - [Traffic Management](https://doc.sitespect.com/knowledge/build?hsLang=en#traffic-management)
    - [Preview](https://doc.sitespect.com/knowledge/build?hsLang=en#preview)
    - [Factors](https://doc.sitespect.com/knowledge/build?hsLang=en#factors)
    - [Advanced Settings](https://doc.sitespect.com/knowledge/build?hsLang=en#advanced-settings)
    - [Omnichannel](https://doc.sitespect.com/knowledge/build?hsLang=en#omnichannel)
    - [Regular Expressions (Regex)](https://doc.sitespect.com/knowledge/build?hsLang=en#regular-expressions-regex)
    - [WATTS](https://doc.sitespect.com/knowledge/build?hsLang=en#watts)
    - [Recommendations](https://doc.sitespect.com/knowledge/build?hsLang=en#recommendations)
- [Monitor](https://doc.sitespect.com/knowledge/monitor?hsLang=en)
- [Analyze](https://doc.sitespect.com/knowledge/analyze?hsLang=en#main-content)

    - [Data Export and Integration](https://doc.sitespect.com/knowledge/analyze?hsLang=en#data-export-and-integration)
    - [SiteSpect Reports](https://doc.sitespect.com/knowledge/analyze?hsLang=en#sitespect-reports)
- [Site](https://doc.sitespect.com/knowledge/site?hsLang=en#main-content)

    - [Tools](https://doc.sitespect.com/knowledge/site?hsLang=en#tools)
    - [Configuration](https://doc.sitespect.com/knowledge/site?hsLang=en#configuration)
- [Developers](https://doc.sitespect.com/knowledge/developers?hsLang=en#main-content)

    - [API Reference](https://doc.sitespect.com/knowledge/developers?hsLang=en#api-reference)
    - [Code Samples](https://doc.sitespect.com/knowledge/developers?hsLang=en#code-samples)
    - [Tips & Tricks](https://doc.sitespect.com/knowledge/developers?hsLang=en#tips-tricks)
- [Mobile](https://doc.sitespect.com/knowledge/mobile?hsLang=en)
- [Implementation, Deployment, and Security](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#main-content)

    - [How does SiteSpect work with CDNs?](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#how-does-sitespect-work-with-cdns)
    - [Single Tenant Implementations](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#single-tenant-implementations)
    - [Security Features](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#security-features)
    - [Deployment and Implementation Overview](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#deployment-and-implementation-overview)
    - [SiteSpect Engine & Admin API](https://doc.sitespect.com/knowledge/implementation-deployment-and-security?hsLang=en#sitespect-engine-admin-api)
- [Third-Party Integration](https://doc.sitespect.com/knowledge/third-party-integration?hsLang=en#main-content)

    - [Google](https://doc.sitespect.com/knowledge/third-party-integration?hsLang=en#google)
    - [Zuko](https://doc.sitespect.com/knowledge/third-party-integration?hsLang=en#zuko)
- [Troubleshooting](https://doc.sitespect.com/knowledge/troubleshooting?hsLang=en)
- [Releases](https://doc.sitespect.com/knowledge/releases?hsLang=en#main-content)

    - [Superfresh](https://doc.sitespect.com/knowledge/releases?hsLang=en#superfresh)
- [Feedback](https://doc.sitespect.com/knowledge/feedback?hsLang=en)

- [A/B Testing](https://www.sitespect.com/testing-and-experimentation/)
- [Personalization](https://www.sitespect.com/personalization-targeting/)
- [Recommendations](https://www.sitespect.com/recommendations/)

[![Monetate-Logo-Full-Color-1](https://doc.sitespect.com/hs-fs/hubfs/Monetate-Logo-Full-Color-1.png?width=200&height=29&name=Monetate-Logo-Full-Color-1.png "Monetate-Logo-Full-Color-1")](http://monetate.com)

<https://www.facebook.com/> <https://www.twitter.com/> <https://www.instagram.com/> <https://podcasts.apple.com/> [mailto:email@email.com](mailto:email@email.com)

Copyright © 2026, Monetate