How can I customize my menu header?

Store Design
, , ,

Topic summary

A user seeks help customizing their menu header appearance and has provided an annotated image showing their desired design. They also included a screenshot of their current header for comparison.

Response provided:

  • PageFly support representative offered a solution involving custom code
  • Instructions given to add code to theme.liquid file above the tag

Implementation steps:

  1. Navigate to Online Stores > Themes > More Actions > Edit code
  2. Click on theme.liquid and paste the provided code above
  3. Background color can be adjusted by modifying the code

Note: The actual code snippet and images appear corrupted or encoded in the conversation, which may affect implementation. The solution focuses on theme-level customization rather than using a page builder app.

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

Hello! For my menu header, there is a specific way I want to have it look, but I cant figure out how to change it. The picture below that has the notes on it, is what I want my menu to look like.

Screen Shot 2024-01-02 at 12.25.47 PM.png
Screen Shot 2024-01-02 at 12.25.47 PM.png1665×690 146 KB

I am also including a picture of what my header looks like currently! Any help is appreciated!

Screen Shot 2024-01-02 at 12.28.05 PM.png
Screen Shot 2024-01-02 at 12.28.05 PM.png2871×1627 402 KB

2

Hi @k_gabby_04

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

You can change the deeppink to change to your background color

Hope this can help you solve the issue

Best regards,

Richard | PageFly