Isaebella Posted April 13, 2022 Share Posted April 13, 2022 Hello! I'd love to manually organise my header navigation content, the position of the cart and button is annoying me more than I'd like to admit.. If anyone has any advice, please alleviate my eyesore and I'll be very grateful. LINK: https://aardvark-jellyfish-fwmh.squarespace.com/ PASSWORD: milk See image for current vs. goal. Link to comment
Web_Solutions Posted April 13, 2022 Share Posted April 13, 2022 (edited) Add these code Design > Custom CSS @media(min-width:1024px){ .header-actions.header-actions--right{ display: flex !important; .header-actions-action--cta{ order: 1 !important; } .showOnDesktop{ order: 2 !important; } } } Edited April 13, 2022 by Web_Solutions Create_Job, tuanphan, Greenroom and 2 others 5 If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks MD Rofik Website Designer and Digital Marketer ☕Am I helpful? Want to offer me a coffee? ✉ Send me a message if needed any help. I'll try to reply as soon as possible. Link to comment
Isaebella Posted April 13, 2022 Author Share Posted April 13, 2022 Wow, you're incredible! I've been reading so much extensive, lengthy code and you nailed it in a few lines. Legend! Link to comment
Greenroom Posted November 1, 2022 Share Posted November 1, 2022 Hi @Web_Solutions Just wondering if you would be able to help me with a similar issue - I would like to get the button and the cart to sit along side the main nav menu items - at the moment they sit above and when I try to move them down it ends up sitting overtop of the nav, rather than along side it. Is there any way to do this? Site: https://bloom-skin-aesthetics.squarespace.com P/w: Leah2022! Link to comment
tuanphan Posted November 4, 2022 Share Posted November 4, 2022 On 11/2/2022 at 2:02 AM, Greenroom said: Hi @Web_Solutions Just wondering if you would be able to help me with a similar issue - I would like to get the button and the cart to sit along side the main nav menu items - at the moment they sit above and when I try to move them down it ends up sitting overtop of the nav, rather than along side it. Is there any way to do this? Site: https://bloom-skin-aesthetics.squarespace.com P/w: Leah2022! You mean make nav - button - cart same row? 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
Greenroom Posted November 6, 2022 Share Posted November 6, 2022 Hi @tuanphan - Yes if possible - all the nav menu options, button and cart icon in one line across the width of the page below the logo Is there a way to do that? Link to comment
tuanphan Posted November 10, 2022 Share Posted November 10, 2022 On 11/7/2022 at 5:14 AM, Greenroom said: Hi @tuanphan - Yes if possible - all the nav menu options, button and cart icon in one line across the width of the page below the logo Is there a way to do that? Add to Last Line in Code Injection > Footer <script> $(document).ready(function(){ $('.header-display-desktop .header-actions.header-actions--right').clone().appendTo('nav.header-nav-list'); }); </script> <style> .header-display-desktop>.header-actions { display: none !important; } .header-title-nav-wrapper { flex: 0 0 100% !important; } nav.header-nav-list { flex-wrap: nowrap; align-items: center; } </style> 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
Dels Posted 16 hours ago Share Posted 16 hours ago On 4/13/2022 at 4:25 AM, Web_Solutions said: Add these code Design > Custom CSS @media(min-width:1024px){ .header-actions.header-actions--right{ display: flex !important; .header-actions-action--cta{ order: 1 !important; } .showOnDesktop{ order: 2 !important; } } } On 11/10/2022 at 6:58 AM, tuanphan said: Add to Last Line in Code Injection > Footer <script> $(document).ready(function(){ $('.header-display-desktop .header-actions.header-actions--right').clone().appendTo('nav.header-nav-list'); }); </script> <style> .header-display-desktop>.header-actions { display: none !important; } .header-title-nav-wrapper { flex: 0 0 100% !important; } nav.header-nav-list { flex-wrap: nowrap; align-items: center; } </style> Hello, is it possible to align the nav menu options like this, whilst also still having the "book appointment button". I would also like to have the cart and the log in button to the right of the "book appointment". I tried the first code but it only moved the cart, and I wasn't too sure how to more the login button along with it. I want my nav menu in a straight line like the "bloom" example above if possible, but I still want the social media button and email on the far left. I'm not sure if this is even possible? Please help if you can! 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