Why is my banner image changing colour to grey?? sahara theme

Store Design

Topic summary

A user is experiencing an issue where their full-width banner background displays as a grey gradient instead of the intended white or transparent color in the Sahara theme.

Attempted Solution:
The user tried adding CSS code to make the banner background transparent using .banner__media { background: transparent !important; } but this did not resolve the issue.

Responses:

  • One commenter requested the page link to better diagnose the problem
  • A PageFly representative provided a solution involving adding custom code to the theme.liquid file above the </head> tag (specific code appears corrupted/reversed in the original text)

Status: The discussion remains open with a potential technical solution offered but not yet confirmed as working.

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

I want my full width banner background to be WHITE or transparent but when I upload it’s looking like this weird grey gradient:

Screen Shot 2024-11-26 at 8.00.29 PM.png
Screen Shot 2024-11-26 at 8.00.29 PM.png1021×699 78.2 KB

I tried to put

.banner__media { background: transparent !important; }

but didn’t work.

Thanks in advance.

2

@mayatranquila can you please share this page link?

3

Hi @mayatranquila

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

Hope this can help you solve the issue

Best regards,

Richard | PageFly