Crave: How to make zoomed product image modal transparent on the sides

Technical Q&A
, ,

Topic summary

A user customized their product image modal to display smaller images when clicked. They now want to make the white areas on either side of the modal semi-transparent so visitors understand they’re still on the product page and don’t need to click a ‘back’ button.

Current Issue:

  • Modal has been resized successfully
  • White side areas need transparency adjustment
  • Cannot locate the relevant code to modify

Technical Context:

  • Using the Crave theme
  • Involves product page image zoom functionality
  • Likely requires CSS modifications

The discussion remains open with no solutions provided yet.

Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
1

I have made my product modal smaller, so when people click on a product image from the product page, the images are not so big.

Now I would like to make the white areas that are on either side of the grey area semi-transparent, so that users know they are still on the product’s page and don’t have to click the ‘back’ button to go back to the product. I cannot find anywhere in code to change this, and I need help please.

I am using the Crave theme

asiaacorn_0-1706188318359.png
asiaacorn_0-1706188318359.png2032×1007 103 KB