How to make Collection List thumbnails really small on home page (Focal Theme)

Thehumblelone · ‎02-17-2024

My collection list is currently displaying my collections in very large grid thumbnails. I want them to look like the ones shown here. Please help 😕

I know i have to make some changes in theme.css but which ones?

I'm using Focal theme.

Would really appreciate help 🙂

ThePrimeWeb · ‎02-17-2024

Hey @Thehumblelone,

No worries!

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.list-collections--carousel .list-collections__item-list {
    grid-auto-columns: 150px !important;
}
</style>

Screenshot is for reference only, the correct code to paste is the one shown above.

Was I helpful?

☕Buy me a coffee☕

❤ 🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

ThePrimeWeb · ‎02-17-2024

Hey @Thehumblelone,

Can you share the link to your store please? Also include the password if the store is password protected. (Or you can just disable it)

Was I helpful?

☕Buy me a coffee☕

❤ 🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

Thehumblelone · ‎02-17-2024

Wow ty for replying so fast.

Here's my store:
Brands In Less (551d65-2.myshopify.com)

ThePrimeWeb · ‎02-17-2024

Hey @Thehumblelone,

No worries!

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.list-collections--carousel .list-collections__item-list {
    grid-auto-columns: 150px !important;
}
</style>

Screenshot is for reference only, the correct code to paste is the one shown above.

Was I helpful?

☕Buy me a coffee☕

❤ 🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

Thehumblelone · ‎02-17-2024

Omg it worked! Thank you so much!!

How to make Collection List thumbnails really small on home page (Focal Theme)