> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mention-me.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Managing Images

> Image dimensions, uploading imagery across single or multiple offers, and managing your image library.

## Image Dimensions

There are two designs available — Half panel and Full width — which require different sized imagery. Consider the contrast of text when using a Full width design as this can impact conversion and accessibility.

When uploading/changing an image, you can find the recommended dimensions beneath each button.

### Half Panel Design

| Journey  | Touchpoint      | Width  | Height | Filetypes         | File Size |
| -------- | --------------- | ------ | ------ | ----------------- | --------- |
| All      | Mobile          | 1080px | 455px  | .jpeg, .png, .gif | \< 5mb    |
| All      | Email           | 1200px | 800px  | .jpeg, .png, .gif | \< 5mb    |
| Referrer | Website         | 960px  | 1260px | .jpeg, .png, .gif | \< 5mb    |
| Referee  | Website         | 846px  | 1194px | .jpeg, .png, .gif | \< 5mb    |
| Referee  | Invited by link | 1200px | 630px  | .jpeg, .png, .gif | 250kb max |

### Full Width Design

| Journey  | Touchpoint      | Width  | Height | Filetypes         | File Size |
| -------- | --------------- | ------ | ------ | ----------------- | --------- |
| All      | Mobile          | 1080px | 455px  | .jpeg, .png, .gif | \< 5mb    |
| All      | Email           | 1200px | 800px  | .jpeg, .png, .gif | \< 5mb    |
| Referrer | Website         | 1920px | 1260px | .jpeg, .png, .gif | \< 5mb    |
| Referee  | Website         | 1692px | 1194px | .jpeg, .png, .gif | \< 5mb    |
| Referee  | Invited by link | 1200px | 630px  | .jpeg, .png, .gif | 250kb max |

### Miscellaneous

| Journey | Touchpoint | Width | Height | Filetypes   | File Size |
| ------- | ---------- | ----- | ------ | ----------- | --------- |
| All     | Logo       | 556px | 223px  | .jpeg, .png | \< 5mb    |

<Tip>
  Use exact dimensions for any images with graphics to ensure the journey looks as expected.
</Tip>

### Image Editing

<img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/28721732504861.gif?s=8591d64220fb12881134b02b854048d1" alt="Image editing tools showing zoom, rotate, and drag to crop" width="1920" height="956" data-path="images/knowledge/referral/design/28721732504861.gif" />

If you don't have the exact size, the platform allows you to **zoom, rotate**, and **drag** to crop the particular section of the image you want.

## Uploading Images

You can upload imagery from two different places, both with the same functionality. You can upload new imagery or select from your image library which contains images you have used in the past.

The platform accepts `.jpeg`, `.png`, and `.gif` files. We recommend file sizes less than 5mb.

### From the Offer Preview

<Steps>
  <Step title="Open the offer preview">
    Open the preview page for the offer you want to change/upload to.
  </Step>

  <Step title="Open image management">
    Click the "Manage images" button in the top right and select "For this offer".
  </Step>

  <Step title="Upload your image">
    Click the "Change" button on your selected touchpoint, then select "Upload new image" and choose an image from your device.

    <img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/28720658310685.gif?s=72093749334fe79d591a059ce0226875" alt="Uploading images from the offer preview page" width="1920" height="924" data-path="images/knowledge/referral/design/28720658310685.gif" />
  </Step>
</Steps>

### From the Image Library

<Steps>
  <Step title="Navigate to image library">
    In the left hand side menu, navigate to **Content > Images**.
  </Step>

  <Step title="Upload your image">
    Click the "Upload Images" button in the top right and select an image from your device.

    <img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/27776301862045.gif?s=c1a5ba0d29cadb645b32aceed9087b57" alt="Uploading images from the image library via Content menu" width="1918" height="956" data-path="images/knowledge/referral/design/27776301862045.gif" />
  </Step>
</Steps>

### Across Multiple Offers

Changing/uploading imagery across multiple offers follows the same process as a single offer. The only difference is that you click the multiple offers option and select the offers you want to change.

<Steps>
  <Step title="Navigate to images">
    In the left hand side menu, navigate to **Content > Images**.
  </Step>

  <Step title="Select multiple offers">
    Click the "Update images across multiple offers" button in the top right. Select the offer type from the right hand side dropdown, then select the campaigns from the left hand side dropdown.
  </Step>

  <Step title="Apply changes">
    Tick the offers from the list shown and click "Manage images" button in the bottom right.

    <img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/27776292220573.gif?s=45dfcc754855d08dea53ad0e8e888646" alt="Updating images across multiple offers at once" width="1918" height="956" data-path="images/knowledge/referral/design/27776292220573.gif" />
  </Step>
</Steps>

<Note>
  You can only bulk update imagery for offers of the same type (e.g. Referral, Drive Action, or NPS survey). To update all imagery, do one type at a time.
</Note>

### Exceptions

The **Referee Invited by link** needs to be updated from the offer preview for each offer. The image uploader tool cannot be used for this specific part of the platform at this time.

Follow [this guide](/knowledge/referral/design/share-messages) to edit the Referee Invited by link (Personalised Share Image & Copy).

### Global and Individual Journey Images

<img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/30290172189213.gif?s=4073fe6d4c15a6787fc62596e2931051" alt="Global and individual journey image settings" width="1918" height="924" data-path="images/knowledge/referral/design/30290172189213.gif" />

Website imagery is split between **global images** and **individual journeys** (optional). Global imagery shares the image across all screens for the referrer and all screens for the referee.

Individual journeys break up the screens into more granular journeys so the customer can see alternative imagery depending on what stage they are on:

| Referrer Sign Up       | Referrer Fulfil | Referrer Duplicate Match                                                                    | Referee Search                                                                                         | Referee Fulfill       |
| ---------------------- | --------------- | ------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | --------------------- |
| Offer, Register, Share | Fulfill         | Match enter email, Match retry email, Match success, Match support, Match support submitted | Name search, Name search duplicate, Name search no match, Register, Existing customers, Referring self | Fulfill, Fulfill fail |

<Tip>
  We recommend changing the image on the Referrer Fulfill and Referee Fulfill screens as an A/B test to drive conversion. You can submit an A/B Test request [here](https://help.mention-me.com/hc/en-gb/requests/new?ticket_form_id=5268134356509).
</Tip>

## Managing Images

### Where

<img src="https://mintcdn.com/mentionme/W7NAR2QiW081Qihu/images/knowledge/referral/design/27776301865245.gif?s=6207d0d7e827a0f336ff988540ee93c6" alt="Image library in Content menu showing uploaded images" width="1918" height="924" data-path="images/knowledge/referral/design/27776301865245.gif" />

In the left navigation go to **Content > Images**. This is your image library containing any imagery you've uploaded to the platform since the feature launched. New imagery uploaded from anywhere will also be stored here.

### Archiving

Remove images from your library by archiving them. The archive button is at the bottom of each image card.

**If an image is being used on an offer and it is archived, it will still be present on the offer until a new image is uploaded.**

### Image Links

When images are uploaded to the platform they are hosted online. Each uploaded image generates a link which you can use. The copy URL button is at the bottom of each image card.
