joshuahext

Oh, I had missed a { in my code so it had all broken, stopping the change logo on scroll. So, now that's fixed... I get: ...before scrolling.

Hey, I've just noticed that the logo also remains white when the menu is open. I have also tried some code to fix that but can't figure it out. Do you have any thoughts on that too?

Perfect, thanks!

Hey all, So, a client requires that the hamburger on their homepage is: 1. White before the header shrinks on scroll + before the menu is opened 2. Grey after the header shrinks on scroll + before the menu is opened 3. Grey before and after the header shrinks on scroll + after the menu is opened. I used the code below to achieve this: #collection-66729b4c507c183e7979f764 { #header:not(.header--menu-open) .burger-inner > div { background-color: white; transition: all 0.5s ease-in-out; } #header .header--menu-open .burger-inner > div { background-color: #3e4245 !important; transition: all 0.5s ease-in-out; } #header.shrink .burger-inner > div { background-color: #3e4245; transition: all 0.5s ease-in-out; } } However, for some reason it's not working and I cannot figure out why. Any help would be greatly appreciated! Site is here: https://www.jandjeducation.com/

Oh my god I'm an idiot. Thank you so much. I didn't think that it could be that the image below was being made darker. That's perfect. Thanks!!!

Site URL: https://parrot-bird-pz4d.squarespace.com/ PW: Fiona Hi all, I went to bed last night and everything was fine, but upon waking the gradient header now lightens everything underneath it. I do not want this at all and have no idea how to fix it. I thought perhaps the client making some changes while I slept caused it but removing all of my code does not fix the issue and I have searched through all of Squarespace's Header customization options that I can find and there doesn't seem to be anything causing it there either. Please help! You can see the effect I am referring to here: I've also noticed that it's made the black gradient that I've coded for the shrink header a weird lighter grey instead of the pure black I have coded. EDIT: I've spoken to the client and they made no changes to the Header overnight. So far I have tried: .header .header-announcement-bar-wrapper { -webkit-backdrop-filter: unset !important; backdrop-filter: unset !important; background: none !important; mix-blend-mode: normal !important; } to try to remove this effect to no avail.

@tuanphan, I'm having the same issue. I can get this code snippet to work for every other kind of block but not shape blocks. It would be wonderful if we could get your brain on this!

Same issue, a client really wants to be able to use arrows to navigate a slideshow.

Hahaha, they just said "ask people on the forums, we won't do anything for you. And we can't be held responsible for the efficacy of their solutions" so I don't think they're going to do anything. Definitely raised the issue though.

That was the solution! I'll just go into a bit more detail to help anyone with the same issue: So, at my 100% zoom level I can't shrink the text block. Then, even with centre alignment, zooming out, shrinking the text box and then saving works a treat. Now everything works perfectly on all monitor sizes. The only thing to flag is, if and when anyone else has this issue, whenever you change anything at all, the block will revert to having the massive spacing. So every time, before saving, zoom out to 200%, shrink the block last and then save. Learn to know where the other blocks will sit when you shrink the block because it has to be the very last thing you change. Thanks again!

Hey there! Okay, so I tried the zooming out crazy amounts and shrinking the block and it seems to have worked on my monitor. That's crazy. I just kept going "SURELY NOT" out loud the whole time. I need to wait until my client wakes up to check with them as to whether it's fixed on their monitor but that's crazy. I would never have thought of something as simple as zooming out wildly to fix it. I don't get why FE wouldn't just make it flush with the block below at all sizes as standard though given that if you put two blocks together you obviously want them to stay together at all monitor sizes and as it always has on the 20 or so prior sites I've built but I guess things are always shifting and changing at the moment. That's kind of bonkers. I'll reach back out here to say whether it worked for the client or not but if that's the solution I will obviously mark your last message as such and I will be in your digital debt forever ahaha. Thanks for working with me on this so far.

I've tried reducing it with code but unfortunately it you reduce it on the monitor it shows up on it overlaps on the others. I will reach out to Squarespace just wanted to make sure I wasn't missing anything. Any further thoughts from anyone would be greatly appreciated though as speed is of the essence here.

Hi @melody495 I'm afraid that isn't the solution. I can't shrink the text block any further than it's current size whatever alignment I set it to. So there's something causing this massive spacing that's unrelated to my code (as the issue persists even if I remove it all) and the alignment.

This is exactly what I am wondering.

Hey, so Will Myers has a great tutorial for doing anchor links with offsets without the need for scroll-margins (which don't see to work on Squarespace since the latest update) https://www.will-myers.com/articles/anchor-link-offset-trick-in-squarespace Hope that helps!

Hey all! Not going to take this down but found you can adjust the menu columns by using the below CSS: .menu-block .menu-style-classic .menu-items { column-width: 25em !important; column-gap: 4em !important; } By adjusting this I've gotten to something the client is happy with. Do let me know if there's another way though!

Hi all, So, I am creating a menu for a client, using the menu block, but they want the menu to only have two collumns even at wider screen sizes. Is there a way to limit the amount of columns that the multi-column layout creates? The link is below: https://www.cinicocoffee.com/menu Thanks!

Hey, thanks for getting back to me! Unfortunately neither of those work. They both fade in the drop down after it's quickly swiped in. I'm looking to slow down that standard swipe animation itself. Can you possibly help with that?

Hey all, So, I'm just upgrading my personal site to 7.1 now. Right now I just have a basic teaser landing page with an accordion block to open up my bio. My issue is that the Accordion block's animations are so quick and I'd really like to be able to smoothly slow them down to 1s long. But I can't find a way to do it smoothly whatever I try. If anyone could help that would be amazing! URL is https://www.joshuahext.com/, there's no password needed.

Bump

Yeah, the issue only started for me after the UI update too. ...and I agree with everyone saying Squarespace's response to this has been very disheartening. The only thing I can suggest is my solution above in the meantime, which is: to go to the site on your phone, force desktop mode, and then upload the font from your phone. It works for me and I am on a Samsung Android device. I have no idea whether it will work on other phones though.

It's terrible, I've got clients breathing down my neck on these projects too and I'm having to tell them I literally cannot progress as I cannot upload any fonts. I haven't noticed it affecting any fonts already in place though. Anyone figured a way of hosting these fonts elsewhere or something until this sh*tstorm blows over? EDIT: Found a workaround that works for me in particular, if you go to the site on your phone, force desktop mode, and then upload the font from your phone, it should upload. This seems to be a working solution until they fix this. Hope that helps you guys too!

God, that would be a real dealbreaker for me. The guy at customer help didn't say they were planning on dropping the functionality to me and did say that it was an issue their devs were aware of. So, I hope that's not the case. Will send a follow up email to him though highlighting you are having the same issue on mac.

For the past week or so, all of my clients have been complaining about Squarespace being on the fritz, and I have definitely experienced it too. Needing to refresh constantly to see changes, pages not wanting to save to allow me to refresh, the custom css box throwing up errors where there are none until you refresh and then they're magically gone. etc. But waking up this morning to the new UI was a nice surprise, "Oh!" thought I, "This is why everything has been going wrong, they were preparing this. Everything will run smoothly now." Getting to grips with the new layout took all of 5 minutes and I like that they've put custom CSS and Code Injection together now etc. Looks great. Styles are a little hard to find and I imagine will be difficult for new users to stumble upon but apart from that, great. My issue came with when I tried to upload a custom font to the custom folders section. I was uploading a .ttf which is listed as one of the accepted files and yet I got the attached error. ...So, I contact Squarespace Customer help to tell them that this functionality has broken since the update. They tell me they can't help with custom code. I say it's not about custom code, it's about the uploading feature. He sends me a video of it uploading fine on mac and tells me it's a "device or browser" issue. So I try every browser I have, and none of it works. So we realize that it's just that the development team have entirely forgotten to make it work for half or more of their user base: Windows users. Absolutely unbelievable. Shortly after, he sends an email telling me that it's an issue they are aware of already, so I assume they have had a lot of Windows users ranting and raving this morning. I guess my question is, are you a windows user, are you having this issue too, and do you have any workarounds while they get their sh*t together? I've tried doing it as a file upload through the link page method but can't work out how to point the custom css to that link after the fact etc. Any help would be appreciated as, hilariously, customer help aren't allowed to upload anything to your site for you, even if they can, because the platform is supposed to "empower users to make their own sites". ...and despite the fact that the platform was doing the exact opposite of that and that the customer help could help a customer, they wouldn't/couldn't. So, community? You've always been the best thing about this platform, help me (and countless others) out?

Thanks for your suggestion Tuanphan, big fan of everything you do for people on here! I've tried with GIFs but they're either very lossy or become so large they really slow the page down. I've actually figured out how to achieve this using vimeo iframes and it's given me a much better result without slowing the page right down now so I'll mark this comment as the solution.