mbaydesign

OMG yes! I would add this as a 3rd party app to my client sites in a heartbeat. I can't believe that no one has responded to this. This is one of the more common complaints about Squarespace. They did roll out the Duplicate site feature, but it's certainly not perfect and not automated by any means. A true backup of SS sites would be fantastic.

Oh, oops - I thought that was it but it's not. It's great on the landscape orientation image, but it cuts off the bottom of the portrait orientation: like this one https://grape-shallot-axh7.squarespace.com/paintings/p/medusa-in-the-shadow-of-athena Leaving off the .tweak-product, restores the full image. So, currently, I'm just using the two 0px padding-bottom which eliminates the bulk of that extra space. It's definitely better than before. 🙂

Yes, exactly. 🙂

Fantastic! I knew you'd come through, tuanphan! That worked great! Thank you! I wonder if you could take a crack at the other post I added to Coding & Customization? Thanks!

Site URL: https://grape-shallot-axh7.squarespace.com/ I'm on 7.1. fluid engine - password: GraciousPony I've used the following code to ensure that paintings are not cropped on the product detail page and that the image aligns to the top of the section: img.ProductItem-gallery-slides-item-image { object-fit: contain !important; } .tweak-product-basic-item-gallery-design-slideshow .ProductItem-gallery-slides-item {height:auto;} With portrait orientation images like this one https://grape-shallot-axh7.squarespace.com/paintings/p/medusa-in-the-shadow-of-athena the space below the content is fine - but on landscape orientation detail pages like this: https://grape-shallot-axh7.squarespace.com/paintings/p/the-yellow-haired-girl there is an excess of space. I can't locate the css to reduce that space so that it conforms better to the adjusted height of the image. I've tried height:auto; on .ProductItem-gallery, .ProductItem-gallery-slides and on .ProductItem .ProductItem-summary and none of those work. Any ideas for this? Thanks!

Sorry, this should have gone into Coding and Customization... Moderators, can my post be moved?

Site URL: https://grape-shallot-axh7.squarespace.com/prints This site has not yet been published - but password is GraciousPony. I'm on 7.1. After integration and sync, realized that on the grid, the default product type that displays on HOVER on many of the products just doesn't look good. Since it's unlikely the default can be changed - unless it can be changed to a specific product type - I'd rather have no hover at all. If the default product type for the hover can be adjusted that would be great, but otherwise, is there a javascript that can disable the hover on the https://grape-shallot-axh7.squarespace.com/prints page? Grateful for expertise! Debbie

Site URL: https://www.dirtroadseeker.com/ I'm helping a client with setting up products on a site (7.0). The products are services (https://www.dirtroadseeker.com/lets-ride-products/lost-coast) - adventure off-roading and the quantity refers to the number of spots available on the trip. I tried to use the following code (from a reddit forum) to replace quantity with something else and it worked great except that it prevented the add to cart from working. 🙂 I've since removed it, but the code I added was this: <script> var find = "Quantity"; var replaceWith = "# of People"; window.onload = function () { $("div:contains('" + find + "')").each(function () { $(this).html($(this).html().replace(find, replaceWith)); }); }; </script> Any help with this code would be greatly appreciated! Thanks! Debbie

Sorry, reframing the question. Because of the specific requirements of a client's gallery, I can't use the built-in galleries so I am simply using image blocks. And again, because of specific requirements, I have to adjust the size of some of the images to appear larger or smaller - even when their dimensions are close enough that they naturally align perfectly. I need to create a small visual difference in size, so I'm either sizing a spacer between two side by side images or sizing the image blocks horizontally. But this does not fine tune - the size jumps either too big or too small. I know that SP uses a column layout and that's what the spacer and images block is snapping to. Ideally what I want to do is to resize image blocks while constraining the image. I can resize the image block horizontally, but it jumps. Sizing vertically is the minute function I want, but it does not resize the image container horizontally at the same time so I lose the outer edges of the image and that is a no go. Is there any css code I can use to enable more minute adjustments to the image blocks OR spacers? Thank you!

Thank you both! I am sizing in the browser window and if you look at the page, you can see the text feeding UP. (https://www.anderlegallery.com/shop/lamps) - well, you could before I just fixed it. 🙂 I finally figured out the right css. No, I'm not using absolute positioning, or bottom: 0 - I finally see where you're seeing that though, but that's the native code. Somehow I missed that before because it was on the pseudo element. I didn't even realize there was a native :after other than my own. But it is the flex display that was causing the problem. So, I set relative positioning and a display: block on my css AND overrode the native flex css on the nested category title with display: block and that seemed to do the trick. 🙂 Thanks again for the assistance!

Thank you so much for that! I am having a little issue with formatting that I did not anticipate - as you can see from this page when the window gets smaller: https://www.anderlegallery.com/shop/lamps Because there's more than a line or two of text, this pretty well hoses the top of the page. The text is feeding UP instead of pushing the content down. I have removed any attributes that aren't directly related to styling the text. Maybe it's a consequence of the "content" css that I wasn't aware of. Maybe it's something to do with the flex display values? I've tried several combinations of adjustments to the css - of both my css and the css of the other elements. The best I can do is a side by side presentation of the category title and the copy by adding a position:relative to the :after. It's not ideal... there must be a way around whatever is happening. Do you have any ideas? Thank you so much for your help!

Excellent! Thank you very much! I will drop that in tomorrow.

Very cool - I will try that - thank you! Hmm - I am on 7.1 - but I'm not seeing any new class. Looking at the code above, it looks like it's supposed to add a class attribute to the body tag identical to the category name - i.e. petrified-wood - is that not correct? If not, what should I be seeing? My css works fine applying to the store collection id - (that's what's there now) - so if I just have a unique class to use... 🙂 Thanks!

OK - it's not live so, here's one category page. https://www.anderlegallery.com/shop/petrified-wood WGKAcW34ke I'd like to add descriptive text to the top of each category page and I can't think of another way to manage it except via some css, but can't do it without unique page/category identifiers. ¯\_(ツ)_/¯

Hi - I think I might have seen somewhere that this is not possible - but I need to ask... I have a single shop and am displaying categories as links in the main nav. I know how to target a specific page with global css or use code injection via the advanced section on each page, but because the category pages are only links, there is no advanced section AND they all have the same shop ID, so I can't target them specifically. (I'm trying to inject some formatted text below the h2 --- i.e. h2:after {content:"text";} My first method was to create each category as a unique shop, for many reasons, that was not a good method. Surely there is some way to target the category pages with unique code. Isn't there an ID# specific to the category? Thank you! Debbie