theRooRoo Posted March 3, 2021 Share Posted March 3, 2021 Hi There, I am new to Squarespace, but have worked in a lot other platforms and have coding experience from 10 yrs ago. So needless to say I am a little rusting in the coding department. I am looking for some coding help on getting my sites navigation drop down box to fit with the text; align with main folder and wrap sub nav titles. In my screenshot the box should align with top navigation link. Here is the code I have used: /* Change dropdown menu background */ .header-nav-folder-content { background: #F3F3F3 !important; font-size: 15px; } /* Align left dropdown */ .header-nav-folder-content { text-align: left !important; background-size: auto;} /*Change width of drop down & wrap text*/ .header-nav .header-nav-item--folder .header-nav-folder-content { width: 50%; } I am also looking for code suggestions on creating drop down text from an image. It is the same concept of dropdown accordion text but I want the text to drop when the image is clicked. See second screen shot of the 4 images; I want the text below to drop when the image is clicked vs. being static text below. My site is still in trial mode so I can't share the link. Beyondspace 1 Link to comment
Beyondspace Posted March 4, 2021 Share Posted March 4, 2021 3 hours ago, theRooRoo said: Hi There, I am new to Squarespace, but have worked in a lot other platforms and have coding experience from 10 yrs ago. So needless to say I am a little rusting in the coding department. I am looking for some coding help on getting my sites navigation drop down box to fit with the text; align with main folder and wrap sub nav titles. In my screenshot the box should align with top navigation link. Here is the code I have used: /* Change dropdown menu background */ .header-nav-folder-content { background: #F3F3F3 !important; font-size: 15px; } /* Align left dropdown */ .header-nav-folder-content { text-align: left !important; background-size: auto;} /*Change width of drop down & wrap text*/ .header-nav .header-nav-item--folder .header-nav-folder-content { width: 50%; } I am also looking for code suggestions on creating drop down text from an image. It is the same concept of dropdown accordion text but I want the text to drop when the image is clicked. See second screen shot of the 4 images; I want the text below to drop when the image is clicked vs. being static text below. My site is still in trial mode so I can't share the link. You can enable site wide password and let us know the link Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
theRooRoo Posted March 6, 2021 Author Share Posted March 6, 2021 @bangank36 Thanks for reaching out. I have enabled my trial site. https://fiddle-flute-dw8f.squarespace.com/ cUr10s1ty! Beyondspace 1 Link to comment
Beyondspace Posted March 7, 2021 Share Posted March 7, 2021 11 hours ago, theRooRoo said: @bangank36 Thanks for reaching out. I have enabled my trial site. https://fiddle-flute-dw8f.squarespace.com/ cUr10s1ty! For the navigation position .header .header-layout-nav-right .header-nav .header-nav-item--folder .header-nav-folder-content { right: auto; } theRooRoo and tuanphan 2 Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
theRooRoo Posted March 8, 2021 Author Share Posted March 8, 2021 @bangank36Perf 20 hours ago, bangank36 said: For the navigation position .header .header-layout-nav-right .header-nav .header-nav-item--folder .header-nav-folder-content { right: auto; } Worked like a dream! Thank you! Beyondspace 1 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