Jump to content

Mobile Site Help PLEASEEEEE!!

Recommended Posts

Site URL: https://mackerel-collie-9dwr.squarespace.com/config/design/custom-css

1) So, my mobile site is driving me crazy and I need help please.  On my mobile site, the products are stacked vertically but I want them to be side by side. At least two columns. 

2) Whenever I click on the picture to zoom in, the picture is completely cut off(it's perfect on the desktop). 

3) There is no next button on the mobile site so customers can go back to the where they were before the current page they may be on. Help please

 

I'm so ready to send my password just for HELPPPP!!

Link to comment
  • Replies 9
  • Views 603
  • Created
  • Last Reply
2 hours ago, inunzi said:

@Lauri do you think you can send pictures of the problem? And send screen shots of something that can help resemble what you are wanting it to look like?

In the first picture, the products are stacked on top of each other- would prefer if there were two columns instead of one.

Second picture, once you click on the image, there is a breadcrumbs at the top, is there a way to put an arrows so they can go back to the previous page instead of clicking on the breadcrumbs.

Last picture is when I hover over the picture then click on it. The picture is cut off. 😞 

image1.thumb.jpeg.9bcdd4c696ae35c17e833162194e35f2.jpegimage0.thumb.jpeg.d002c7336f763f4b2697d0c656da0aa9.jpeg

image2.jpeg

Link to comment

Q1. Q2. Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.collection-type-products .gallery-lightbox-item img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}
    .products.collection-content-wrapper .list-grid {
        display:grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-column-gap: 10px;
        grid-row-gap: 5px;
    }
}

 

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
2 hours ago, tuanphan said:

Q1. Q2. Add to Home > Design > Custom CSS


@media screen and (max-width:767px) {
.collection-type-products .gallery-lightbox-item img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}
    .products.collection-content-wrapper .list-grid {
        display:grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-column-gap: 10px;
        grid-row-gap: 5px;
    }
}

 

You are a life saver. Thank you so very much! I really appreciate it. 

Link to comment
5 hours ago, Lauri said:

@tuanphan one more question if you don’t mind, is there a way to have to icons on my homepage go horizontally instead of stacked as it is on the mobile. 
 

the picture I’m attaching is not how I want the images to look. Want them to be side by side. 

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.homepage .gallery-grid-wrapper {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}
}

 

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

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.