tillie Posted May 18, 2022 Share Posted May 18, 2022 Site URL: https://franklywrite.squarespace.com/home Hi Team, I have tried a number of codes from different responses in the forum and nothing seems to be working... is anyone able to assist me in forcing a hamburger menu for this page https://franklywrite.squarespace.com/home I have been trying the below - But it keeps blanking out the menu and not showing anything. I can't work out why!! //Hamburger Menu Home Page// body#collection-620dde5869dba9120dfd8979{ @media screen and (min-width:768px) { /* hide navigation */ .header-nav { display: none; } /* Hide header button */ .header-actions { display: none; } /* show burger */ .header-burger { display: flex; } /* Show overlay mobile menu */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } }} Link to comment
PhilHoughton Posted May 18, 2022 Share Posted May 18, 2022 Hi @tillie it works fine without wrapping it in the collection ID. so just put this in the header injection on the specific page you want to change. <style> /*Turn mobile menu on all sizes*/ /* 768 for tablet - desktop - 992 for desktop */ @media screen and (min-width:768px) { /* hide navigation */ .header-nav { display: none; } /* Hide header button */ .header-actions { display: none; } /* show burger */ .header-burger { display: flex; } /* Show overlay mobile menu */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } } </style> Link to comment
tillie Posted May 19, 2022 Author Share Posted May 19, 2022 @houghtoncreative Ah of course! Thank you for the prompt! Works perfectly PhilHoughton 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment