scholarsayze

Hi Tuanphan, I actually set my main Headers to Libre Baskerville which is pretty much a good match and decided against actually showing this section on mobile. Many thanks, sorted for now!!

I tried several options, the one that worked for me was as here: Squarespace v7.1 (no specific theme) Settings/Advanced/Code Injection/Footer <script> document.querySelector('.header-title-logo a').setAttribute('href', '/store'); </script> Replace '/store' with whatever your destination page is e.g. '/shop' or '/home' Thanks Tuanphan!!!

Thanks very much I'll take a look into this if not, I guess I could play around with other alternatives. Thank you!

Thanks Creedon, I appreciate your support here, many thanks! 💯 I don't really know much about web fonts but just looking through this - https://stackoverflow.com/questions/3245141/using-otf-fonts-on-web-browsers - the code seems to have a source url, do I need to download Adobe Caslon Pro, and upload it somewhere to get a url? Sorry for my lack of understanding here. I'm not really confident do this kind of stuff!

Hey Creedon, many thanks for checking! I appreciate that. I have the Huawei Mate 20 Pro Andriod. Just not sure why it's not showing the Adobe Caslon Pro font?!

Updated page link - https://bluebird-porcupine-yzdg.squarespace.com/home Pword - bluebird Thank you!

Updated page link - https://bluebird-porcupine-yzdg.squarespace.com/home Pword - bluebird Please help!

Site URL: https://bluebird-porcupine-yzdg.squarespace.com/home-adxpt How can I make my page buttons transparent with just a 2px outline in white, and slightly wider? But only for this page, not on my product pages. Page = https://bluebird-porcupine-yzdg.squarespace.com/home-adxpt Pword = bluebird Thank you!

I haven't solved this yet, please help me!

Sorry I set the page as my home page now just trying hard to finish off everything! Here's the correct page = https://bluebird-porcupine-yzdg.squarespace.com/home Pword = bluebird As attached, the font doesn't seem to be showing as Adobe Caslon Pro on my mobile. It shows correctly on the Squarespace mobile preview. But not on actual mobile.

Sorry I just notice on my mobile device, the paragraph changes does not show on my mobile? Is there a fix for this please, so at least this para displays as 'adobe-caslon-pro'? Thank you.

Hey Webefo, thank you SO much - awesome fix!!! I really appreciate it 💯, been trying to figure it out all am!!!

Site URL: https://bluebird-porcupine-yzdg.squarespace.com/home-copy-1-1-1-1-1 Hello, I am trying to change the font family of just one text block on my site to 'adobe-caslon-pro' but I can't figure it out? I am also trying to change its font size to 1.9rem, and the color to #00ff3d It is the section where the para reads "Introducing our latest SCHOLAR & SAYZÉ ™ additions READ MORE". Please help! Page = https://bluebird-porcupine-yzdg.squarespace.com/home-copy-1-1-1-1-1 Pword = bluebird Many thanks, Best, Faiz

OK thanks Tuanphan I get it now! 💗

Thanks very much Paul, apologies for the misunderstanding I'm new to this. Is there anyway to physically see this switch on my desktop screen? I can see this works now on my mobile but if I resize my desktop browser say to 640px, why can't I see the change in my browser (see attached images)? Many thanks, Best, Faiz

Hello, I am trying to use the above code to use two different pages, one for desktop and the other for mobile. On mobile, there will be some different promotional content for my customers. here is my current desktop page (WIP) - https://bluebird-porcupine-yzdg.squarespace.com/collection_final here is the mobile version (WIP) - https://bluebird-porcupine-yzdg.squarespace.com/mobile Pword = bluebird I have added the above code to my Desktop page via 'COLLECTION_FINAL (Copy)' / gear icon / Advanced: <script> if (document.documentElement.clientWidth <760) { window.location = "/https://www.scholarsayze.com/mobile"; } </script> But when I resize my browser, nothing happens? Please can you double check I have implemented the code correctly? Many thanks, Best, Faiz

NIIIIIIICE!!! PERFECT code thank you very very much that's awesome!!! Much love 💯

Many thanks Tuaphan, that fixed it! However, I notice that the code also affects my elements in my Product page design. With this code, my 'Overview, Details, Care' sub menus disappear. See attached images, with / without the code. It also pushes the Product 'Studio Overhead Jacket' Title up and under my images on mobile. Is there another solution? Sorry for the hassle. Best, Faiz

Thank you so much, I tried this and it has improved but it seems there is still a small space between the two as attached. Is there anyway to completely remove that space? Many thanks!

Site URL: https://bluebird-porcupine-yzdg.squarespace.com/store/p/studio-overhead-jacket Hello, is it possible to remove the space/gap between the last product and footer on my all my Product pages? Please see attached image. Page = https://bluebird-porcupine-yzdg.squarespace.com/store/p/studio-overhead-jacket Pword = bluebird Many thanks, Best, Faiz

Yes I couldn't get it to work but I had to make a slight adjustment here's the code to hide on mobile from 768px to 991px: /* HIDES HEADER SECTION 1 FROM MOBILE BUT LEAVES IN EDIT MODE*/ @media only screen and (max-width: 991px) { body:not(.sqs-edit-mode) section[data-section-id="5fe9eb34ba5cdf3765c10016"] { display: none !important; visibility: hidden !important; opacity: 0 !important; } body.sqs-edit-mode section[data-section-id="5fe9eb34ba5cdf3765c10016"] {opacity: 0.5 !important;} } /*HIDES HEADER SECTION 2 FROM DESKTOP BUT LEAVES IN EDIT MODE*/ @media only screen and (min-width: 768px) { body:not(.sqs-edit-mode) section[data-section-id="5fe9e4d44d160f63a675dc59"] { display: none !important; visibility: hidden !important; opacity: 0 !important; } body.sqs-edit-mode section[data-section-id="5fe9e4d44d160f63a675dc59"] {opacity: 0.5 !important;} } I believe this works perfectly well now thank you all.

Thank you for confirming, I tried the code for my first section (under my homepage header) and it didn't seem to work - am I missing something out? /* Hide the section on mobile */ @media only screen and (max-width: 768px) { body:not(.sqs-edit-mode) section[data-section-id="5f8fea6196d2c93c2a238f81"] { display: none !important; visibility: hidden !important; opacity: 0 !important; } } Many thanks.

Thank you so much! So do I add the full ID code copied like this: section[data-section-id="5fe32430ede60b2fac33f917"] So the code should be like this to hide on mobile? /* Hide the section on mobile */ @media only screen and (max-width: 768px) { body:not(.sqs-edit-mode) section[data-section-id="5fe32430ede60b2fac33f917"] { display: none !important; visibility: hidden !important; opacity: 0 !important; } }

Hello, is it possible to have a similar code to hide a section either: on desktop on mobile/tablet But still available for edit mode. Two separate codes would be great. I find that one design works better on Desktop than Mobile/Tablet and vice-versa. Many thanks. Best, Faiz

Oh My!!! That's AWESOME! That's exactly what I need thank you SO much!! Thank you Bangank36 💯