put the grey bar under the header

Store Design
, , , , , , , , , , , , , , ,
1

i need to put the grey bar (the one under the red bar) under the black header of my site. i think i have to separate it from the header first as they are joined, can anyone help me? thanks

website url: https://juliettemarseille.fr/

2

i need to put it under the black header so: red bar-black header-gray bar

3

Hey @matthewdropship ,

This need to interchange the coding of the header and gray bar in the theme file.

Would you like to share the store collab code in the p/m so that I can interchange the current code.

Thanks

4

Hi @matthewdropship Here is the solution with custom css code.

Please follow the steps.

  1. Go to the code editor
  2. Search the base.css file
  3. Go to the base.css file and add the provided code at the bottom of the base.css file
  4. Save the file and check the preview
  5. Sayed_Safin_0-1751138703501.png
    Sayed_Safin_0-1751138703501.png1909×1234 300 KB
.shopify-section-group-header-group div[data-section-type="header"]{
    display: flex;
    flex-direction: column-reverse;
}

Thanks!

5

Hey! @matthewdropship ,

Could you kindly share your store URL and password (if it’s password-protected) so I can review it and provide you with an update?

.section-sections--25548504695049__ss_announcement_bar_slider_Bp9UNP.announcement-sections--25548504695049__ss_announcement_bar_slider_Bp9UNP {
    position: relative !important;
    top: 131px;
    z-index: 9999 !important;
}
.header-sticky-wrapper {
    top: -49px !important;
}

@media(max-width: 768px){
.section-sections--25548504695049__ss_announcement_bar_slider_Bp9UNP.announcement-sections--25548504695049__ss_announcement_bar_slider_Bp9UNP {
    position: relative !important;
    top: 92px !important;
    z-index: 9999 !important;
}
}