Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search


  • Content Count

  • Joined

  • Last visited

Everything posted by JonJonJon

  1. Nevermind.. figured it out. Simply Added ".ProductItem" on the front. Thanks very much
  2. @tuanphan Thanks. Works well on the product list page, but sadly not on the individual product pages (which is more important). Any ideas of if this would be possible?
  3. @tuanphan Thanks, I'm using Brine template. I haven't spotted a class that specifies categories or tags, but that would be fantastic if it's available. Here is a link to a particular product. I've hidden the price and Add to Cart buttons. All products within this category "Smartphone" will need to undergo the same treatment (about 40 products). https://shop.jonathan-gallagher.com/photo/001-mobile pw:jonjonjon Thank you
  4. Or ... anyone know how to modify the code so that it opens up a New Tab, rather than replaces the current address?
  5. I've been trying to do this with html, but have had similar results: - Opens up the image url - Only does a direct link if there's a filename error, and so is a failed download I'm tested this with images stored on both on/off squarespace in case it was a url vs extension thing. So.... how do we get direct links working on Squarespace?? right-clicking an image is not a modern customer experience, especially with all the touch devices out there
  6. @tuanphan Is there a way to apply this to certain products without using code for each collection? perhaps referencing a product tag or category? Unfortunately Code Injection for individual projects isn't a thing, and using code blocks on a products page doesn't seem to work either. My goal: Remove the Add to Cart, and price on Free items.
  7. Interesting plug-in. Does anyone know if you can customise the plug-in action to be something other than sending you an email, e.g: I'd like to use this as a way to give a free Download, whether that be directly through a button click, or delivered in an email automatically to a customer.
  8. thanks @christyprice that's good to know. I'll implement that. But I am also still looking for a way to remove or redirct the url of pages that are only being used for their aesthetic quality on an index page layout.
  9. yeah, this guy has the answer. works well for me: https://thompsonweb.design/squarespace-website-tips/added-to-cart-pop-up
  10. I like the aesthetic of banners on an index page on templates like Brine, but I don't wish them to actually exist as pages. I'd like to ask if it's possible to - Disable the slug, yet have it still visible in an index (so no visitors can accidentally access a barren page) - or redirect it A third more complicated option would be to somehow choose what is visible in the index and what is visible when on the actual page. Thanks
  11. Thanks very much, yes that did the trick 🙂 For others that stumble here, the solution for this specific text replacement case was quite simple: .sqs-lightbox-meta-trigger { visibility: hidden; } .sqs-lightbox-meta-trigger:after { content:'ⓘ'; visibility: visible; }
  12. Same kind of issue here. I found a solution, but unfortunately it seems to be effecting site wide instead of per individual product. It's a very old post, so I wont bother the original poster. It was designed to be specific, but I can't get it to work and don't understand javascript. Even after changing and using the IDs, I still get site wide results. Maybe if together we can tweak this, then it might be a solution some of us are after? Credit to @sshaw
  13. Found this line using Google Inspect <a class="sqs-lightbox-meta-trigger">•</a> As this isn't CSS, how do I change it? I'm aware of code injection, and how to change this into what I'm after, but I don't know how to put this into the code injection in a way that it's read correctly. The code I wish to change it to: <a class="sqs-lightbox-meta-trigger">&#9432</a> (I'm just changing the symbol that activates the meta pop up shown on the lightbox over gallery images)
  14. not sure, I replied to your email. I'm no expert on this though. But looks like you've got some pretty big padding and/or margins going on, and not a stacked column structure, which the code is intended to target.
  15. @LJSpace Came up with a solution that will keep your website quick, if you haven't gone for the plugin: .sqs-gallery-block-grid.sqs-gallery-thumbnails-per-row-5 .sqs-gallery-design-grid-slide:nth-child(n+4):nth-child(-n+5) { display:none; } .sqs-gallery-block-grid.sqs-gallery-thumbnails-per-row-5 .sqs-gallery-design-grid-slide { width: (100%/3) !important; } This will turn a 5 per row gallery into a 3 per row and hid the last two. Adjust the values according to your needs. The key is to reference the block row type that you've made
  16. @LJSpace That's a great plugin. Hopefully this thread gives others options depending on their needs.
  17. Ah, actually.. i fixed that.. just needed the old "!important" This is code for 5 rows on everything other than mobile, where it goes down to 3. Also so that it stretches across the site width. (This isn't gallery block specific) section#instagram .Index-page-content { padding-left: 0; padding-right: 0; max-width: 100%; } .sqs-gallery-thumbnails-per-row-3 {display:none;} .sqs-gallery-thumbnails-per-row-5 {display:block;} @media (max-width : 640px) { .sqs-gallery-thumbnails-per-row-3 { display:block;} .sqs-gallery-block-grid.sqs-gallery-t
  18. @LJSpace That's exactly my solution so far. However it still looks like there's a two per row maximum for mobile that I'm trying to override. As actually 3 per row I think might look nice for this particular application. Did you find that too, did you explore a solution? I haven't seen the site performance dip, perhaps because I'm using a social block?
  19. @tuanphan thanks, but wont that just limit the number per row? My problem is that I don't want 2 rows on mobile, or tiny images if they're all crammed into one. So being able to limit the amount of items that are pulled would be great. e.g let's say. 4 images on desktop, in 1 row. 2 images on mobile in 1 row. This is something that I'm working hard to find a solution to, to implement to various block layouts. Such as the social instagram block and the product block - both on my index page.
  20. .summary-thumbnail-image.loaded { object-fit: contain !important; object-position: top; width: 100% !important; height: 100% !important; position: static !important; padding-bottom: 0px !important; margin-bottom: 0px !important; } .sqs-block-summary-v2 .img-wrapper { position: relative; width: 100%; height: auto; padding-bottom: 0px !important; works nicely for a summary block product gallery if that's what you're after? Also for related products, thumbnails. unfortunately I am unable to find a clean way for it work on a product directory page.
  21. how do you find the block IDs? I can only see YUI ID 😞 edit: nevermind, figured it out. Also came across a great chrome extension that just shows you. Chrome Store: "Squarespace Collection/Block Identifier"
  22. Is there a way to also reduce the number of items on mobile? i.e go from 3 on desktop, to two on mobile?
  23. shop.jonathan-gallagher.com pw: jonjonjon Template: Brine I'm trying to create a combination of Site-Title, Tagline & Social Icon. Line 1: Site Title Line 2: Social Icon + TagLine All aligned top left. I'm new to CSS, and have only suspicions about how to go about this. I've managed to get the layout I'm after, but without being able to get the social Icon and Tagline to be on the same line. I suspect this is to do with the flex styling, but I'm not really sure. I've "ordered" the Line 2 elements to be the same "order", bu
  24. My basic solution. not an elegant solution, but it'll do. I'll have to see what it looks like on other monitors. @media screen and (min-width:1650px) { .ProductItem-gallery { width: 50%; } .ProductItem-details { width: 50%; } }
  25. In summary: Once image hits e.g 900px, ProductItem-Gallery width dynamically goes from 60% down to 50%, where 50px is once the site max width is reached (1800px) The alternative is making a breakpoint, it just looks pretty jarring on a desktop.
  • Create New...