ACScruggs 2 Share Posted October 25, 2020 (edited) Site URL: https://paddlefish-roadrunner-gk5n.squarespace.com/config/design/product-items I am trying to add an accordion drop-down menu to my client's product pages to highlight "Materials" and "Care" for each item. Edited October 25, 2020 by ACScruggs Link to post
0 rwp 299 Share Posted October 25, 2020 You can add a blocks to the product pages under the additional info tab. ACScruggs 1 Link to post
0 ACScruggs 2 Author Share Posted November 13, 2020 Thank you so much! I will give this a try!! Link to post
0 tuanphan 9,590 Share Posted November 20, 2020 On 11/13/2020 at 2:27 PM, ACScruggs said: Thank you so much! I will give this a try!! I see shop pages has many category nav links on mobile. I think you can convert to dropdown. If you want this, We can give the code. Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 ACScruggs 2 Author Share Posted November 20, 2020 @tuanphan Thanks for your reply! We have decided not to add dropdown accordion menus to the shop page. However, if you have a moment, I am still trying to resolve the other issue you responded to - "change size of an image in mobile view". That forum discussion thread is linked HERE. Link to post
0 tuanphan 9,590 Share Posted November 22, 2020 On 11/21/2020 at 1:08 AM, ACScruggs said: @tuanphan Thanks for your reply! We have decided not to add dropdown accordion menus to the shop page. However, if you have a moment, I am still trying to resolve the other issue you responded to - "change size of an image in mobile view". That forum discussion thread is linked HERE. Add to Home > Design > Custom CSS /* resize center footer logo */ @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1605764657479_34733 { width: 30%; margin: 0 auto; } } Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 sonofrand 0 Share Posted February 15 Hi, I would like to have a dropdown menu on mobile for my shop categories. Is this possible in 7.1? Link to post
0 creedon 815 Share Posted February 15 @sonofrand Please post the URL for your site. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works. We can then take a look at your issue. sonofrand 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to post
0 sonofrand 0 Share Posted February 16 site url is http://www.sonofrand.com/shop Thanks so much! Link to post
0 tuanphan 9,590 Share Posted February 18 (edited) On 2/16/2021 at 8:13 AM, sonofrand said: site url is http://www.sonofrand.com/shop Thanks so much! Add to Settings > Advanced > Code Injection > Header <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function() { if(window.innerWidth <= 575 && $('.nested-category-children li a').length > 0) { let open = false $('<div id="t-category" name="t-category"><div id="t-control">Category <span id="t-down"></span><span id="t-up"></span></div><div id="t-menu"></div></div>').insertBefore('.nested-category-tree-wrapper'); $('.nested-category-children li a').each(function(id, e) { const href = $(e).attr('href'); const text = $(e).html(); $('#t-menu').append('<a class="t-item" href="'+href+'">'+text+'</a>') }) $('#t-control').click(function() { if (!open) { $('#t-menu').css('display', 'block') $('#t-down').css('display', 'none') $('#t-up').css('display', 'unset') open = true } else { $('#t-menu').css('display', 'none') $('#t-down').css('display', 'unset') $('#t-up').css('display', 'none') open=false } }) } }) </script> <style> #t-category { display: none; } @media only screen and (max-width: 575px) { .nested-category-children { display: none !important; } #t-menu { position: absolute; top: 35px; z-index: 1; background: white; display: none; right: 0; text-align: right; } #t-category { position: relative; display: inline-block; float: right; top: 5px; right: 0; } .nested-category-title { display: inline-block !important; } #t-control { font-family: baskerville-display-pt; font-weight: 700; font-style: normal; letter-spacing: 0em; text-transform: none; z-index: 12; font-size: 20px; position: absolute; top: 0; right: 0; padding-right: 20px; } .t-item { display: block; padding-left: 15px; } #t-down { margin-left: 10px; position: absolute; top: 15px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 10px solid; right: 0; } #t-up { margin-left: 10px; position: absolute; bottom: 12px; right:0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 10px solid; display: none; } } </style> (t in the code is my name ☘️. Tested code on >4 SS 7.1 sites) Edited February 18 by tuanphan Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
Question
ACScruggs 2
Site URL: https://paddlefish-roadrunner-gk5n.squarespace.com/config/design/product-items
I am trying to add an accordion drop-down menu to my client's product pages to highlight "Materials" and "Care" for each item.
Edited by ACScruggsLink to post
Top Posters For This Question
3
3
2
1
Popular Days
Feb 15
2
Oct 25
2
Nov 20
2
Feb 16
1
Top Posters For This Question
ACScruggs 3 posts
tuanphan 3 posts
sonofrand 2 posts
rwp 1 post
Popular Days
Feb 15 2021
2 posts
Oct 25 2020
2 posts
Nov 20 2020
2 posts
Feb 16 2021
1 post
Popular Posts
rwp
You can add a blocks to the product pages under the additional info tab.
creedon
@sonofrand Please post the URL for your site. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. Adding a site-wi
9 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment