harley 2 Share Posted August 6, 2020 Site URL: https://bat-dahlia-6hpc.squarespace.com/config/commerce Hello, can some one help me with my mobile header. In the image attached it shows the layout I would like for my mobile header, which is the logo being central and the elements either side. However 7.1 won't let me change this. Can someone provide some code to adjust this back? Link to post
0 RyanDejaegher 137 Share Posted August 6, 2020 @ankdnk and @harley I believe Squarespace just introduced some changes to the mobile headers which could be causing the issue. Philadelphia, PA 👉 Squarespace Tutorials Chat/Message on FB Messenger for quickest response: https://m.me/dejaegherryan Link to post
0 KeepOnKeepingOn 14 Share Posted August 6, 2020 I'm glad I'm not the only one who noticed this. This is very annoying that there is no control over this or at least when you change the header layout it only changes on the desktop and not mobile. I fought for hours going through my code to see if it was something that I caused. They must have changed something so I hope it was a mistake because I don't like this layout at all. My layout on mobile would always be Nav Left, Logo Center, & additional links "cart" Aligned Right. I'm sure this was a error an there will be a fix soon because I'm sure there has been enough people noticing this issue. At least I hope this was a mistake! Link to post
0 abry747 2 Share Posted August 7, 2020 I had the same problem today. I found out that Squarespace released a new feature today for 7.1 that will give you options to change the mobile header layout, but not all sites have this update yet. If you start a trial site in 7.1 today, you will see the mobile header option. I used this code below to return my mobile icon back to the left. .header-display-mobile .header-burger {position: absolute} Link to post
0 tuanphan 9,561 Share Posted August 7, 2020 Add to Home > Design > Custom CSS @media screen and (max-width:767px) { .header-burger.no-actions { order: 1 !important; } .header-title-nav-wrapper { order: 2; } .header-actions.header-actions--right { order: 3; } } 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 KeepOnKeepingOn 14 Share Posted August 7, 2020 Thanks for the reply, until there is a fix i just used this in my css for left align menu for mobile as stated above and the extra code for the logo back to middle. .header-display-mobile .header-burger {position: absolute;} .header-display-mobile .header-title-logo { text-align:center; margin-left:20%; } I haven't set the margin property to calculate a perfect center but because the wrapper isn't 100% width of the header, centering with text-align won't make it center of the header so you have to offset it with a margin property. Link to post
Question
harley 2
Site URL: https://bat-dahlia-6hpc.squarespace.com/config/commerce
Hello, can some one help me with my mobile header.
In the image attached it shows the layout I would like for my mobile header, which is the logo being central and the elements either side.
However 7.1 won't let me change this.
Can someone provide some code to adjust this back?
Link to post
Top Posters For This Question
2
1
1
1
Popular Days
Aug 6
3
Aug 7
3
Top Posters For This Question
KeepOnKeepingOn 2 posts
harley 1 post
RyanDejaegher 1 post
abry747 1 post
Popular Days
Aug 6 2020
3 posts
Aug 7 2020
3 posts
Posted Images
5 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