hey @Litos
can you help me reposition the header based on underlined part?
Would really appreciate your help on this.
Thanks!
Topic summary
Goal: Separate the header navigation from the cart and social icons in a Shopify theme, then address logo visibility with a transparent header and adjust header positioning.
What changed and outcomes:
-
Navigation split and layout: Replaced nav-contents.liquid with a revised structure, added CSS (flex layout for .showDesktop .header-menu), and removed the search menu link via Navigation settings. Result: separation and layout worked as intended.
-
Logo missing on homepage with transparent header: When “Enable on the homepage” is toggled in Transparent Header settings, the theme uses the “Alternate logo” instead of “Logo image.” Action: upload the Alternate logo. Result: logo displayed correctly.
-
Header repositioning request: Suggested CSS to constrain width: .site-header .wrapper { max-width: 1500px !important; }. Result: solution provided; confirmation of effect not shown.
Notes:
- Files involved: header.liquid and nav-contents.liquid (theme templates).
- “Transparent header” overlays the header and typically swaps to an alternate logo for visibility.
- Screenshots were used to illustrate the desired header layout and the missing-logo issue.
Status: Main issues resolved; final positioning tweak suggested, awaiting confirmation.