alwalt Posted August 4, 2020 Share Posted August 4, 2020 Site URL: https://lizard-chartreuse-ftf8.squarespace.com/ Hello community! https://lizard-chartreuse-ftf8.squarespace.com/ Password: solar2020 Trying to make the mobile menu overlay over the background image the same as it does on the desktop view. I found a bunch of code on the answers forum, but nothing is working for my site... Thanks in advance. Link to comment
Solution tuanphan Posted August 4, 2020 Solution Share Posted August 4, 2020 Add to Home > Design > Custom CSS .Mobile-bar.Mobile-bar--top { position: absolute; z-index: 999; top: 0; left: 0; width: 100%; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
saylinds Posted November 12, 2020 Share Posted November 12, 2020 (edited) @tuanphan Is this written for 7.0 as well? Doesn't seem to work on my site www.saylinds.com Edited November 12, 2020 by saylinds hyperlink Link to comment
tuanphan Posted November 12, 2020 Share Posted November 12, 2020 33 minutes ago, saylinds said: @tuanphan Is this written for 7.0 as well? Doesn't seem to work on my site www.saylinds.com above code for 7.0 brine template I see you solved? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
saylinds Posted November 12, 2020 Share Posted November 12, 2020 @tuanphan I did, I found another one of your codes posted elsewhere. thank you! tuanphan 1 Link to comment
tuanphan Posted November 12, 2020 Share Posted November 12, 2020 3 hours ago, saylinds said: @tuanphan I did, I found another one of your codes posted elsewhere. thank you! I love your site design, just shared site with my friend :xx Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
saylinds Posted November 17, 2020 Share Posted November 17, 2020 @tuanphan Wow thank you so much! For how many sites you probably see that is a high compliment 🙂 Link to comment
SouthernSunEvents Posted June 29, 2021 Share Posted June 29, 2021 On 11/11/2020 at 9:41 PM, tuanphan said: above code for 7.0 brine template I see you solved? Tried this code but no luck. Any ideas? http://www.southernsunevents.com PW: sse2020 Link to comment
tuanphan Posted July 1, 2021 Share Posted July 1, 2021 On 6/29/2021 at 10:46 PM, SouthernSunEvents said: Tried this code but no luck. Any ideas? http://www.southernsunevents.com PW: sse2020 Add to Design > Custom CSS > Then save & reload the site /* Mobile header transparent */ @media screen and (max-width:640px) { body.homepage .Mobile-bar.Mobile-bar--top { background-color: transparent; } body.homepage { margin-top: 0 !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 1, 2021 Share Posted July 1, 2021 (edited) 12 hours ago, tuanphan said: Add to Design > Custom CSS > Then save & reload the site /* Mobile header transparent */ @media screen and (max-width:640px) { body.homepage .Mobile-bar.Mobile-bar--top { background-color: transparent; } body.homepage { margin-top: 0 !important; } } Works great but now the logo is scrolling and overlapping my banner image text. Punch the code to do tablet too and having the same problem. Thanks! Edited July 1, 2021 by SouthernSunEvents Link to comment
SouthernSunEvents Posted July 22, 2021 Share Posted July 22, 2021 On 7/1/2021 at 4:07 PM, SouthernSunEvents said: Works great but now the logo is scrolling and overlapping my banner image text. Punch the code to do tablet too and having the same problem. Thanks! @tuanphanwanted to add to this that this made the homepage transparent only and I'm aiming for site wide. Thanks! Link to comment
tuanphan Posted July 23, 2021 Share Posted July 23, 2021 12 hours ago, SouthernSunEvents said: @tuanphanwanted to add to this that this made the homepage transparent only and I'm aiming for site wide. Thanks! change Quote body.homepage to Quote body Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 23, 2021 Share Posted July 23, 2021 3 hours ago, tuanphan said: change to No luck on this Using code below. Do I have it correct? /* TRANSPARENT MOBILE HEADER - NEED SITEWIDE */ @media screen and (max-width:640px) { body Mobile-bar.Mobile-bar--top { background-color: transparent; } body { margin-top: 0 !important; } } Link to comment
tuanphan Posted July 25, 2021 Share Posted July 25, 2021 On 7/23/2021 at 5:27 PM, SouthernSunEvents said: No luck on this Using code below. Do I have it correct? /* TRANSPARENT MOBILE HEADER - NEED SITEWIDE */ @media screen and (max-width:640px) { body Mobile-bar.Mobile-bar--top { background-color: transparent; } body { margin-top: 0 !important; } } Can you share link to page in screenshot? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 26, 2021 Share Posted July 26, 2021 On 7/24/2021 at 10:41 PM, tuanphan said: Can you share link to page in screenshot? Looking to do site wide but just in case it's: https://www.southernsunevents.com/contact-us Link to comment
tuanphan Posted July 27, 2021 Share Posted July 27, 2021 18 hours ago, SouthernSunEvents said: Looking to do site wide but just in case it's: https://www.southernsunevents.com/contact-us Try this code >> Then save & reload the site .tweak-mobile-bar-top-fixed .Mobile-bar--top { position: fixed; top: 0; left: 0; z-index: 1001; background-color: transparent !important; } @media screen and (max-width:640px) { body { margin-top: 0 !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 27, 2021 Share Posted July 27, 2021 (edited) 5 hours ago, tuanphan said: .tweak-mobile-bar-top-fixed .Mobile-bar--top { position: fixed; top: 0; left: 0; z-index: 1001; background-color: transparent !important; } @media screen and (max-width:640px) { body { margin-top: 0 !important; } } Works great and I adjusted to use max with 991px to convert on tablet view too but now my banner images are a bit cropped at the bottom. Any ideas? Two more questions: - I have white logos in code injection on these pages for desktop but they aren't converting on mobile/tablet. Do I need a separate injection for this? - How can I stick the navigation at top sitewide? Thanks so much for your help! Edited July 27, 2021 by SouthernSunEvents Link to comment
SouthernSunEvents Posted July 27, 2021 Share Posted July 27, 2021 1 hour ago, SouthernSunEvents said: Works great and I adjusted to use max with 991px to convert on tablet view too but now my banner images are a bit cropped at the bottom. Any ideas? Two more questions: - I have white logos in code injection on these pages for desktop but they aren't converting on mobile/tablet. Do I need a separate injection for this? - How can I stick the navigation at top sitewide? Thanks so much for your help! Just noticed this happened on my two pages without banner images at the top Link to comment
tuanphan Posted July 29, 2021 Share Posted July 29, 2021 I have white logos in code injection on these pages for desktop but they aren't converting on mobile/tablet. Do I need a separate injection for this? Can you share link to a page? - How can I stick the navigation at top sitewide? You mean sticky header on scroll? Q3. overlap Can you share link to these pages in screenshot? Will need to adjust code on these pages Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 29, 2021 Share Posted July 29, 2021 (edited) 14 hours ago, tuanphan said: I have white logos in code injection on these pages for desktop but they aren't converting on mobile/tablet. Do I need a separate injection for this? Can you share link to a page? - How can I stick the navigation at top sitewide? You mean sticky header on scroll? Q3. overlap Can you share link to these pages in screenshot? Will need to adjust code on these pages http://www.southernsunevents.com PW: sse2020 For navigation I just want to keep the nav menu at top of site and don't want it to scroll down Links to logo/text overlap pages: https://www.southernsunevents.com/portfolio https://www.southernsunevents.com/about Also on these two pages my banner images have been cropped from the bottom on mobile and tablet, any ideas?: https://www.southernsunevents.com/contact-us https://www.southernsunevents.com/services Thanks @tuanphan! Edited July 29, 2021 by SouthernSunEvents Link to comment
tuanphan Posted July 30, 2021 Share Posted July 30, 2021 21 hours ago, SouthernSunEvents said: http://www.southernsunevents.com PW: sse2020 For navigation I just want to keep the nav menu at top of site and don't want it to scroll down Links to logo/text overlap pages: https://www.southernsunevents.com/portfolio https://www.southernsunevents.com/about Also on these two pages my banner images have been cropped from the bottom on mobile and tablet, any ideas?: https://www.southernsunevents.com/contact-us https://www.southernsunevents.com/services Thanks @tuanphan! Add to About, Portfolio Page Header <style> @media screen and (max-width:640px) { .Site-inner { top: 83px; } } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted July 30, 2021 Share Posted July 30, 2021 (edited) 3 hours ago, tuanphan said: <style> @media screen and (max-width:640px) { .Site-inner { top: 83px; } } </style> No luck with this code. Any ideas on these items too? Thanks so much for your help - Keeping navigation at top of the page (no scroll) - Cropped banner images on the following pages: http://www.southernsunevents.com/contact-us http://www.southernsunevents.com/contact-us Edited July 30, 2021 by SouthernSunEvents Link to comment
tuanphan Posted August 1, 2021 Share Posted August 1, 2021 On 7/30/2021 at 11:41 PM, SouthernSunEvents said: No luck with this code. Any ideas on these items too? Thanks so much for your help - Keeping navigation at top of the page (no scroll) - Cropped banner images on the following pages: http://www.southernsunevents.com/contact-us http://www.southernsunevents.com/contact-us Can you share link to page where you added code? We will check it again Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SouthernSunEvents Posted August 2, 2021 Share Posted August 2, 2021 On 8/1/2021 at 2:47 AM, tuanphan said: Can you share link to page where you added code? We will check it again Just tried this again and now it magically works but now tablet nav is a mess? Still needing help with the following: - Keeping navigation at top of the page (no scroll) - Cropped banner images on the following pages: http://www.southernsunevents.com/contact-us http://www.southernsunevents.com/services 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