awd113

Update I've managed to get to to be mostly full screen — but do now have a small white space on the left hand side I'd really like to get rid of. Same URL: https://www.sdaservices.com.au/eligibility-tool New CSS: (removed above) .fe-63cf25643bca9c323109fe00 { --sqs-site-gutter: -80px;} iframe {width: 100vw; height: 100vh;} Any advice would be greatly appreciated. Thanks 🙂

Hello, I'm trying to get an iframe to fill a full section on a page for a client website. At the moment it seems to be full width, but at a small height. I've added the below to the CSS (which made it full width), but can't seem to get the height to change. The iframe has a built in responsiveness so it changes to mobile version on small screens, so I'd like it to fill the section on both desktop and mobile. Happy for it to have some white space around if needed (as is at the moment). Page: https://www.sdaservices.com.au/eligibility-tool CSS used currently: #block-yui_3_17_2_1_1674441724084_27722 .sqs-block-content { height: 100% !important; } #block-yui_3_17_2_1_1674441724084_27722 iframe { top: 0; left: 0; height: 100% !important; width: 100% !important; } Thanks in advance 🙂 A

Hi @tuanphan, yes any advice on how to resolve this would be greatly appreciated. thanks! :)

Hi @bangank36 Thanks for your reply. I'm unfortunately unable to get this working. I've followed your steps but it doesn't appear to be working. You can see the site here (pw: 345) About page > 'Meet Our Team' section at the bottom, 3rd row down, second from the left (Deb) — I have put the 'Read More' half-way through this. Any advice you could offer would be greatly appreciated. Thanks! Andy

Hi all, Wondering if it's at all possible to add an expandable / read more button to paragraphs in Squarespace's pre-made content block/card sections (sorry not sure what these are called). I've added a screenshot below to show what I'm referring to. I'd ideally like to be able to add a read more button at the end of longer paragraphs to keep all text length consistent. As per the ones on the left — I've just done this as a text example to show what I mean. The ones on the right is how it would look without this. Open to any other ways this could be done also / any other blocks that could do this better. I know I could possibly just re-create these sections as normal text blocks and then put an accordion or something similar, but I'm just trying to keep it as simple as possible for the client to edit. Note, I haven't made the site as of yet, just planning out and used a random default template for the example below. Any advice would be greatly appreciated 🙂 Thanks! A

Hi all, An update on this. I’ve contacted Squarespace support and they’ve indicated it’s a problem with custom code, but say it may take several days to resolve. As far as I can tell all custom code to do with the cart has been removed so I’m not 100% sure what’s causing it, but I understand it’s quite complex so it’s likely I’m missing something. If anyone has any ideas in the meantime about what in the custom code could be causing this it would be very much appreciated as the site is now live and although customers can still purchase, it’s not the best experience when quantities change. Thanks again! Note - it seems this page has merged two of my threads / questions into one (one relating to scrolling which is resolved, and one relating to the cart, which is not resolved.

This issue is super confusing. I finished up yesterday removing any CSS / JS relating to the cart. Stock Squarespace standard. Loaded it again this morning and it's still having issues. The primary issues are: When adding a product, then removing it, then adding any other product adds 2 quantity. Adding any second product while there's another product in the cart adds 2 quantity. So it's completely fine if you clear cache, then go and add a single product, no problems, as soon as you do anything else to do with the cart though, it does the x2 problem. Any advice would be greatly appreciated. Thank you! :)

@paul2009 Oh sorry, I tried putting back one of the JS plugins just to see which one was the problem. My errors come back with both of them, so they're now both removed once again. Now that they're gone I'm not getting any of those red (x) errors anymore after clearing cache. Can you see any errors on your end now? If not then it's just the width of the 'Cart (0)' I need help with if you have any ideas. Thanks again for your advice, it's very appreciated.

Hi @tuanphan Oh yes sorry I removed to try something else. I've put it back in now. Just a note. This is only happening on Safari (iPhone). Chrome (iPhone) and Safari (Desktop) work fine. Thanks!

So i've gone back in and deleted all the JS relating to code as well. Now looking, it doesn't seem to have any errors. Phew! I went to put back in some of the CSS styling, just to make it look a bit nicer (keeping the JS out), and one line seems to break it. The one below. Any thoughts why this is happening / an alternative I could use? I'm using this CSS line to change the cart to a single line rather than going over 2: From: Cart (0) To: Cart (0) .icon-cart-quantity {min-width: 10em;}

Hi Paul, thanks for your comment. I'm not exactly sure what you mean by this sorry. Is this referring to the plugins I have installed or the CSS? And are you suggesting this could be causing the problem with the cart? Thanks again.

Hi all, I'm having some issues with the quantities that get added to cart / show when user visits the site for the first time. Sometimes it shows '1' but the card is empty, sometimes it adds 2-3, but the user has only added one. Just all kinds of strange things. This issue happens on both mobile and desktop, but much more common on mobile. (note, i've tried clearing cache, different browsers, private mode etc. — all the same problem.) BUT, when I remove all the custom CSS that relates to the cart, it works fine. So clearly this is something i've done incorrectly. I've included the CSS below, can anyone provide any insight into why this particular CSS breaks this? As far as I can tell it's all font styling and adding some '(' ')', but maybe i'm just misunderstaning how all this works. Worse case scenario, I can go back to the standard cart icon, but would love to use our custom look if possible. Thanks in advance! Site Here (pw:aUdio5) (note, the cart is hidden on desktop until something is added to it) /*cart-desktop*/ svg.icon.icon--cart { visibility: hidden;} @media screen and (max-width:767px){ .icon-cart-quantity:before { content: "Cart"; font-family: youth-reg; font-size: 1.2rem; color: #AA7850; font-feature-settings: 'ss02' on; } .header-actions-action--cart {position: fixed; top:4vh; left: 13vw;} .icon-cart-quantity {min-width: 10em;} .sqs-cart-quantity { font-family: youth-reg; font-size: 1.3rem; color: #AA7850; font-feature-settings: 'ss02' on;} .sqs-cart-quantity:after { content: ')'; font-family: youth-reg; font-size: 1.3rem; color: #AA7850; font-feature-settings: 'ss02' on; } .sqs-cart-quantity:before { content: '('; font-family: youth-reg; font-size: 1.3rem; color: #AA7850; font-feature-settings: 'ss02' on; } } /*cart-mobile*/ @media screen and (min-width:767px){ .icon-cart-quantity:before { content: "Cart"; font-family: youth-reg; font-size: 1.0rem; color: #AA7850; font-feature-settings: 'ss02' on; } .header-actions-action--cart {position: fixed; top:2.2vw; right: 5vw;} .icon-cart-quantity {min-width: 10em;} .sqs-cart-quantity { font-family: youth-reg; font-size: 1.0rem; color: #AA7850; font-feature-settings: 'ss02' on;} .sqs-cart-quantity:after { content: ')'; font-family: youth-reg; font-size: 1.0rem; color: #AA7850; font-feature-settings: 'ss02' on; } .sqs-cart-quantity:before { content: '('; font-family: youth-reg; font-size: 1.0rem; color: #AA7850; font-feature-settings: 'ss02' on; } }

Hi there, I've recently added some code to a website I'm working on to disable scroll on the homepage to allow for a single 100vh page only. This works perfectly on desktop, but on mobile, it is a bit glitchy. It works for the first swipe down, but then if you try again it sort of stutters down and allows you to go past. I've achieved this by adding the following to the header injection of this page only. <style>html, body {margin: 0; height: 100vh !important; overflow: hidden}</style> If anyone has any idea why this doesn't seem to be working on mobile, please let me know 🙂 Happy to try other solutions if this method isn't best practice. Thank you! Website Link (pw - aUdio5)

Perfect, that works great, thanks so much! 😀

@tuanphan Amazing, thank you so much!!! Really appreciate it. Any chance you'd know why (on the previously broken pages) it sits strangely? Almost like the height is pushing too far or something. Screenshot Left: Previously broken page Right: Correct page