PoupeeFlash

@tuanphan I finally found another way to fix it!

Hey @tuanphan, Actually, all the links from the NOTRE CATALOGUE folder nav are broken…and only on mobile device. 😞

I think I just need to find a way to disable the code I am using to have an image above my navigation menu on other screens device, and only on mobile device.

Hello, Yes, this is all my custom code : CSS @font-face { font-family: Bookman Old Style; src: url(https://static1.squarespace.com/static/6526914f318a803a3c6b52f8/t/652fa8d68c27354c6741db24/1697622231225/Bookman+Old+Style+Regular.ttf); } @font-face { font-family: modestoopen-inlinefill; src: url(https://static1.squarespace.com/static/6526914f318a803a3c6b52f8/t/652fa54b40e37169cae7f169/1697621323634/modestoopen-inlinefill.ttf); } p { font-family: 'Bookman Old Style'; } // Site Navigation // .header-nav-item a { font-family: 'modestoopen-inlinefill' !important; font-weight: 600; text-transform: uppercase; } .thumbnail-image { width: 200px; height: 200px; } .header-title { visibility: hidden; } /*.header-announcement-bar-wrapper { background-image:url('https://static1.squarespace.com/static/6526914f318a803a3c6b52f8/t/65367559bb60102805261a53/1698067804092/BANDEAUX_WEBSITE_Plan+de+travail+1.png'); background-repeat:no-repeat; background-size:cover; background-position: center;} .header { background-color:rgba(0,0,0,0)!important }*/ CODE INJECTION <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://d1j8mu9lowy9zf.cloudfront.net/twcsl/0.2.2/twcsl.js"></script> <script> document.addEventListener("DOMContentLoaded",function() { const header = document.getElementById('header'); const firstSection = document.querySelector('.page-section:first-child'); firstSection.after(header); }); </script> <style> @media screen and (min-width: 768px) { #header { position: sticky; top: 0; display: none; background: white !important; margin-bottom: 2em; z-index: 99 !important; } main .page-section:first-child + #header { display: block; } main .page-section:first-child { min-height: calc(50vh - 93px)!important; } } @media screen and (max-width: 767px) { #header { top: 0; position: sticky; z-index: 99 !important; background: white !important ; } .page-section:first-child { display:none; } main .page-section { margin-top: 0px !important; } .header-menu-nav-folder-content { top: -100px !important; } .header-menu-nav-wrapper .header-announcement-bar-wrapper .header-menu-nav .header-menu-bg theme-bg--primary { } } </style> Thanks!

Hello, I got some issues with my menu navigation but only on mobile devices…All the navigation links connected to my shop (shop, products categories) don't work. When you click on it, you're directed to an empty page… This is my website : www.maisonteryel.com Could you help me with that ? Thanks in advance. N.

Hey, I finally find a way to fix it. 🙂 But now, only on mobile device, all those nav links (see screenshots) don't work. I don't understand why cause it's only happening on mobile device. Could you help me with that. Thanks. N.

Yeah that's weird… This all that i got in my code injection : <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://d1j8mu9lowy9zf.cloudfront.net/twcsl/0.2.2/twcsl.js"></script> <script> document.addEventListener("DOMContentLoaded",function() { const header = document.getElementById('header'); const firstSection = document.querySelector('.page-section:first-child'); firstSection.after(header); }); </script> <style> @media screen and (min-width: 768px) { #header { position: sticky; top: 0; display: none; background: white !important; margin-bottom: 2em; } main .page-section:first-child + #header { display: block; } main .page-section:first-child { min-height: calc(0vh - 93px)!important; } } @media screen and (max-width: 767px) { .page-section:first-child { display:none; } .page-section:nth-child(2) { margin-top: 90px !important; } } </style> This is all that i got in my CSS : @font-face { font-family: Bookman Old Style; src: url(https://static1.squarespace.com/static/6526914f318a803a3c6b52f8/t/652fa8d68c27354c6741db24/1697622231225/Bookman+Old+Style+Regular.ttf); } @font-face { font-family: modestoopen-inlinefill; src: url(https://static1.squarespace.com/static/6526914f318a803a3c6b52f8/t/652fa54b40e37169cae7f169/1697621323634/modestoopen-inlinefill.ttf); } p { font-family: 'Bookman Old Style'; } // Site Navigation // .header-nav-item a { font-family: 'modestoopen-inlinefill' !important; font-weight: 600; text-transform: uppercase; } .thumbnail-image { width: 200px; height: 200px; } .header-title { visibility: hidden; }

Ah i don't why it's still not working from my side…

Unfortunately it's stil the same thing :The mobile menu is still hidden. 😞

Hey, Same result than my last screenshot. The mobile menu is still hidden. Thanks. N.

yes : Private link : https://www.maisonteryel.com/ Password : gp/U02w?@7BIw1 Thanks!

Alright ! I taped this : @media screen and (max-width: 767px) { .page-section:first-child { display:none; } } But now, my menu disappeared (see screenshot). Thanks a lot for your help ! N.

Hey there, Back to you cause I want to delete this banner only on mobile device. I used this code : @media screen and (max-width: 640px) { .page-section:first-child { visibility: hidden; } } But there is an big empty white space instead of the banner (see screenshot). How could I delete it? Thanks a lot! N.

Hey there, 😀 Hope you guys are well, I sent you the link. Did you get it? Thanks. N.

Hey, For now the site is not published yet, how could I do that ? Maybe I can send the css code to you? Thanks.