Faustas Posted April 29, 2022 Share Posted April 29, 2022 (edited) Site URL: https://www.mozerisfineantiques.com/jewellery/p/bvkbk1lv2a3pgpqwbgutfgchgvm03y This is my product page. https://www.mozerisfineantiques.com/jewellery/p/bvkbk1lv2a3pgpqwbgutfgchgvm03y I would like to move the information below such as "Enquire" and "live Chat", as well as the information of accordion into the blank space. The blank space is where product "description" would be. The buttons and accordion are entered into "Additional information" when listing. How can it be moved? Thank you. Best Regards Edited May 4, 2022 by Faustas Link to comment
Faustas Posted May 4, 2022 Author Share Posted May 4, 2022 Added image, perhaps this can be easier understood with image. UP Link to comment
tuanphan Posted May 5, 2022 Share Posted May 5, 2022 17 hours ago, Faustas said: Added image, perhaps this can be easier understood with image. UP Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper'); }); </script> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Faustas Posted May 12, 2022 Author Share Posted May 12, 2022 On 5/5/2022 at 6:51 AM, tuanphan said: Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper'); }); </script> Thank you so much!! Hero Link to comment
Faustas Posted May 12, 2022 Author Share Posted May 12, 2022 On 5/5/2022 at 6:51 AM, tuanphan said: Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper'); }); </script> How would i move add to cart next to enquire ? https://www.mozerisfineantiques.com/timepieces/p/piaget-p10182-18kt-yellow-gold-wristwatch Link to comment
tuanphan Posted May 14, 2022 Share Posted May 14, 2022 On 5/12/2022 at 5:10 PM, Faustas said: How would i move add to cart next to enquire ? https://www.mozerisfineantiques.com/timepieces/p/piaget-p10182-18kt-yellow-gold-wristwatch Move Enquire next to add to cart or move add to cart next to enquire? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Faustas Posted May 23, 2022 Author Share Posted May 23, 2022 On 5/14/2022 at 10:30 AM, tuanphan said: Move Enquire next to add to cart or move add to cart next to enquire? Move Enquire next to add to cart Link to comment
tuanphan Posted May 24, 2022 Share Posted May 24, 2022 13 hours ago, Faustas said: Move Enquire next to add to cart I see you have 2 buttons: Enquire + Livechat. Move enquiry only or both? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Faustas Posted June 6, 2022 Author Share Posted June 6, 2022 On 5/24/2022 at 5:17 AM, tuanphan said: I see you have 2 buttons: Enquire + Livechat. Move enquiry only or both? I would like to move enquiry only, add to cart can stay, thank you. Link to comment
tuanphan Posted June 10, 2022 Share Posted June 10, 2022 On 6/6/2022 at 10:06 PM, Faustas said: I would like to move enquiry only, add to cart can stay, thank you. Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional .button-block').appendTo('div.sqs-add-to-cart-button-wrapper'); }); </script> <style> div.sqs-add-to-cart-button-wrapper { display: flex !important; align-items: center; width: 100% !important; flex-wrap: nowrap !important; } #siteWrapper.with-button-variants .sqs-button-element--primary { max-width: unset !important; min-width: unset !important; width: auto !important; margin-right: 20px; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Faustas Posted June 22, 2022 Author Share Posted June 22, 2022 On 6/10/2022 at 8:06 AM, tuanphan said: Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional .button-block').appendTo('div.sqs-add-to-cart-button-wrapper'); }); </script> <style> div.sqs-add-to-cart-button-wrapper { display: flex !important; align-items: center; width: 100% !important; flex-wrap: nowrap !important; } #siteWrapper.with-button-variants .sqs-button-element--primary { max-width: unset !important; min-width: unset !important; width: auto !important; margin-right: 20px; } </style> Thank you so much, really appreciate it. I am very happy. Just one last question is how can I have the buttons all the same size, and perhaps some spacing inbetween? Thank you Link to comment
tuanphan Posted June 23, 2022 Share Posted June 23, 2022 20 hours ago, Faustas said: Thank you so much, really appreciate it. I am very happy. Just one last question is how can I have the buttons all the same size, and perhaps some spacing inbetween? Thank you Do you still need help? I see them stacked here Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
kirstym Posted September 27, 2022 Share Posted September 27, 2022 On 5/5/2022 at 6:51 AM, tuanphan said: Add to Last Line in Code Injection > Footer <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper'); }); </script> @tuanphan Thanks for this code, it was really helpful. I made a small adjustment so the Additional Info section would sit above the variant selector. (See below). When viewed on mobile, the Additional Info section (size chart button) is above the product description, is there a way to resolve this? Thank you.https://baskapparel.squarespace.com/shop/p/bask-suit <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .ProductItem-details-excerpt'); }); </script> Link to comment
tuanphan Posted September 28, 2022 Share Posted September 28, 2022 22 hours ago, kirstym said: @tuanphan Thanks for this code, it was really helpful. I made a small adjustment so the Additional Info section would sit above the variant selector. (See below). When viewed on mobile, the Additional Info section (size chart button) is above the product description, is there a way to resolve this? Thank you.https://baskapparel.squarespace.com/shop/p/bask-suit <script> $(document).ready(function() { $('section.ProductItem-additional').insertAfter('.ProductItem-details .ProductItem-details-excerpt'); }); </script> Add to under your code <style> @media screen and (max-width:767px) { section.ProductItem-additional { order: 4; } } </style> kirstym 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
kirstym Posted September 29, 2022 Share Posted September 29, 2022 On 9/28/2022 at 10:22 AM, tuanphan said: Add to under your code <style> @media screen and (max-width:767px) { section.ProductItem-additional { order: 4; } } </style> Thank you! That's perfect. Link to comment
marmaladeisgood Posted October 6, 2022 Share Posted October 6, 2022 Hi there, I'm having the same issue as the initial post that started this thread but the code that helped this person doesn't work on my site. I'm trying to move the content of 'additional info' into the same area as 'product description'. This is the product page currently: https://wigshairmakeup.com/all-prints/p/fresa-kaw7a. Thanks for your help! Link to comment
tuanphan Posted October 7, 2022 Share Posted October 7, 2022 15 hours ago, marmaladeisgood said: Hi there, I'm having the same issue as the initial post that started this thread but the code that helped this person doesn't work on my site. I'm trying to move the content of 'additional info' into the same area as 'product description'. This is the product page currently: https://wigshairmakeup.com/all-prints/p/fresa-kaw7a. Thanks for your help! Page doesn't exist. Can you check it again? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
marmaladeisgood Posted October 9, 2022 Share Posted October 9, 2022 https://wigshairmakeup.com/catalogue-working/p/fresa-kaw7a-26f89-5tnsh Link to comment
tuanphan Posted October 10, 2022 Share Posted October 10, 2022 17 hours ago, marmaladeisgood said: https://wigshairmakeup.com/catalogue-working/p/fresa-kaw7a-26f89-5tnsh You mean Move Contact Button? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
marmaladeisgood Posted October 13, 2022 Share Posted October 13, 2022 Yes, move the contact button to underneath the product title where 'product description' would typically be. Link to comment
tuanphan Posted October 15, 2022 Share Posted October 15, 2022 On 10/14/2022 at 4:09 AM, marmaladeisgood said: Yes, move the contact button to underneath the product title where 'product description' would typically be. Add this to Settings > Advanced > Code Injection > Footer <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> marmaladeisgood 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Srob__ Posted February 8 Share Posted February 8 Hello, I have kind of a big ask. I would like to not only move the 'additional info' section to underneath the 'add the cart' button but also put the product variants (size and quantity ) on the same line. Can anyone help me? I have attached photos for reference https://www.studio---dot.work/giftshop/p/studio-first-team Link to comment
tuanphan Posted February 10 Share Posted February 10 On 2/9/2023 at 3:36 AM, Srob__ said: Hello, I have kind of a big ask. I would like to not only move the 'additional info' section to underneath the 'add the cart' button but also put the product variants (size and quantity ) on the same line. Can anyone help me? I have attached photos for reference https://www.studio---dot.work/giftshop/p/studio-first-team Add to Design > Custom CSS @media screen and (min-width:992px) { #page .ProductItem-details-checkout .product-variants { float: left !important; width: 45% !important; } .product-quantity-input { float: left !important; width: 45% !important; position: relative; top: -130px; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
ccoolsaet Posted February 17 Share Posted February 17 (edited) Hello! Quick question about mobile breakpoint. The code works great for desktop but when I view it on mobile the "additional information" is underneath the image instead of being under the Add to Cart CTA. Image attached. This is the code that I'm using: <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> Thank you for your help! Edited February 17 by ccoolsaet Link to comment
tuanphan Posted February 20 Share Posted February 20 On 2/17/2023 at 8:21 AM, ccoolsaet said: Hello! Quick question about mobile breakpoint. The code works great for desktop but when I view it on mobile the "additional information" is underneath the image instead of being under the Add to Cart CTA. Image attached. This is the code that I'm using: <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> Thank you for your help! Hi, What is site url? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment