Gigi-C
-
Posts
47 -
Joined
-
Last visited
Gigi-C's Achievements
-
Hey! I'm having some issues replicating the code that I have used for the desktop view of my website for mobile. On desktop I have a code in place that on scroll, the logo in the nav bar changes so it can be seen on the white background. I thought it would do the same on mobile, but it doesn't, so I was wondering if anyone could help (please see video). Site URL: https://thevalleycleaningservices.squarespace.com/ Thanks so much in advance! Screen Recording 2024-09-06 at 11.01.28.mov
-
@Beyondspace omg thanks so much for this!!! I was wondering if you could also help me with the hamburger icon, it does a similar thing on scroll whilst closed - stays white on scroll instead of going black like the logo. Do you know what I could use for this? Many thanks!
-
Beyondspace reacted to a post in a topic:
Mobile menu code issue
-
Hello! website: coucoustudio.squarespace.com PW: CCS24 I used a code to change my logo on scroll with a transparent background to a solid background with a black logo. However when you open the hamburger menu on mobile and scroll it reverts back to the white/light logo (see video) Could someone help me understand how to make sure it stays the black logo when the hamburger menu is open? Thanks! Screen Recording 2024-05-16 at 18.32.05.mov
- 2 replies
-
- 1
-
-
- mobile
- mobile-information-bar
- (and 1 more)
-
Target PDP's with code to change navigation colour
Gigi-C replied to Gigi-C's topic in Customize with code
Hey @colin.irwin So the custom code is pretty long, as there's a few parts to it which create the effect at the moment /******HOMEPAGE******/ header#header.shrink svg.icon { stroke: black; fill: black; } //-------------// //***HEADER***// header#header.shrink { background-color: white !important; } /* Change logo on scroll */ .shrink .header-title-logo img { visibility: hidden; } .shrink .header-title-logo a { background-image: url(https://static1.squarespace.com/static/6583ad4a5d6aab0922f2d42d/t/663d03d8b127c3081d3643f6/1715274712696/Artboard+1+copy+4.png); background-size: contain; background-repeat: no-repeat; background-position: center center; } //--- nav link colour on scroll--// header#header.shrink a { color: black; opacity: 1; } header#header.shrink img { filter: invert(1); } header#header.shrink use { fill: black !important; stroke: black !important; } //---- mobile nav----// (changes the logo and nav links colour from white the black) body:not(.header--menu-open) header#header img { content:url(https://static1.squarespace.com/static/6583ad4a5d6aab0922f2d42d/t/663d05a44b2a3437f0db91cd/1715275172328/Artboard+2.png) !important;} body.header--menu-open header#header img { content: url(https://static1.squarespace.com/static/6583ad4a5d6aab0922f2d42d/t/663d03d8b127c3081d3643f6/1715274712696/Artboard+1+copy+4.png);} Thank you for the help so far! -
https://coucoustudio.squarespace.com/ PW: CCS24 I used code to transform my header from transparent with white text to white background with black text on scroll. However, my PDP's have a white background and now the header doesn't show up on those pages because of this. Is there a way I can target the PDP's only to reverse this effect, so my header is constantly black? Thanks! Screen Recording 2024-05-14 at 10.22.28.mov
-
Change Cart Icon Colour in Nav Bar on Scroll
Gigi-C replied to Gigi-C's topic in Customize with code
Thanks so much @tuanphan I have a similar issue in terms of colour on the same website I have used code so that when you scroll down the page, the logo goes from white to black (with a solid white nav background) However, the product pages in the video, are against a white background, and that means the logo doesn't show properly. Is there a code I can use to target only product pages that will allow me to use the black logo instead? Thanks in advance! Screen Recording 2024-05-14 at 00.04.53.mov -
https://thevalleycleaningservices.squarespace.com/ On the services part. Thank you!
-
www.coucoustudiony.com pw: CCS24 I have managed to find code to allow me to invert the colours to show on a solid white background on scroll in the navigation, however the cart button did not change. I've tried to look for code and implement it myself however I can't seem to make it work. Thanks! Screen Recording 2024-05-09 at 18.33.25.mov
-
Ah thank you for trying! @tuanphan
-
Hey @tuanphan I understand it is not possible with the Will myers code, but I found a website (linked above) that does allow it to work on mobile. Wondering if you know how I can make it work on mobile? Thanks!
-
Gigi-C reacted to a post in a topic:
Parallax Scroll BG
-
@Shadmon Yes of course, www.coucoustudiony.com pw: CCS24 Thanks!
-
Hey @Shadmon thanks so much! However, it doesn't work on iOS devices (ipad & mobile) - sorry, I should've been more specific! Do you have any workaround for this? Many thanks!
-
URL: coucoustudiony.com pw: CCS24 Hello, I was wondering if anyone has a work around for the mobile version of this @WillMyers code for a parallax effect. https://www.will-myers.com/adding-parallax-effect-to-a-background-image-in-squarespace-71 I've seen it's possible on mobile as this website have it on mobile(maybe it's a testimonial thing?) https://thesocialagency.dk/ Thank you in advance!
-
Change font for testimonial title - list item
Gigi-C replied to Gigi-C's topic in Customize with code
Thanks so much for this! -
URL: https://coucoustudio.squarespace.com/ PW: CCS24 Hey all! I have a dilemma that I can't seem to solve. I have a testimonial block with simple list - however I can't get the the title to customise the font - I want the font to be the same but I want to change the weight to regular/light and I want to change the size. Is there a code for this? I've looked and added some but somehow nothing works. Not sure if it might be my browser? Also - if anyone knows of a neater, minimalist way of doing this without the faff, please let me know. Thanks so much!
