Homepage Collection Grid

[ChrisW3]

Trying to improve this section on our homepage:

https://www.physioworldshop.co.uk/

Currently it looks poor, the text is actually part of the image and goes pixelated. The images are poor.

I want 6 images laid out in two rows of three like this on desktop and one on top of another on mobile. There would be a text overlay with the collection title in it

The one on this website is good: www.martinschocolatier.co.uk

Or this one: https://www.jadlamracingmodels.com/

Is there a simple way to add an image grid via the customiser?

[Shadab_dev]

I believe you are using a paid theme so i wouldnt have much knowledge about it. If your theme does not offer customizations like you need you will have to go the custom code route. This is i will say one of the cons in shopify where you dont get a lot of customization options like in platforms like wordpress using a plugin. And if you need a unique design you will need code modifications. But there are plugins or in case of shopify apps like pageFly builder or zeno page builder, gems page builder, etc where you can get a bit more freedom on customizations.

[mageplaza-cs]

Hi @ChrisW3 ,

I am from Mageplaza - Shopify solution expert

Can you display the text and image of this section again? That way, I can help you present them perfectly according to your preferences.

[ChrisW3]

Currently looks like this:

[mageplaza-cs]

@ChrisW3

You often add the following CSS code to the Custom CSS section of this section to be able to display as desired:

#shopify-section-collection-list .featured-box--image{
      position: unset;
      transform: unset;
}
#shopify-section-collection-list .grid-uniform{
     display: flex;
     flex-wrap: wrap;
}
#shopify-section-collection-list .featured-box--title{
      display: block !important;
      background-color: #ccc;
      padding: 15px 0;
}
@media only screen and (max-width: 480px){
     #shopify-section-collection-list .grid-item{
          width: 50%;
     }
}

[ChrisW3]

Looks better, How do I make the collection title black and larger?