banner across a section on thegrapewizard.co.uk

Store Design

Topic summary

Goal: Add a prominent banner (with text) before a section/collection on a Shopify wine shop to guide customers; specifically, a differently colored banner where the “Fine Wines” section starts.

Progress:

  • Requestor shared a screenshot to show the desired placement. The image is central to understanding location and styling.
  • Helper interpreted the need as changing the section’s background color and provided a method to apply styling via theme code.

Proposed solution:

  • In Shopify admin: Online Store > Edit code > theme.liquid.
  • Add custom CSS near the end of the file (above the tag) to set a new background color for the target area. The helper noted the color can be customized and showed a “result” screenshot. (Exact code snippet isn’t visible in the transcript.)

Notes/Considerations:

  • The user originally asked for a “banner with text”; the provided fix addresses background color. Additional HTML/CSS may be needed if a distinct banner element with text is required.

Status: Awaiting the requester’s confirmation; no final resolution yet.

Summarized with AI on December 17. AI used: gpt-5.
1

hi guys

need some help

i have a wine shop online and just before a section/collection i need a banner that highlights what the consumer need to do

i would ideally like some sort of banner with text that does what it says

help advisor on shopify has suggested coding for just that bar and suggested this forum

is there anyone out there that had similar problems

best regards

jason

www.thegrapewizard.co.uk

1 Like
2

Hey @thegrapewizard

Do you have any reference or a screenshot that would help me in understanding better so I can help you out?

Best Regards,

Moeed

3

IMG_2676.png
IMG_2676.png1290Ă—2796 647 KB

4

Where” fine wines “ starts I would ideally like a banner in a different colour

5

Hey @thegrapewizard

I’m guessing you wanna change it’s background color, if I’m correct then.

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

NOTE: Change the black color to any color you want.

RESULT:

Moeed_0-1728546328001.png
Moeed_0-1728546328001.png374Ă—665 251 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed