Header

Topic summary

A user wants to recreate a specific header design shown in an attached screenshot for their Shopify store. The desired layout features a vertical header positioned on the left side, with the main content and footer aligned to the right.

Initial guidance was provided suggesting:

  • Adjusting header settings through the theme customizer
  • Adding custom CSS code to style the header with flexbox properties

The original poster clarified they specifically need help achieving the left-aligned vertical header layout with right-aligned content, rather than just styling modifications. The discussion remains open as the specific implementation for this split-layout design has not yet been addressed.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.

today i saw this header, and i want to make my header like that, can anyone show me how to do it, thank you .

here is my store link (password: 1): https://test-test-test-tutorial.myshopify.com/?_ab=0&_fd=0&_sc=1

Hi,

Hope this will help

  • Need Change Header Settings (Look for options to adjust the layout, colors, and fonts to match the style you want.)
  • Add Custom Code (If Needed)

Code example

.header {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: white; /* Change to match your theme */
  padding: 10px 0;
}
.nav {
  font-size: 16px;
  font-weight: bold;
}
1 Like

yes thank you, this is also a solution, I want to ask if there is a way to make the header on the left, and the content and footer on the right like the picture above, and if so how?