Jump to content

Remove blank space underneath grid galleries on mobile Squarespace 7.1

Go to solution Solved by SourceProjects,

Recommended Posts

Hello!

I finally (thought I had) finished a client's website yesterday and went live. Link is here. (If you look at any of the artist pages on your mobile you will see what I mean). The website consists of lots and lots and lots of galleries. In the mobile view, everything in the design editor looked fine. But now that it is live and I am looking at it on my actual mobile I am horrified to see that beneath every grid gallery there is a LOT of blank space... In the editor, I had left no blank space beneath the images (i.e. dragged the blue bar up) and only left one/none fluid engine rows beneath the galleries...

I am hoping there is a sitewide fix for this.  But if I have to target different section id's I will... Been looking up different solutions but nothing is working so far.

Would be grateful for your help!

Link to comment
  • Replies 7
  • Views 562
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

5 minutes ago, SourceProjects said:

In the mobile view, everything in the design editor looked fine. But now...I am looking at it on my actual mobile I am horrified to see that beneath every grid gallery there is a LOT of blank space

Mobile devices now have very different resolutions so we may be seeing something different depending on the device we are using. Can you provide some screenshots of what you're seeing, as well as what you expected? 

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment

Hi Paul,

Please see screenshots attached. The first is what I expected. The second is the view in my mobile (iPhone)

 

 

 

 

On 5/27/2023 at 10:01 AM, paul2009 said:

Mobile devices now have very different resolutions so we may be seeing something different depending on the device we are using. Can you provide some screenshots of what you're seeing, as well as what you expected? 

 

Screenshot 2023-05-28 at 18.56.55.png

IMG_0819.PNG

Link to comment
43 minutes ago, SourceProjects said:

Please see screenshots attached.

Thanks for the images. If you edit the page in Mobile View, you should be able to remove the surplus rows from this section by dragging the button upwards.

image.gif.d70d69cd966c52cd8a50e754e6aacf39.gif

Also, I strongly recommend that you delete the 'autoplay' script. It is badly written and is causing site errors every 3 seconds.

Did this help? Please give feedback by clicking an icon below  ⬇️

Edited by paul2009

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment
3 minutes ago, paul2009 said:

Thanks for the images. If you edit the page in Mobile View, you should be able to remove the surplus rows from this section by dragging the button upwards.

image.gif.d70d69cd966c52cd8a50e754e6aacf39.gif

Also, I strongly recommend that you delete the 'autoplay' script. It is badly written and is causing site errors every 3 seconds.

Did this help? Please give feedback by clicking an icon below  ⬇️

Thanks very much Paul,

Every single page was carefully edited in the mobile editor to eliminate blank space at the bottom of galleries and page sections (as per your video). Why blank space is suddenly appearing in a real life mobile screen is a complete mystery and this is what I am trying to eliminate...

The autoplay script is there because Squarespace sadly no longer provide this option in carousel galleries. There is one of these on the website in the about page. If you know of a better fix for this, it would be most welcome. But the white space below the galleries in mobile view is of greater concern. 

 

 

Link to comment
20 minutes ago, SourceProjects said:

Every single page was carefully edited in the mobile editor to eliminate blank space at the bottom of galleries and page sections (as per your video).

I'm sorry this didn't help!

If you've already used the method that I described then I recommend first checking that custom CSS is not the issue. If it isn't, please contact Squarespace Customer Care directly as they'll have the required level of access to troubleshoot the issue. 

If it helps, this isn't an issue with the device. I can reproduce the issue on your site when emulating a mobile on desktop too.

Let us know how you get on.

Edited by paul2009

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment
39 minutes ago, paul2009 said:

I'm sorry this didn't help!

If you've already used the method that I described then I recommend first checking that custom CSS is not the issue. If it isn't, please contact Squarespace Customer Care directly as they'll have the required level of access to troubleshoot the issue. 

If it helps, this isn't an issue with the device. I can reproduce the issue on your site when emulating a mobile on desktop too.

Let us know how you get on.

Thanks Paul, yes I think I'll have to contact customer support about this... Will keep you posted!

Link to comment
  • Solution

I was in touch with customer support this morning and they were very responsive and helpful as usual but they claimed that it was probably the CSS / coding block causing the issue and that that they're not there to troubleshoot CSS issues. Anyway, I know that was not causing the extra padding in galleries in mobile view as I am not the first person who has posted about this... I think it is a FE teething problem. Thankfully, I have now found a solution in the thread here:

This code specifically... It will take a lot of time to fix the site but so happy to have found a fix! 

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.