KEYdance

You can customize the background image of the mobile menu via CSS.

Okay, I understand, but I still haven't seen it yet on any Squarespace mobile menu. I am guessing, that there is limitation by Squarespace to do this via CSS. Recently it came to my mind instead to upload a blurred edited image as mobile menu background. So, it is not generate via CSS, but might have a similar effect – just an idea.

@robfeltrin Thank you for your support. Unfortunately your code it is not working on my website – and it seems not to work on yours as well. Instead of a blurring background my (and yours) complete mobile menu (including all text) is blurred – that's not a solution – what a pity.

You are right – I coud not figure it out. The "blur"-code seems not to work on Mobile Menu.

I had the same problem and found this simple solution: I added a "#" in the Post-Submit Form Block Redirect URL – combined with an additional message after Post-Submit – voilà, after submitting the page scrolls to top (nicely with smooth scrolling). 🙂

@EWPThank you for your code – unfortunately it is not working.

Hey @KCSkye, sure – you might like it. I've found this cool instruction, which is (in my opinion) a very elegant way to insert tooltips via URL – it works perfectly on my website. What do you think? 🙂 https://youtu.be/ZDnxhTiagIA

@tuanphan: May you help me with your code, please? 🙂

Okay – I added temporarily an email to my website to try your code – thanks.

I tried, but it doesn't work. The email icon envelope link asks for an email-address or social-link-URL. If I fill in your URL, I get a link symbol (see below), which I do not want. If I fill in my email-address, I get the envelope symbol I want (see below), but it is impossible to make it scrollable to my contact form – instead it opens my mail app (but I don't want to use my email-address). Hm … still my question: How to make this envelope icon (in headers) scrollable to a contact form (like in the video)? Thank you for helping!

Sure – I would love to try … and how do I get scrolled to the bottom of the page (contact form) with this "dead" envelope link? Did you watch the video? It's on Squarespace version 7.0. Is this feature gone in version 7.1, that the email envelope icon can send me directly to a contact form?

Thanks for your workaround. I still want to use the default email envelope icon in the header – without opening any mail app or making my email public – so it should scroll down to the contact form. I've found this video, which shows this idea: https://youtu.be/W5r2PeInS7M

You are right – there is no email icon in the header, because I couldn't figure out, how to make it scrollable to the contact form block at the bottom of the same page. I tried to change a text-link in the header (which scrolls downwards) into a simple envelope-emoji (✉️), which looks not very professional. I tried also to customize a specific text-link in the header via CSS (with a custom icon), but it looked not right as well. I would love to use the default header email envelope icon of Squarespace itself.

Site URL: https://www.tastenweise.de Hi, is there a way to press the email icon (envelope icon) in the header to send/scroll visitors down to a contact block form? I do not want to open the mail app by pressing the email icon – instead I want a visitor to got scrolled down to my contact block form. Any idea (CSS)? Thanks for helping.

What a unique compliment – thanks a lot. ☺️

Thank you for trying to help (my website-link leads to this bulleted list). Meanwhile I found a solution by using ":not(:active)"-code – now my animations start on mouse click und don't cut off.

Site URL: https://www.tastenweise.de Hi, I am looking for a solution: I have a bulleted list on my website and added an animation each time somebody clicks on it. Unfortunately the animation isn't finished by the end of a normal short click – it cuts off. What can I do to make the animation go through completely by one single short click – without stopping (because nobody will hold the click button patiently for a few seconds to watch the animation finishing)? Thank you for helping me.

Browse for "Tippy.js" – maybe you like it.

Are you still searching for a tooltip solution? Recently I found some instructions to add simple tooltips to my website easily.

You might try some 'hover'-codes to reveal secret content or (my favourite) use tooltips with any kind of link (e. g. with text, images, single words, etc.).

First the code didn't work permanently, so I added "!important". Now it works very nicely – and it's easy to read. Thank you so much!!

Site URL: https://www.tastenweise.de/zeitfenster Hello, I edited via CSS "line"-options in a form block. Unfortunately the white text inside of yellow frames is hard to read. Is there a way to change the white text (of yellow framed headings) only – without changing the white color of other text? Black or red text in a yellow frame might be a better solution for legibility. Thank you.

Wonderful, this works perfectly – thank you very much! 🙂

There are three spots (see screenshots), where I use vertical text – and want to get them centered.

Site URL: https://www.tastenweise.de Hello everybody, is there a solution (CSS) to center a vertical text block to stay (responsive) in the middle of a section? Thanks.