Skip to main content

How To Override the Product Image

Jabir avatar
Written by Jabir
Updated over 3 years ago

The app shows the main product image by default and only switches to the variant image if it is selected using the variant dropdown.

In cases like the one this merchant describes (when they are upselling only a single variant), merchants sometimes expect that variant's image to show instead.

You can fix this by overriding the image for a specific offer like this:

#nudge-offer[data-offerid="YOUR_OFFER_ID"] .product-image-wrapper img{

background-image: url(YOUR_DESIRED_IMAGE_URL);

object-position: -99999px 99999px;

height: auto !important;

background-repeat: no-repeat;

background-size: cover;

padding: 0px;

}

Did this answer your question?