Jump to content

dhob

Member
  • Posts

    21
  • Joined

  • Last visited

Reputation Activity

  1. Like
    dhob got a reaction from CaptainBarnacles in Where did the product item nav (prev/next) go?   
    An update to anyone following this... Fenix from Code +Tonic has developed a solution to the problem here. He's posted a video showing how it works here: https://youtu.be/Wa-oEJWAfuA
    The way this currently works is that the pagination links will give the full name of the previous and next items in a store page's product lineup, with the links appearing at the bottom of the particular product page. He took a stab at this problem after I posted about this on reddit.
    If you are interested, you can contact him about this via his website here: https://codeandtonic.com/contact
  2. Like
    dhob got a reaction from CaptainBarnacles in Where did the product item nav (prev/next) go?   
    Just a status update for anyone following this... @paul2009 was unable to craft a solution due to a bug in the Squarespace code, as noted on his site here: https://sf.digital/product-ux-extension. Squarespace, meanwhile, has told me that Pagination was a "bug" that was never intended to be in the 7.1 platform. This seems incredibly disingenuous, considering that this "bug" was clearly core functionality carried from the 7.0 commerce platform straight into 7.1 when they started it. To add to this, Squarespace is now claiming that the 7.1 platform is "beta" software, so they have no need to guarantee functionality of any kind. This is interesting, seeing as they're selling the 7.1 platform right alongside the 7.0 platform and have no warnings of it being a beta product. Attached here is their statement to me, dated November 22, 2021. 
    What's also odd about all this is that Pagination actually works on the 7.1 platform if you only use the Quick View option. So their code can clearly do Pagination. Why Pagination from Quick View can't just handle Products in their full view is beyond me.
    From Squarespace:

  3. Like
    dhob got a reaction from CaptainBarnacles in Where did the product item nav (prev/next) go?   
    I officially threw in the towel on Squarespace because of this issue and canceled my 7.1 site. One year's worth of work down the tubes. 
  4. Like
    dhob got a reaction from CaptainBarnacles in Where did the product item nav (prev/next) go?   
    Do cars exploding upon impact after driving off a cliff make a sound if no one at Squarespace is around to hear them? This metaphorical/philosophical conundrum stands at the heart of the problem here. Bear with me, if you will... 
    I've had an ongoing dialog with Squarespace support about this issue. They liken the removal of pagination to road construction - sometimes disruption happens in order to improve the system. That's all well and good, but road construction generally leaves behind a new road when completed. Squarespace's approach to road construction here is like tearing out a bridge, walking away, and patting themselves on the back for a job well done. Meanwhile cars are driving off a cliff into a dark abyss and exploding on impact.
    I had put months of work into building a new 7.1 site and spent a bundle on design work from a professional graphic designer. The removal of pagination instantly put me out of business. How? I'm a professional artist/photographer who sells work online. I'm dependent on viewers being able to move from one photograph to the next within a portfolio while having that portfolio integrated into a commerce engine. The removal of pagination instantly made each photograph a dead end road (to keep the road work analogy going). I suspect I'm not the only artist or craftsperson who wants to sell their work AND have viewers be able to move between items for sale. The 7.1 platform now offers the option of either selling your work OR showing work as part of a portfolio (via a Gallery or Portfolio) but not both. Pagination allowed both at once. This is a serious downgrade.
    In terms of when pagination might be added back to 7.1, I was given a timeline that can only be described as "maybe to never." How am I supposed to plan around that?
    If this doesn't bother you, consider this in the broader framework... Squarespace has shown that they can and will remove critical functionality without prior feedback or warning. In an instant, you can be functionally out of business without recourse. In this case, pagination had been part of the commerce system for literally years in the 7.0 system and was carried straight through to 7.1. There was no reason to expect this functionality to be removed. Squarespace sold me on moving from my old 7.0 site to building a new 7.1 site based in part on pagination as core functionality of the 7.1 commerce engine. 
    If the idea of being put functionally out of business overnight troubles you, please create a support incident with Squarespace and raise the issue. You can cut and paste what I've written here if it makes it easier. Only if enough people complain will they pay attention. I'm fighting this battle and losing. I just had to resurrect my old expired 7.0 site just to have this functionality again. I now have to start all over again. Please help Squarespace hear the cars exploding at the bottom of the canyon.
  5. Like
    dhob reacted to Naomi-lifelab in Full Bleed and Width Gallery on Carousel SS 7.0   
    I found a solution for this! I hope I can help more people
    #URL-SLUG .Index-page-content {
      padding-left: 0px;
      padding-right: 0px;
      padding-top: 10px;
      padding-bottom: 10px;
      max-width: 100%;
    }
     
  6. Like
    dhob reacted to tuanphan in How to hide price of "sold out" items   
    Hi,
    Use this new code
    .sold-out .product-price { display: none !important; }  
  7. Like
    dhob got a reaction from NEC in What do you wish you'd known before launching your online store?   
    I wish I'd known that Squarespace would put me out of business by removing core functionality from the 7.1 commerce platform without any warning. Like almost all artists, my work exists in the form of portfolios, with each piece living within a larger body of work. I relied on Pagination in the Product Detail pages of the 7.1 commerce engine for the "previous" and "next" links that allowed viewers to move between individual works in my portfolios. Squarespace removed Pagination on Product Detail pages from the 7.1 platform without any warning, despite that it had been a core part of the commerce engine carried straight through from the 7.0 platform. Every competing platform offers Pagination on Product Detail pages, including Squarespace 7.0 even. Without it, I was instantly put out of business, as each piece became a dead end road. After six months of trying every possible way to solve the problem, I finally had to shut down my 7.1 site. This is a huge blow to me personally, but it's hard to see how it benefits Squarespace when every artist, craftsperson, or businessperson wants to make it as easy as possible for buyers to see and navigate through all the products they have on offer. Even more troubling is the fact that Squarespace has now shown that they can and will remove core functionality that your business depends on at any time and without any warning. I paid Squarespace to help put me in business, and instead I got put out of business. I've been a huge fan and longtime user of Squarespace, but I wouldn't wish this experience on anyone.
  8. Like
    dhob got a reaction from kgkraeer in What do you wish you'd known before launching your online store?   
    I wish I'd known that Squarespace would put me out of business by removing core functionality from the 7.1 commerce platform without any warning. Like almost all artists, my work exists in the form of portfolios, with each piece living within a larger body of work. I relied on Pagination in the Product Detail pages of the 7.1 commerce engine for the "previous" and "next" links that allowed viewers to move between individual works in my portfolios. Squarespace removed Pagination on Product Detail pages from the 7.1 platform without any warning, despite that it had been a core part of the commerce engine carried straight through from the 7.0 platform. Every competing platform offers Pagination on Product Detail pages, including Squarespace 7.0 even. Without it, I was instantly put out of business, as each piece became a dead end road. After six months of trying every possible way to solve the problem, I finally had to shut down my 7.1 site. This is a huge blow to me personally, but it's hard to see how it benefits Squarespace when every artist, craftsperson, or businessperson wants to make it as easy as possible for buyers to see and navigate through all the products they have on offer. Even more troubling is the fact that Squarespace has now shown that they can and will remove core functionality that your business depends on at any time and without any warning. I paid Squarespace to help put me in business, and instead I got put out of business. I've been a huge fan and longtime user of Squarespace, but I wouldn't wish this experience on anyone.
  9. Like
    dhob got a reaction from OrangeKhan in What do you wish you'd known before launching your online store?   
    I wish I'd known that Squarespace would put me out of business by removing core functionality from the 7.1 commerce platform without any warning. Like almost all artists, my work exists in the form of portfolios, with each piece living within a larger body of work. I relied on Pagination in the Product Detail pages of the 7.1 commerce engine for the "previous" and "next" links that allowed viewers to move between individual works in my portfolios. Squarespace removed Pagination on Product Detail pages from the 7.1 platform without any warning, despite that it had been a core part of the commerce engine carried straight through from the 7.0 platform. Every competing platform offers Pagination on Product Detail pages, including Squarespace 7.0 even. Without it, I was instantly put out of business, as each piece became a dead end road. After six months of trying every possible way to solve the problem, I finally had to shut down my 7.1 site. This is a huge blow to me personally, but it's hard to see how it benefits Squarespace when every artist, craftsperson, or businessperson wants to make it as easy as possible for buyers to see and navigate through all the products they have on offer. Even more troubling is the fact that Squarespace has now shown that they can and will remove core functionality that your business depends on at any time and without any warning. I paid Squarespace to help put me in business, and instead I got put out of business. I've been a huge fan and longtime user of Squarespace, but I wouldn't wish this experience on anyone.
  10. Like
    dhob reacted to codeandtonic in Where did the product item nav (prev/next) go?   
    Found a way to solve this
    It's possible to find out what's the next/previous product using the Squarespace website JSON. On any page add ?format=json-pretty to the url to see the information. You can get that info with  javascript fetch and add the links to your template. More detailed info about this can be found my this blog post. It needs a bit of extra code because of the bug mentioned in the previous posts. 
    Plugin now available
    Just released the Squarespace 7.1 Pagination plugin. It'll do everything for you with a quick copy-paste. 
  11. Thanks
    dhob reacted to tuanphan in 7.1 Newsletter Block CSS Help - how to reduce size of email fill form and submit button   
    Add to Home > Design > Custom CSS
    .sqs-block-newsletter .newsletter-form-field-element { padding-top: 10px !important; padding-bottom: 10px !important; } button.newsletter-form-button.sqs-system-button { padding-top: 10px !important; padding-bottom: 10px !important; }  
  12. Like
    dhob reacted to tuanphan in [Share] Accordion Block: Useful code   
    Squarespace released an Accordion Block a few weeks ago.
    Here are some useful code when you use the accordion block (Add to Design > Custom CSS)
    #1. Change Dividers Color
    /* accordion divider color */ .accordion-divider { color: #ff00ff !important; } #2. Change Arrows Color
    /* accordion arrows color */ .accordion-block .arrow { border-color: #ffff00 !important; } #3. Add icons before Accordion Titles
    /* Accordion icons before titles */ li.accordion-item .accordion-item__title:before { content: ""; width: 20px; height: 20px; display: inline-block; background-repeat: no-repeat; background-size: contain; background-position: bottom center; } li.accordion-item:nth-child(1) .accordion-item__title:before { background-image: url(https://cdn.pixabay.com/photo/2021/11/02/15/30/tealights-6763542__340.jpg); } li.accordion-item:nth-child(2) .accordion-item__title:before { background-image: url(https://cdn.pixabay.com/photo/2019/10/23/06/30/hamburg-4570577__340.jpg); } li.accordion-item:nth-child(3) .accordion-item__title:before { background-image: url(https://cdn.pixabay.com/photo/2021/02/17/08/02/woman-6023442__340.jpg); } #4. Different Color for Accordion Titles
    /* accordion title colors */ li.accordion-item:nth-child(1) .accordion-item__title { color: red; } li.accordion-item:nth-child(2) .accordion-item__title { color: blue; } li.accordion-item:nth-child(3) .accordion-item__title { color: violet; } #5. Change a specific word color in Accordion Content
    First make it bold then use this CSS
    /* accordion content specific word color */ .accordion-item__description strong { font-weight: normal; color: red; } #6. Accordion Title Background Color
    /* accordion title background */ .sqs-block-accordion .accordion-item__title-wrapper { background-color: #32a4e6; } #7. Accordion Content Background
    /* accordion content background */ .sqs-block-accordion .accordion-item__dropdown--open { background-color: #262853; color: white; } #8. Add Unordered List in Accordion Content
    First, add some text then Underline them

    Next, use this CSS
    /* Accordion Content - Add Unordered list */ span[style*="text-decoration"]:before { content: ""; display: inline-block; width: 3px; height: 3px; background-color: black; vertical-align: middle; margin-right: 3px; } span[style*="text-decoration"] { text-decoration: none !important; } #9. Accordion Titles – Add Line Break
    If you use a Business Plan or higher, you can use another approach in this comment
    /* Accordion SubTitle */ li:nth-child(1) span.accordion-item__title:after { content: "Accordion Subtitle 01"; display: block; font-size: 15px; } li:nth-child(2) span.accordion-item__title:after { content: "Accordion Subtitle 02"; display: block; font-size: 15px; } li:nth-child(3) span.accordion-item__title:after { content: "Accordion Subtitle 03"; display: block; font-size: 15px; } Result

    #10. Accordion Title-Content Text Size on Mobile only
    /* accordion title - content text size on mobile */ @media screen and (max-width:767px) { /* accordion title */ span.accordion-item__title { font-size: 12px !important; } /* accordion content */ .accordion-item__description * { font-size: 10px !important; } } #11. Simple Style 01
    Add a Code Block under Accordion >> Use this code
    <style> /* accordion title color */ .accordion-item__title-wrapper { background-color: #1a252f; color: white; padding-left: 20px !important; padding-right: 20px !important; } .accordion-item__click-target { padding-top: 15px !important; padding-bottom: 15px !important; } /* make first item round corner */ li.accordion-item:first-child .accordion-item__title-wrapper { border-top-left-radius: 10px; border-top-right-radius: 10px; } /* make last item round corner */ li.accordion-item:last-child:not[data-is-open="true"] .accordion-item__title-wrapper { border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; } /* remove divider between accordion items */ .accordion-divider { display: none; } /* accordion content padding */ .accordion-item__description { max-width: unset !important; padding: 20px !important; } /* arrows color */ .plus>div { color: white !important; } </style>
    Coming soon.
    #12. Accordion Content Link Style
    /* Links underline */ div.accordion-item__description p a { border-bottom: 1px solid black; } /* Links font style */ div.accordion-item__description p a { color: red !important; font-size: 30px; font-family: monospace; letter-spacing: 2px; } #13. Add a button inside Accordion Content
    First, you need to add a text link. Next, add this CSS to turn link to button
    /* turn accordion link to button */ div.accordion-item__description p a { background-color: black; color: white !important; padding-left: 10px; padding-right: 10px; padding-top: 15px; padding-bottom: 15px; border-color: red; border-width: 1px; border-style: solid; } #14. Add an Image inside Accordion Content
    Use this CSS to add image to top or bottom of accordion content
    /* Add an image into Accordion Content */ /* replace demo image with your image url */ /* nth-child(1) is first accordion item, nth-child(2) is second item... */ /* :before is image on top, :after if image on bottom */ li:nth-child(1) .accordion-item__description:before { content: ""; display: block; width: 100%; /* image width, you can also use px */ height: 150px; /* image height */ background-image: url(https://cdn.pixabay.com/photo/2021/09/15/15/48/seals-6627197__340.jpg); background-repeat: no-repeat; background-size: cover; margin-bottom: 20px; /* space between image-text */ } #14.2. Add Image to Accordion Content (Use JS code)
    Suppose you want to add this image 
    https://cdn.pixabay.com/photo/2023/11/28/08/53/skyscraper-8416953_1280.jpg First, you edit Accordion >> Put your cursor at position where you want to add image >> Then enter text: image01

    Next, add this code to Website Tools (under Not Linked) > Code Injection > Footer
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('div.accordion-item__description p:contains("image 01")').closest('p').addClass('image-01'); $('<img src="https://cdn.pixabay.com/photo/2023/11/28/08/53/skyscraper-8416953_1280.jpg"/>').appendTo('.image-01'); }); </script> <style> .image-01 { font-size: 0; } </style> Result

    If adding 3 images, doing this



    and use this code
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ // image 01 $('div.accordion-item__description p:contains("image01")').closest('p').addClass('image-01'); $('<img src="https://cdn.pixabay.com/photo/2023/11/28/08/53/skyscraper-8416953_1280.jpg"/>').appendTo('.image-01'); // image 02 $('div.accordion-item__description p:contains("image02")').closest('p').addClass('image-02'); $('<img src="https://cdn.pixabay.com/photo/2023/11/07/10/06/girl-8371776_1280.png"/>').appendTo('.image-02'); // image 03 $('div.accordion-item__description p:contains("image03")').closest('p').addClass('image-03'); $('<img src="https://cdn.pixabay.com/photo/2023/10/02/14/51/flowers-8289320_1280.png"/>').appendTo('.image-03'); }); </script> <style> [class*="image-0"] { font-size: 0; } </style> #14.3. Add Image to Accordion Content
    You can also use this approach
    Enter Image Url 

    highlight the text url > Add same image url (enable Open in New Window)

    then use this code to Code Injection or Page Header Code Injection
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('div.accordion-item__description p a:contains(".jpg")').each(function() { var $t = $(this); $(this).contents().filter(function(){ return this.nodeType != 1; }).remove(); $t.attr({ src: $t.attr('href') }) .removeAttr('href target'); $(this).replaceWith(function(){ return this.outerHTML.replace("<a", "<img").replace("</a", "</img") }); }); }); </script> <style> div.accordion-item__description img { width: 100%; margin-top: 10px; } </style>  
    #15. Change Plus/Minus (+/-) to custom icon
    Replace demo image urls with your icon urls
    /* Plus */ :not([data-is-open="true"]) .plus { background-image: url(https://cdn.pixabay.com/photo/2021/02/06/09/03/man-5987447__340.jpg) !important; background-size: contain; background-repeat: no-repeat; } :not([data-is-open="true"]) .plus div { display: none; } /* Minus */ [data-is-open="true"] .plus { background-image: url(https://cdn.pixabay.com/photo/2021/12/12/22/17/red-squirrel-6867105__480.jpg) !important; background-size: contain; background-repeat: no-repeat; } [data-is-open="true"] .plus div { display: none; } #16. Change style of a word on Accordion Title
    See this comment

    Wrote by @tuanphan
  13. Thanks
    dhob reacted to tuanphan in Adding descriptions at the bottom of a shop page   
    Add to Design > Custom CSS (SS 7.1 will need a different code)
    /* space under shop page */ .ProductList-grid.clear { padding-bottom: 60px; }  
  14. Thanks
    dhob reacted to tuanphan in MOBILE: Change Hamburger menu to word "MENU"   
    Change to word "Menu"
    button.Mobile-bar-menu { visibility: hidden; } button.Mobile-bar-menu:after { visibility: visible; content: "Menu"; font-family: proxima-nova; color: #000; font-size: 20px; } Add word "Menu" beside icon
    button.Mobile-bar-menu:before { content: "Menu"; font-size: 20px; color: #000; position: absolute; right: 50px; top: 25px; } All code from here: https://beaverhero.com/moksha-squarespace/#Add_word_Menu_beside_Hamburger_Icon
    @jaimee1570048593
  15. Like
    dhob reacted to codeandtonic in Looking for a serious ecommerce sites (with mobile sales) for a UX improvement study   
    Hi folks!
    I'd love to have a chat with Squarespace ecommerce store owners that have lot of mobile traffic and sales.

    EDIT:
    Added a short video to explain this better 🙂
    What's this about?

    The thing I've been considering for a long time, is that as a UX Designer with 10+ years of experience, I find it very likely that the Squarespace built-in navigation menu is a very bad user experience for mobile users, will hurt sales, BUT could be massively improved with a few quick CSS edits. 
     
    Hidden navigation annoys users, creates bad user experience and will hurt your business

    There is a massive amount of studies done on web site navigation patterns. Others create a better user experience (and make more sales) and others create a confusing experience and lead to less sales. 
    For example, the leading UX Consulting company in the world Nielsen Norman Group has concluded that so-called Hamburger Menus and Hidden Navigation Hurt UX Metrics – in a nutshell using hidden (hamburger) navigation will hurt any company that uses them. Ouch!
    The Next web found that Side drawer navigation could be costing you half your user engagement. This test was done in an app, but the design is similar. Basically,  users used the app a lot less with the hamburger navigation. 
    If you noticed Spotify moving to bottom tabs after using the hamburger navigation, they also did a test competing between both designs and noticed a massive improvement when removing the hamburger navigation. 
    John Constine asked us to "Kill The Hamburger Button" with convincing arguments. I kinda agree with John. 
     
    The problems of hidden navigation
    - Out of sight, out of mind.  Users simply might not click your menu, and won't go to your important sub-pages, like "Shop" -page. So they're more likely to just leave your site.
    - User cannot use menu to see on which page they are. Usually the active page is underlined or different color. 
    - Needs more clicks, which is annoying. 
     
    Better hamburger icon = more sales
    Another thing. I believe the two lined icon used by Squarespace might also hurt your sales even if we'd keep the menu behind a button.
    There's been several tests that try out different icons, colors and combination. A better icon has been noticed to actually increase sales. Those studies could indicate that the light 2-lined hamburger Squarespace uses is likely to cost you sales.

    What are you after....?
    I would like to run a (free of charge) A/B test on few Squarespace commerce sites. A/B -testing means designin better navigation, showing that to 50% of your visitors, comparing results with the original and checking which one creates more interactions and sales. 
    My own ecommerce site has only desktop users so I cannot really test on my own site as they all get the good normal menu.
    This would be a 100% free of charge consulting, and is very likely to increase your sales. And we'd all learn something very important. 
    Why are you doing free work..?
    I'm obsessed with user experience design, and instead of debating with people I love to have actual objective data so no one can argue with me 😄 I'm now writing an in-depth blog post study on the subject. If the test proves to be a success (which I think is so likely that I'm willing to do some free work to investigate) I'll turn this into a product that will increase sales of any Squarespace ecommerce site using it.
    I'm In.
    Curious and interested in making more sales with almighty UX Design?
    Hit me up at beta[ät]codeandtonic.com
     
    (I hope this is allowed. I'm not selling anything and will share all results here for free, so I'd assume  it is.)
  16. Like
    dhob reacted to creedon in Adding descriptions at the bottom of a shop page   
    Add the following to Store Settings > Advanced > Page Header Code Injection for each Store page you want to add a description.
    <style>   /*        add store description at bottom of store product list pages          SS Version : 7.0     Template   : Brine          */          #store-description {            font-size : x-large;       text-align : center;              }          </style> <script>   $( ( ) => {        /*            begin add store description at bottom of store product list pages              SS Version : 7.0       Template   : Brine              */              /*                if the description has single quotes it then put a backslash before         the single quotes. example: it's becomes it\'s.                */                const description = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Integer enim neque volutpat ac tincidunt vitae. Proin libero nunc consequat interdum varius sit. Potenti nullam ac tortor vitae purus faucibus ornare. Fames ac turpis egestas maecenas pharetra convallis posuere morbi.';              // do not change anything below, there be the borg here              let $productList = $( '.ProductList' )              if ( ! $productList.length ) return;              $productList                .after ( '<div id="store-description">' +                    '<p>' +                        description +                          '</p>' +                        '</div>' );                  // end add store description at bottom of store product list pages            } );        </script> Let us know how it goes.
  17. Like
    dhob reacted to tgtstudios in How To Display Currency Type (USD) After Price and In Cart   
    So I found this code that works to display the currency (USD) in the product page, although once you make a change to the product (ie: size, colour) it disappears again. I need to be able to show the currency in my pricing, both on the product page and in checkout, otherwise its very confusing to customers (I'm a Canadian business selling in USD).
    Here is the code I'm using to display USD in product pages, which works until you select modifiers:
    ".sqs-money-native:before { content: none !important; } .sqs-money-native:after { content: ' USD' !important; }"
    This is the version for cart currency display, but I haven't had any luck with it at all:
    .sqs-fullpage-shopping-cart-content .cart-container .item-price .price:first-letter, .sqs-fullpage-shopping-cart-content .cart-container .subtotal .price:first-letter { color: #fff; } .sqs-fullpage-shopping-cart-content .cart-container .item-price .price:after, .sqs-fullpage-shopping-cart-content .cart-container .subtotal .price:after { content: ' USD' !important; }
    Can anyone help amend this to display for all product variants, but even more importantly "in cart"? It seems completely ridiculous that Squarespace doesn't display currency in cart, its causing me a ton of problems. Any help is greatly appreciated!
  18. Thanks
    dhob reacted to kirkroberts in How can I disable product image cropping?   
    For those working on a 7.0 template in the Brine family this Custom CSS might get you going:
    // product index .ProductList-image, // product quick view .ProductItem-gallery-slides-item-image { height: 100% !important; left: 0 !important; object-fit: contain; object-position: center center; top: 0 !important; width: 100% !important; } It should make the image take up as much space as possible within your chosen product index image size, without cropping the image at all.
    It also works on the Quick View, if you have that enabled.
    Note that you can adjust the "object-position" to dictate how the not-cropped image aligns in the "box" created by the Styles setting for product index page images.
  19. Like
    dhob reacted to paul2009 in How can I disable product image cropping?   
    @Marta's site is built with a Brine-family template in Squarespace 7.0. The Brine-family template uses the 'Advanced Products Page' which automatically crops product images to fill the image container. This behaviour is designed to improve the appearance of products pages and cannot be disabled - even with code.
    If you have product images with different aspect ratios, for example portrait and landscape artwork, there are two workarounds available:
    1. If you want to use the same template, you must "reframe" your images before uploading them so that they always match the selected crop shape you have selected in Site Styles. For example, below is some artwork with a portrait aspect ratio. The image file has been edited to add a white border, changing the aspect ratio to landscape to match the setting in Site Styles. (The yellow border is not part of the image file - I've added it to illustrate the shape of the white border on this white page!)

    2. Use one of the older templates that uses the 'Classic Products Page'. Bear in mind that these templates are much older (some as old as 2012) and do not include a number of advanced commerce features. The Classic Product Page is currently available with these older Squarespace 7.0 template families:
    Adirondack Avenue Aviator Bedford Five Flatiron Forte Ishimoto Momentum Montauk Native Pacific Wells Wexley On these older templates, you can go into the Style Editor and disable the Product Image Auto Crop tweak.
  20. Like
    dhob reacted to tuanphan in Changing Lightbox opacity to solid white.   
    Try this CSS
    .yui3-lightbox2 .sqs-lightbox-overlay { background-color: white !important; }  
  21. Like
    dhob reacted to tuanphan in change drop down menu font   
    @jayffinity Add to Home > Design > Custom CSS
    .variant-option * { font-family: "Open Sans", sans-serif !important; }
  22. Like
    dhob reacted to paul2009 in How to remove trailing decimal .00's from product pricing   
    The code was written in 2016 and like many of the older code samples provided on forums, it therefore understandably doesn’t take into account the introduction of Ajax on many Squarespace templates since that time. Turning off Ajax in Site Styles will fix this but it’s just a workaround. A better solution is to replace
    (function() { with
    window.Squarespace.onInitialize(Y, function() { If like me you’d like to understand why, I wrote an explanation here: https://sf.digital/squarespace-solutions/why-doesnt-my-code-work-until-i-refresh-the-page
  23. Like
    dhob reacted to creedon in How to remove trailing decimal .00's from product pricing   
    @misimo
    Please see Store Product Price Remove Decimal for Prices Greater Than or Equal to N.
    Let us know how it goes.
  24. Like
    dhob reacted to brandon in Can someone help me change coding to get rid of decimal places in my pricing?   
    Hi. The following Javascript, inserted via footer code injection should do the trick:
    <script> (function() { var prices = document.getElementsByClassName('sqs-money-native'); var thisPrice; var i, I; for (i=0, I=prices.length; i<I; i++) { thisPrice = prices[i]; thisPrice.innerHTML = thisPrice.innerHTML.replace(/(\.[0-9]*?)0+$/, "$1").replace(/\.$/, ""); //http://stackoverflow.com/questions/1015402/1015434#1015434 } })(); </script>
    I didn't test this throughout your site...just checked a couple pages. Do let me know if this works for you.
    -Brandon

    If this or any other answer helps you out, please give credit where credit is due: Accept the answer if you're the poster or Up-Vote the answer if you're not the poster. If it didn't help, feel free to inquire further or wait and see what others have to say. Code is provided without any warranty, expressed or implied.

  25. Like
    dhob got a reaction from hasher22 in What do you wish you'd known before launching your online store?   
    I wish I'd known that Squarespace would put me out of business by removing core functionality from the 7.1 commerce platform without any warning. Like almost all artists, my work exists in the form of portfolios, with each piece living within a larger body of work. I relied on Pagination in the Product Detail pages of the 7.1 commerce engine for the "previous" and "next" links that allowed viewers to move between individual works in my portfolios. Squarespace removed Pagination on Product Detail pages from the 7.1 platform without any warning, despite that it had been a core part of the commerce engine carried straight through from the 7.0 platform. Every competing platform offers Pagination on Product Detail pages, including Squarespace 7.0 even. Without it, I was instantly put out of business, as each piece became a dead end road. After six months of trying every possible way to solve the problem, I finally had to shut down my 7.1 site. This is a huge blow to me personally, but it's hard to see how it benefits Squarespace when every artist, craftsperson, or businessperson wants to make it as easy as possible for buyers to see and navigate through all the products they have on offer. Even more troubling is the fact that Squarespace has now shown that they can and will remove core functionality that your business depends on at any time and without any warning. I paid Squarespace to help put me in business, and instead I got put out of business. I've been a huge fan and longtime user of Squarespace, but I wouldn't wish this experience on anyone.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.