Modifying Colorblock Theme for 6-Column Collection List and Image Size Reduction

[Lajos]

Hi, I’m currently using the Colorblock theme and need to configure the collection list module to display 6 columns. The theme’s UI only allows a maximum of 5 columns. Is it possible to achieve this by overriding the code?

Additionally, I need to reduce the size of single-item collection images. In the theme settings (collection card settings), I tried using the image inner margin padding to achieve this, but the UI only allows a maximum of 20px. I need to reduce the images further.

Could you please help me?

Theme Name: Colorblock 14.0.0.

E-commerce Store URL: https://www.energetikon.com/

[Rahul_dhiman]

Hello @Lajos
Please check the screenshot below, and do the changes.

Let me know if this solved your purpose.
and don’t forget to mark the job as completed.
Thanks

[BSS-TekLabs]

• Here is the solution for you

• Please follow these steps:

• Then find the base.css file.

• Then add the following code:

.grid--5-col-desktop .grid__item {
 width: 10% !important;
}
.card .media.media--hover-effect>img:only-child, .card-wrapper .media.media--hover-effect>img:only-child {
 padding: 7px;
}

• You can increase 7px to a larger number if you want the image to be smaller.

• Then press ‘Save’ to save the code.

• Here is the result you will achieve:

Good luck! If you find this answer helpful, please press ‘Like’ and mark it as ‘Solution’. Thank you.

[Lajos]

Thanks for the quick response. It works great!

[Lajos]

Hi,

After a few days, I’ve noticed that this recent settings change has caused some display issues on my smartphone. I’ve attached a screenshot for reference.

Could you please take a look and see if you can help me fix this?

Thank you Vladimír Svoboda

[Lajos]

Hi,

It seems that this template only allows a maximum of 5 columns side by side. Is this correct?

If so, is there a way to increase the number of columns or achieve a similar layout with more columns?

Theme Name: Colorblock 14.0.0.

E-commerce Store URL: https://www.energetikon.com/

Thank you for your time and assistance…