Betania93 Posted November 5, 2023 Share Posted November 5, 2023 Hello! I was wondering if there is a way to add the accordion as mentioned to every single product page on my store? Every page has the same additional information you see and was really hoping there is a way to add it to every product without having to do this manually? thank you Bethany Link to comment
JayVanDyke Posted November 5, 2023 Share Posted November 5, 2023 Not sure there's a good free solution but this would do the trick. affiliate link - https://www.will-myers.com/products/p/section-loader-supreme?peachs_apc=jay-van-dyke ☕ Did I help you? Buy me a coffee! 👨💻 Bergen Design Co. 💻 I'm for hire on Upwork! 🕸️ Squarespace Experts 🖥️ 99Designs 🛠️ Web Designer's Toolkit **some of these contain affiliate links Link to comment
tuanphan Posted November 7, 2023 Share Posted November 7, 2023 You can add accordion to site footer, then share link to a product, we can give code to move accordion block to all products. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Betania93 Posted November 10, 2023 Author Share Posted November 10, 2023 thank you that would be wonderful - ive now added it to the footer! here's a product link https://wildmoonstudio.co.uk/shop/p/checkered-print-abstract-checked-poster-wavy-print-blue-check-print-simple-wall-decor-aesthetic-wall-print-checked-print-cool-art would be great if I could have it in the additional information section! thanks, Beth Link to comment
Solution tuanphan Posted November 12, 2023 Solution Share Posted November 12, 2023 On 11/10/2023 at 9:23 PM, Betania93 said: thank you that would be wonderful - ive now added it to the footer! here's a product link https://wildmoonstudio.co.uk/shop/p/checkered-print-abstract-checked-poster-wavy-print-blue-check-print-simple-wall-decor-aesthetic-wall-print-checked-print-cool-art would be great if I could have it in the additional information section! thanks, Beth Add this code to Website > Website Tools (under Not Linked) > Code Injection > Footer (this code will move Accordion Block Section to Additional Info of all products) <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> jQuery(document).ready(function($){ $('[data-section-id="654e3ba719e0bb19b39b2ed8"]').insertAfter('section.ProductItem-summary'); }) </script> Next, add this code to Website Tools > Custom CSS (this code will hide accordion section on other pages) [data-section-id="654e3ba719e0bb19b39b2ed8"] { display: none !important; } [class*="type-products"].view-item [data-section-id="654e3ba719e0bb19b39b2ed8"] { display: block !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Betania93 Posted November 12, 2023 Author Share Posted November 12, 2023 thank you so much! it worked! just wondered if you know how to hide the divider line between the additional info and the you might also like section? thank you! Link to comment
tuanphan Posted November 18, 2023 Share Posted November 18, 2023 On 11/12/2023 at 7:07 PM, Betania93 said: thank you so much! it worked! just wondered if you know how to hide the divider line between the additional info and the you might also like section? thank you! I guess you should able to edit section > remove it If you can't find a way to delete it, add this code under <style> #pdp .section-divider-display { display: none; } </style> Betania93 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Betania93 Posted November 19, 2023 Author Share Posted November 19, 2023 great thank you that worked! Link to comment
JohannaAmanda Posted October 24 Share Posted October 24 Hi @tuanphan! I've managed to solve so many things thanks to your wonderful replies and feedback in here, so thank you for that. I hate to ask you about this again, but I am looking for the same solution as above. I tried your answer here, with info from my own site obviously, but it didn't work for me. I am sure I'm doing something wrong... I would love to be able to have the same accordion info on all product pages, instead of manually having to put them in on each and every product all the time. Could you please help? Thank you kindly! Link to comment
tuanphan Posted October 27 Share Posted October 27 On 10/24/2024 at 5:56 PM, JohannaAmanda said: Hi @tuanphan! I've managed to solve so many things thanks to your wonderful replies and feedback in here, so thank you for that. I hate to ask you about this again, but I am looking for the same solution as above. I tried your answer here, with info from my own site obviously, but it didn't work for me. I am sure I'm doing something wrong... I would love to be able to have the same accordion info on all product pages, instead of manually having to put them in on each and every product all the time. Could you please help? Thank you kindly! I wrote this new guide, you can follow it In case you want each product will have a different accordion, you can share link to a product on your site, I can check easier. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) 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