Leaderboard

Add to Home > Design > Custom CSS @media screen and (max-width:767px) { footer.sections nav.sqs-svg-icon--list a { width: 10px !important; } }

you can change 100% to 70%,.. and add margin: 0 auto; to center them.

Add to Home > Design > Custom CSS @media screen and (max-width:767px) { .ProductItem-details .ProductItem-details-excerpt { order: 3; margin-bottom: 5px; } }

Site URL: https://www.christcathedral.org/ I would like the promotional pop-up to come up every time someone visits the homepage, not just once per day. Is there a way to do this, I don't see that option?

@paul2009 got us going in the right direction! Cool trick for sure! @abry747 this is the CSS that should do what you want. Remove the other codes we were working on. a.icon--cart[aria-label^="0 items in cart"] .sqs-cart-quantity{ visibility: hidden; }

Let me know when you have the commerce plan and we can look into it for you.

<a href="https://www.spotlight.com/3572-0166-5248" target="_blank"><img src="https://staticassets.spotlight.com/Webmedia/WebsiteFiles/img/static/weblinks/ImInSpotlight_White.gif" alt="Click to view my Spotlight CV" title="Click to view my Spotlight CV"target="_blank">

Edit your css .sqs-gallery-meta-container .summary-read-more-link::before { content: 'Lesa meira/'; nondisplay: block; }

Have you solved it yet?

Hi there, I'm working with a Summary Block of a Gallery of team photos on a clients site. I want the Lightbox effect, but I don't want it to only show the content on hover. I'd like the image to justify left and text to sit right of the image. Does anyone know how to make this happen by injecting CSS? Thanks!

Add to Home > Design > custom CSS div#block-yui_3_17_2_1_1594762844557_6845 h4 { margin-bottom: 5px; }

Tested the code. Worked perfectly! ✌️

Here’s an article I wrote to explain how to hide the shopping cart icon when the cart is empty.

Sent a PM, sounds exciting !

We created a custom google map -> https://www.hoperisinghaiti.org/map But when you go to the home page and then click it does not load unless you refresh the page. So, go to https://www.hoperisinghaiti.org then click on the nav item, "MAP" and it takes you to the page where the top filter buttons load, but the map itself does not load. thoughts?

That can't be done without JavaScript, which requires a business account and different code.

@tuanphan i have the same issue! actual cookies banner is not in line with European Law. From now on, it has to be detailed overview of all the cookies used on the website, here attached is the screenshot of a third party cookies consent I have to use at the moment, since squarespace are offering none. i am not sure your can "fix" it with the code. when this will be escalated? this has to be fixed asap, otherwise I do not understand why squarespace is even available for European businesses?

I'm working within the 7.1 system, and here is a way to hide the product selection drop down menu (such as for "Select Size"), the quantity selection box, and the Add to Cart button on an individual product level basis. This way you can hide these elements on products within a given store page without having to use a blanket approach that affects more than specific products. We'll do this by creating a tag called "hideorder" and tagging any product with this tag name for which we want to hide all of these ordering options. So to start, take a single product and create a tag called "hideorder." To learn more about tags, see: https://support.squarespace.com/hc/en-us/articles/205814438) Next, add this code to your site's Custom CSS: /* ----------------- ultra-fresh "ORDER INTERFACE Be-Gone" ----------------- / /* add "hideorder" tag to any page to remove dropdown, quantity, and order button */ /* remove select size dropdown */ article .tag-hideorder .variant-option { display: none; } /* remove quantity dropdown */ article .tag-hideorder .product-quantity-input { display: none; } /* remove order button */ article .tag-hideorder .sqs-add-to-cart-button-wrapper { display: none; } That should do it. Seems to work nicely. Also, you can adjust the code by deleting lines if you want parts of the product ordering system to appear but not others (for whatever reason). Or of course you could create additional tag names with different attributes built off this code. I hope this makes sense. Good luck!

@BritterBeez Please check if this works for you: @media(max-width: 767px) { a.sqs-block-button-element { padding: 0.8em 0.3em !important; display: inline-block; } }

Add to Home > Design > Custom CSS .cart-title { visibility: hidden; } .cart-title:before { visibility: visible; content: "Shopping Cart"; text-transform: capitalize; font-family: monospace; }

OK, I nearly cried then because I thought it had worked. It does work on the latest article but not the previous ones. It actually takes the latest article out of the other summary blocks in the previous articles. Does that make sense? You are still bloody amazing though. I'm so grateful for your efforts.

I'm agreeing with everything said here. Did squarespace get an entire new staff change or something? This feels like a different product, and a bad one at that! What's with COMPLETELY changing the UI on a product that's been so good for years? The UI is really counter-intuitive, like someone else said up there, so much so I was frankly shocked and contemplated switching CMS! Please squarespace. What's going on?

I see you fixed problem? For future users, use this code (add to Page Settings > Advanced > Header) <style> #headerNav { display: none!important; } </style>

I've answered a number of questions on this subject. Each asks why a particular piece of code isn't working unless the page is refreshed or reloaded. Usually, the person is asking about code that they've found on this forum and that they've added to their site. They just can't understand why it doesn't work for them properly. It doesn't work the first time, but when they load the page a second time, it appears to work! I've posted this question to save others posting a series of related questions. So why is this happening? Ajax. If you're using one of the newer Squarespace templates, the chances are that it uses Ajax, a feature that allows parts of a page to be loaded, without loading the full page. For example, when a visitor wants to open a new page, it could be opened without reloading the header and footer. It can also power a feature called 'Infinite Scroll' where only the first few blog posts are loaded initially but as the visitor scrolls down the page, more blog posts download and appear. It will continue loading blog content until all of the posts have been displayed, hence appearing to be an infinitely long page. The downside is that when you have Ajax enabled, older JavaScript code that wasn't written to work with Ajax, won't work properly. That's the case with the majority of JavaScript answers on this site, especially pre-2018. So what can you do? The best solution is to source new Ajax-enabled code. If you are using code provided by a third-party company, ask them for an Ajax-enabled version to work with Squarespace. However, if you find code on this site, or on a similar site, that isn't Ajax compatible you have two choices. Hire a developer to write you some better code Use the code you've found and disable the Ajax features on your site. It's worth noting that disabling Ajax is not a solution. It's just a workaround. It will allow you to run old code that hasn't been written to work with Ajax-enabled sites but if you disable it, you will lose many more features that improve the performance of Squarespace sites. If your template uses Ajax loading (all the Brine-family templates do) and you want to disable Ajax you can do so in the Style Editor. To disable Ajax: Open a Blog Page then, in the Home Menu, click Design, and then click Style Editor. Scroll down to Site: Loading. Uncheck Enable Ajax Loading. This workaround will fix the issue, but it will disable Infinite Scroll and all Ajax features. I hope that helps. -Paul Squarespace Expert & Experienced Developer

This can also do the trick — Add this to the Advanced Tab within the specific page's settings: <style> #logoImage{ display: none } </style>