Solved

How can I adjust product display and font size on my mobile website?

Abc_Medical
Tourist
6 0 1

Hello Dear People,

 

I hope you're all doing well.

 

On my website, products are shown very small on the homepage (mobile version only) and the fonts used under the circles are also very small . On the mobile version there are 3 products in a row (3 circles shown. I would like to have 2 circles in a row instead of 3 circles.

 

Does anyone know how I can get that done?

 

I also send my URL address and possibly some screenshots for clarity.

 

I would like to thank all who read this message and would like to help me if possible.

 

Best Regards

 

My URL:

https://abcmedicals.be/https://abcmedicals.be/ Homepage on desktop versionHomepage on desktop versionHomepage on Mobile versionHomepage on Mobile version

Accepted Solution (1)

AvadaCommerce
Shopify Partner
3879 839 968

This is an accepted solution.

Hi @Abc_Medical ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css->paste below code at the bottom of the file:

 

@media (max-width: 551px){
  .ishicategoryblock-container.item.col-md-4.col-sm-4.col-xs-4.ishicategoryblock-grid {
     width: 50% !important;
  }
  .ishi-category-block .ishicategoryblock .ishicategoryblock-container .circular-image .text-container {
     font-size: 15px !important;
  }
}

 

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

Best regards.

banned

View solution in original post

Replies 2 (2)

AvadaCommerce
Shopify Partner
3879 839 968

This is an accepted solution.

Hi @Abc_Medical ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css->paste below code at the bottom of the file:

 

@media (max-width: 551px){
  .ishicategoryblock-container.item.col-md-4.col-sm-4.col-xs-4.ishicategoryblock-grid {
     width: 50% !important;
  }
  .ishi-category-block .ishicategoryblock .ishicategoryblock-container .circular-image .text-container {
     font-size: 15px !important;
  }
}

 

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

Best regards.

banned
Abc_Medical
Tourist
6 0 1

Hi @AvadaCommerce 

 

Sorry for the delay. I was really busy, and I just managed to run that code you provided in the theme.css folder and IT WORKS. 🙂


Thank you so much for your assistance. I sincerely appreciate your help.

 

Best regards,

abcmedicals.be