I have created a new navigation menu for my blog page only. However, when I tried editing the Debut theme to change the navigation menu, it will automatically change it for the entire site. I would like to use a different navigation menu only for the blog.
Please help me resolve this issue if anyone has figured it out. I would sincerely appreciate if you could share your knowledge.
I looked into this and spoke to our theme support team for you. They mentioned it is something that would need to be looked further into and would be a little out of the scope of a reply in the community here. If you would like I could reach out to you via email directly to have our theme support team take a closer look for you or if you wanted to contact our support team directly about it you can do so from here.
If you would like me to reach out to you, could you confirm if the best email to catch you on is the one you signed up to the community with if it isnât can you let me know which is the best one? ?
If you can help then Iâll be extremely happy if you would take the time out to reach out to me. Contacting me on my registered email address is perfect.
I look forward to hearing from you soon. Thank you for your time.
This is completely addressable in a forum post. Youâll want to find where your navigation is included in your theme. In my default Debut theme, itâs located in the header.liquid file in the sections folder. In header.liquid you can look for an include for the site nav. So ctrl + f for âincludeâ or âsite-navâ. Youâll want to make an if statement around that, like this:
{% if template == "blog" %}
{% include 'blog-nav' %}
{% else %}
{% include 'site-nav' %}
{% endif %}
Then open up the site-nav.liquid file in the snippets folder. Copy that code and create a new snippet called âblog-navâ and paste the site-nav code into your new âblog-navâ. On the second line you will see this:
{% for link in linklists[section.settings.main_linklist].links %}
Change that in the brackets to whatever the handle of your linklist is that you created for your blog. Im going to replace it with a dot, because I prefer the way that looks to brackets. Like this:
{% for link in linklists.your-navigation-name.links %}
Now when you go your blog you will have a different set of links.
Thank you for your help. I just tried to resolve it with your code. I followed it step by step and had no effect on the blog page as it still is using the main nav.
okay I just wanted to be sure you were on a blog template. Iâd probably need to take a look at your files to be sure whatâs going on. I sent a request to access parts of your site from my developer store. If you accept the request I can take a look to see whatâs going on.
Actually, I see that you did do the if statement, but itâs inside another if statement that says âif section.settings.align_logo == âcenterââ, so since you probably dont have that option checked in your customize view in your header section, it didnât enter in there.
hi @Ninthony thanks so much for the code. it worked on my site, i wanted 1 nav for the home page (âalt-navâ for âindexâ) and another for the rest of the site (âsite-navâ for everything else). however, when the menu is collapsed (like on mobile), it just reverts to âsite-navâ for everything, even the home page.
can you help? iâm attaching 2 screenshots. and here is the website: www.foliotravel.com
Okay I wrote this a while ago. This is probably a better way to approach it. Undo your previous changes and then open up header.liquid in your sections folder and add this to the very top:
Then still inside header.liquid ctrl + f for âMobileNavâ and youâll find the mobile navigation. Change that from this:
{% for link in linklists[section.settings.main_linklist].links %}
To this:
{% for link in linklists[link_list].links %}
Then go into site-nav.liquid and do the same thing, replace the for loops âsection.settings.main_linklistâ to âlink_listâ as youâll still have access to that variable. Then you should be good to go.
I was able to do this, but the menu actually disappears on the non-homepages. but if i use âmain-menuâ instead of âsite-navâ (see below) then it works. Any insight as to why itâs not working when using âsite-navâ? Just kind of curious at this point.
it has to be the handle of whatever link list youâre using. I assumed it was âsite-navâ from your previous comment. âmain-menuâ is the default link list that debut pulls from.
Ah, got it. I had thought that âsite-navâ was the name of the object that gets changes depending on what you use when selecting the header on the customization page. Rookie mistake
Hi @Ninthony I saw all of your helpful comments and was hoping you could help me with customizing my blog page. My theme is Streamline and it does not have âsite-nav.liquidâ under Snippets, so I was unable to apply your previous advice. What Iâm trying to do is remove the global navigation from the blog only so it feels like more of a blog and less like a section/page of the website.
Iâm currently having a logo designed for the blog and would like to upload that when itâs completed so it feels more like an editorial magazine thatâs an extension of the brand, but not a page of the website.