Colandovision Posted November 4, 2019 Posted November 4, 2019 (edited) Im trying to remove the navigation menu from my home page but leave the logo at the top. I can only find answers on removing the entire header along with it, I need to be able to leave the logo untouched. Any solutions? Using the Bedford template Edited November 4, 2019 by Colandovision
tuanphan Posted November 4, 2019 Posted November 4, 2019 You need to share your site url or template name. Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 3 minutes ago, tuanphan said: You need to share your site url or template name. colandovision.com using the Bedford Template
tuanphan Posted November 4, 2019 Posted November 4, 2019 @Colandovision Add to Home > Design > Custom CSS /* Remove nav desktop */ div#headerNav { display: none !important; } /* Remove nav mobile */ .mobile-nav-toggle { display: none; } Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 41 minutes ago, tuanphan said: @Colandovision Add to Home > Design > Custom CSS /* Remove nav desktop */ div#headerNav { display: none !important; } /* Remove nav mobile */ .mobile-nav-toggle { display: none; } These did not change anything for me. I can use <style>#header {display:none}<header> to remove the entire header, but nothing else seems to work when I put in those codes in. Is there something Im writing wrong? I copied and pasted and tried many variations of that
tuanphan Posted November 4, 2019 Posted November 4, 2019 @Colandovision Where did you insert? Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 6 minutes ago, tuanphan said: @Colandovision Where did you insert? under the advanced tab in The Page section/Home/Gear icon/Advanced/Page header code injection
tuanphan Posted November 4, 2019 Posted November 4, 2019 44 minutes ago, Colandovision said: under the advanced tab in The Page section/Home/Gear icon/Advanced/Page header code injection Add my code in HOME > DESIGN > CUSTOM CSS Do not edit anything in the code I sent Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 14 minutes ago, tuanphan said: Add my code in HOME > DESIGN > CUSTOM CSS Do not edit anything in the code I sent Wow thank you that did in fact work, Although I was hoping only to remove it from the home page and not the entire website. Is this possible?
tuanphan Posted November 4, 2019 Posted November 4, 2019 Just now, Colandovision said: Wow thank you that did in fact work, Although I was hoping only to remove it from the home page and not the entire website. Is this possible? Try this code /* Remove nav desktop */ .homepage div#headerNav { display: none !important; } /* Remove nav mobile */ .homepage .mobile-nav-toggle { display: none; } Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 7 minutes ago, tuanphan said: Try this code /* Remove nav desktop */ .homepage div#headerNav { display: none !important; } /* Remove nav mobile */ .homepage .mobile-nav-toggle { display: none; } Thank you so much, finally things look great! appreciate it. Only problem I see is that now there is a black bar above just the homepage i cant get rid of ? Every other page seems fine
tuanphan Posted November 4, 2019 Posted November 4, 2019 Do you enable announcement bar? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 28 minutes ago, tuanphan said: Do you enable announcement bar? nope it is already disabled, so this is frm something else. strange.
tuanphan Posted November 4, 2019 Posted November 4, 2019 33 minutes ago, Colandovision said: nope it is already disabled, so this is frm something else. strange. You inserted this code in Header, remove it /* Remove nav desktop */ div#headerNav { display: none !important; } Colandovision 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Colandovision Posted November 4, 2019 Author Posted November 4, 2019 1 hour ago, tuanphan said: You inserted this code in Header, remove it /* Remove nav desktop */ div#headerNav { display: none !important; } Ok thanks so much. That worked. my mistake. Thanks for all your help 🙂
MarthaC Posted January 14, 2020 Posted January 14, 2020 Hi, this seems very similar to the code I need, I suppose! I am using AVIATOR and I want to take the logo and navigation menu from other pages within my site. Is there a general code for other pages than the homepage? Many thanks!
kak Posted January 12, 2021 Posted January 12, 2021 On 11/4/2019 at 12:59 AM, tuanphan said: Try this code /* Remove nav desktop */ .homepage div#headerNav { display: none !important; } /* Remove nav mobile */ .homepage .mobile-nav-toggle { display: none; } Hi! I am trying to keep the logo but remove the menu in header and then remove the footer fully on only 1 page. Can you help provide the code for 7.1? https://tamarin.health is the website <style>.header, #footer-sections {display:none!important;} </style> I used that earlier but it removed the logo, too. Thank you!!
tuanphan Posted January 13, 2021 Posted January 13, 2021 20 hours ago, kak said: Hi! I am trying to keep the logo but remove the menu in header and then remove the footer fully on only 1 page. Can you help provide the code for 7.1? https://tamarin.health is the website <style>.header, #footer-sections {display:none!important;} </style> I used that earlier but it removed the logo, too. Thank you!! Add this code to Page Header <style> .header-nav, .burger-box { visibility: hidden; } footer.sections { display: none; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
jsl_pentaform Posted July 4, 2022 Posted July 4, 2022 This script as a code block seems to work better in 2022 <style> #header { display: none } </style>
tuanphan Posted July 4, 2022 Posted July 4, 2022 1 hour ago, jsl_pentaform said: This script as a code block seems to work better in 2022 <style> #header { display: none } </style> Yes. Your code works if you need to hide whole header If you need to hide Navigation Bar only, use this code <style> .header-nav, .burger-box { visibility: hidden; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Beautiful22 Posted July 27, 2022 Posted July 27, 2022 Hi tuanphan, Thank you for writing and sharing this code. I have the same problem, but when I pasted your new 2022 code under Custom CSS, it said Syntax Error Line 1. I want my logo at the top, no navigation menu on the top right. The computer version, looks fine. The mobile version, there are two horizontal lines. How can I get rid of those? When clicked on, a light green box appears and the only choice is to hit the X at the top.
Beautiful22 Posted July 27, 2022 Posted July 27, 2022 On 7/4/2022 at 4:42 PM, tuanphan said: If you need to hide Navigation Bar only, use this code <style> .header-nav, .burger-box { visibility: hidden; } </style> I reread this and see I needed to put the code into each page's header advanced>page header code injection area. I did that on each page and it worked! Thank you. It's still possible to click that hidden area and get the empty green box. Is there a way to omit the link entirely or am making this harder than necessary? My site isn't live yet.
Beautiful22 Posted July 27, 2022 Posted July 27, 2022 @tuanphan I noticed a photo friend was having the same error on her page with the hamburger box/menu displaying incorrectly in mobile view. I told her this morning and her IT guy fixed it immediately. It's not hidden, it's totally gone. Plus she's able to have a button on the upper right in her desktop view. That's what I'd like: no menu in mobile, a button in desktop. This is her website: https://kdaltonphotography.com/ if you want to see.
tuanphan Posted July 28, 2022 Posted July 28, 2022 On 7/27/2022 at 7:27 AM, Beautiful22 said: Hi tuanphan, Thank you for writing and sharing this code. I have the same problem, but when I pasted your new 2022 code under Custom CSS, it said Syntax Error Line 1. I want my logo at the top, no navigation menu on the top right. The computer version, looks fine. The mobile version, there are two horizontal lines. How can I get rid of those? When clicked on, a light green box appears and the only choice is to hit the X at the top. I said add that code to Page Header. DO not add to Custom CSS. If you need to do it on side wide, add this to Design > Custom CSS .header-nav, .burger-box { visibility: hidden; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment