Terratag

Sorry for late reply @JayVanDyke, I can't see a way to mark your post as the solution sorry. That doesn't appear to be an option. If I'm missing something obvious feel free to point it out and I'll be happy to not that as the solution. Many thanks.

Thank you @creedon once again you've been a wonderful help which is hugely appreciated.

Thanks again @creedon, that has almost got this working perfectly. The product name is appearing under the calculator code block, however I'd like it at the top. Earlier in the CSS I have code to show the ProductItem-details-excerpt in the order 1 position, which doesn't appear to be setting the product name at the top. Any idea how to fix that?

Thank you @creedon, I replaced the footer code to include everything, including the <script> at the start, and removed what I thought was the CSS to hide the calculator code block, however I still don't have it right. I've tried a few edits, but they haven't worked. Sorry, this is probably simple, however I just don't know specifically what I should be changing. Would you mind please taking another quick look and listing what code I should add or remove from where. Perhaps message me if it's licenced and should not be posted here. Thank you for your patience.

Hi again, I've had a go at adding the code you kindly provided the link to. I don't know if I'm reading the instructions wrong, however I'm obviously doing something wrong as the code hasn't had any effect on this page. I've not added anything to the footer. If you could let me know where I've gone wrong please that would be awesome.

Hi @creedon thank you for your reply. That solution looks like it's saying to add 3 different codes - one to custom CSS, one to code injection header and one to code injection footer. It looks like it's saying to remove the calculator from my product page, and add it to a section at the bottom of the footer, and hide that section. That looks like it's more related to showing something on multiple pages, which isn't what I'm wanting to do. I just want to move the code block (quote calculator) from the additional information to the description for that page. That calculator will not show on any other pages. I'm wondering if there's a simpler solution. Perhaps by modifying something like the below so that it targets and moves just the first additional information block to the description section, and just applying to that one page? <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper'); }); </script> Many thanks

Hi Brains trust, I've been searching the forum and trying different things, however I've not been able to crack this problem. I would like to move one of the two blocks in the additional information section to the description section, and only for one specific product page in my shop. The second block (text or accordion - I'm testing these) in the additional information section can stay where it is. The block I'd like to move is a code block in which I've inserted a quote calculator. I've already hidden all the items in the description section, except for the title/name which is fine to stay. The result I'm after is just the title/header and under that the quote calculator in the description section. The URL is https://www.terratag.com.au/shop/p/test-terra-tag (hidden from the shop page but product page is visible with that link). The page item is #item-6662a29e5791c906af965e6a. I can move all additional information blocks to the description for all pages, however I can't work out how to target and move just one block on one page. Any help would be greatly appreciated. Many thanks

@JayVanDyke you're an absolute legend!! Thank you, your code worked perfectly. Funnily enough when I corrected the typo the add to card button moved to the first position. Not sure how that happened. Removing the code I had and adding yours fixed it. Thank you, much appreciated. 😁

Hi, I've tried all the different CSS codes I can find in this and other threads however I'm unable to get the product price to move from above the product excerpt down to just above the Add to cart button. The price used to be just above the add to cart button, however it appears there's been a change which has affected that. I'm hoping someone can take a look at this product page (https://www.terratag.com.au/shop/p/seed-paper-name-badges) and guide me in the right direction. Some CSS moves the price down to the bottom, but also moves the add to cart button to the top. I can't seem to keep the add to cart button where it is and just move the price to immediately above the add to cart button. I have tried @creedon's CSS, but I don't know where to insert the variables, and I get a syntax error on the first line it's added to. The code in the attached image also isn't doing anything. Apologies for my ignorance. Any help is greatly appreciated. I've tried adding the code to the shop > settings > advanced > page header code injection page, and also to the website tools > custom css page. Help with the correct place to add the css would also be appreciated. Many thanks

Hello Squarespace friends, I changed the URLs to my product pages to better reflect the content. Wanting to comply with best practices, I implemented 301 redirects in the Settings < Developer Tools < URL Mapping function, however, I'm doing something wrong and the redirects are not working. I wonder if someone might review the below and help me to understand where I'm going wrong. I've tried two URL mapping formats as follows: Attempt 1: /shop/p/sustainable-name-badges-and-lanyards -> /shop/seed-paper-terra-tags 301 /shop/p/recycled-name-badges-and-lanyards -> /shop/recycled-terra-tags 301 /shop/p/diy-sustainable-name-badges-and-lanyards -> /shop/diy-terra-tag-kit 301 /shop/p/recycled-paper-event-wristbands -> /shop/recycled-wristbands 301 /shop/p/eco-friendly-seed-paper-wristbands -> /shop/seed-paper-wristbands 301 Attempt 2: /sustainable-name-badges-and-lanyards -> /seed-paper-terra-tags 301 /recycled-name-badges-and-lanyards -> /recycled-terra-tags 301 /diy-sustainable-name-badges-and-lanyards -> /diy-terra-tag-kit 301 /recycled-paper-event-wristbands -> /recycled-wristbands 301 /eco-friendly-seed-paper-wristbands -> /seed-paper-wristbands 301 Thanks for your guidance in advance - I really appreciate it. Thanks! Rhonda

Thank you so much for your help @creedon I was able to fix the remaining rounded corners with the below custom CSS I found on a different thread. I've removed the section ID number from between the quotes: section[data-section-id=""] .sqs-video-wrapper .sqs-video-overlay { border-radius: 12px; } section[data-section-id=""] .sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor img { border-radius: 12px; } Have a great day. 🙂

Thanks @Lesum that worked for me. 😁

Thank you paul2009, you're a genius! 😁 The custom CSS did the trick.

The total price wasn't showing for me. I found the issue, it was custom CSS I'd added, which was hiding the price. JenniferK, check your custom CSS. 🙂

Hi @paul2009, I've just come across this post from a while ago and your code has been super helpful thank you. I'm also wondering if it's possible to hide the 'select variant option' that's included in the drop down when selected. Here's an example, it's the blue line I'd like to hide if possible. The 'select seed type in the drop down list seems unnecessary as it's in the field already: Many thanks. 🙂

I found this thread from a few years ago and it's been very helpful. I've added @creedon's code (see below): // This adds a radius to most of the images .products .grid-image-wrapper, .image-block-wrapper, .ProductItem-gallery-slides-item.selected, .sqs-gallery-design-grid-slide .image-slide-anchor .image-overlay { border-radius: 12px; } // This adds a radius to the images when under a colored field img { border-radius: 12px; } // This adds a radius to the BLOB/article images a { border-radius: 12px } Thank you for that @creedon, that code has done a great job and rounded the corners perfectly everywhere except for on our page we've added our Instagram feed images to. On that page some images have rounded corners and some don't. The images without rounded corners are video posts, however there are also some video posts with rounded corners, so I'm a bit stumped. Here's a screenshot from this page - https://www.terratag.com.au/visuals: If anyone has any suggestions to get the square corners rounded that'd be much appreciated. I did try the site wide image borders however that left even more images without rounded corners. Thanks all. 🙂

Try this, it's just moved the price down one extra in the order, which should move it under the option boxes: .ProductItem-details .ProductItem-details-checkout { display: flex; } .ProductItem-details-excerpt { order: 1 !important; } .ProductItem-product-price { order: 3 !important; }

Excellent question JenniferK. I'm trying to do the same thing. Did you find an answer?