Create a Secondary menu as a section to add to a template

Store Design
, , , , ,
1

Hi everyone.

I want to create a secondary menu ‘about us’ page which will have several subheadings linking to different pages.

I want it to essentially look like the menu at the top but not show in the header, only be available on certain pages.

Anyone know how add / code this?

2

This is what I am wanting. The black menu at the top. It is only available on these subheading’s pages.

https://www.sommerswim.com.au/pages/returns-exchanges

Screenshot 2024-08-01 at 5.28.24 pm.png
Screenshot 2024-08-01 at 5.28.24 pm.png2122×896 82.5 KB

3

Hi @ISTL

Would you mind to share your store URL? thanks!

4

Sure! However I’m working on a new website that isn’t live yet.

Www.indiansummerthelabel.com

5

its okay, do you mean like this right?

Made4uoRibe_0-1722517459692.png
Made4uoRibe_0-1722517459692.png1888×335 184 KB

if its okay, check this one.

  1. From you Admin page, go to Online Store > Themes
  2. Select the theme you want to edit
  3. Under the Asset folder, open the main.css(base.css, style.css or theme.css)
  4. Then place the code below at the very bottom of the file.
@media screen and (min-width: 990px) {
    .header--middle-left {
        display: grid;
        grid-template-areas: 
            "heading icons"
            "navigation navigation";
        grid-template-columns: 1fr auto;
        grid-template-rows: auto;
    }
    .header__inline-menu {
        grid-area: navigation;
        text-align: center;
    }
}
  • And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

6

Hello, thanks for the tip!

Does this make a second menu? I want the header to remain the same, however I want to be able to add a menu as a SECTION to any default page.

So it is to have my main header, but on a ‘about us’ page for example, has a new menu but underneath the header. Refer to image I sent above :slightly_smiling_face: