How can I make collection titles smaller on my Flex theme version 5.0.1?

I would love some help with making these collection titles on my homepage smaller please. I am just updating my Flex theme to the 5.0.1 version. Thankyou for any help.

Hi @MrsMacca

Please share your store URL please

https://funfidgets.com.au

The current live is the 2.2.2 Flex version, which has the titles the size I would like them to be on my unpublished 5.0.1 version

HI @MrsMacca

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file styles.css

Step 3: Paste the below code at bottom of the file → Save

.jsCollectionList span.title {

font-size: 16px !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please share the preview URL of theunpublished theme

https://rcy45jhi7abru027-59310047402.shopifypreview.com

Thankyou

Go to Online store > Themes > click three dots button on that theme > Edit code > open theme.liquid file, add this code below under element


is this correct? Unfortunately it didnt work

1 Like

That is correct, and this code is made for mobile only. If you want it works for desktop, please update code to this


This worked perfect. Thankyou so much for your help.

1 Like

You are very welcome, @MrsMacca

@PageFly-Henry Im having this issue on mobile view (huge collection photos…is there a way I can increase the number of collection images per line or make them smaller? My site is www.disappearhere.org

Im happy to donate to anyone that can help

You can try with this code:

@media (max-width: 767px){
.collection-list__item.grid__item {
max-width: calc(32% - var(–grid-mobile-horizontal-spacing) / 2) !important;
}}

Thanks for your reply @PageFly-Henry where abouts would I post this in the Spotlight code? I looked for a styles.css as in the previous advice above and there was no such section. TIA