Solved

how to change product title size in a collection

rachelouizemann
Tourist
4 0 0

Hi there,

I would like to change the products title size to a smaller size on the collection page (not on the product page).

It seems as though their size is connected to the header of the shop, and every time I change the size there then it changes the size of the product header (Typography, Heading base size). I would like the shop header to be big and the products' titles to be smaller. I am using the debut theme.

I tried different solutions and coding I found here, but they do not work. I tried these ones:

https://community.shopify.com/c/Technical-Q-A/How-to-change-the-size-of-the-product-titles-font-disp...

https://community.shopify.com/c/Shopify-Design/How-to-change-product-title-font-size-and-page-title-...

I already have this:

/* make product page product name heading a bit smaller */
.template-product h1.product-single__title {
font-size: 1em;
}

but it only changes the size of the title of the product when clicking on it, and not in the collection. 

(btw, I cannot find any theme.scss.liquid, only theme.css)

 

Please help 🙂

Thanks

Rachel

 

Accepted Solution (1)
Hardik29418
Shopify Partner
2858 407 1073

This is an accepted solution.

Please place this code at the end of Online store -> theme -> edit code -> assets -> theme.scss file

 

#shopify-section-collection .product-card__title, #shopify-section-collection-template  .product-card__title {
    font-size: 16px !important;
}

 

 

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email

View solution in original post

Replies 13 (13)

Hardik29418
Shopify Partner
2858 407 1073

Please provide your website url and if your website is password protected then also provide password

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
rachelouizemann
Tourist
4 0 0

Thank you for responding! should I send these details via Email? especially the password...

Hardik29418
Shopify Partner
2858 407 1073

You can share here also. No any risk. if you are not comfortable, then you can email me on parambabla.soft@gmail.com

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
rachelouizemann
Tourist
4 0 0

ok then, my url is https://rachel-ouizemann.com/ and the password is euyeot. 

Thank you,

Rachel

Hardik29418
Shopify Partner
2858 407 1073

This is an accepted solution.

Please place this code at the end of Online store -> theme -> edit code -> assets -> theme.scss file

 

#shopify-section-collection .product-card__title, #shopify-section-collection-template  .product-card__title {
    font-size: 16px !important;
}

 

 

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
rachelouizemann
Tourist
4 0 0

worked like a charm! Thank you very much!

RSS
Explorer
55 0 23

Hey @Hardik29418 

I'm also trying to achieve the same solution but for the title of the page instead. If the title of the page can be smaller and further down slightly from the navigation header (it is too close to the navigation atm). Can you please help?

Hardik29418
Shopify Partner
2858 407 1073

@RSS 

Welcome to the Shopify Community.
I read your problem and it seems that I need to analyze your website to provide the solution here.
Would you please share your website URL and if your website is password protected then also provide the password.

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
LUK1
Visitor
1 0 0

I tried to changed the title font size on my products (debut theme) and I can't. Can somebody help me with this?

 

Hardik29418
Shopify Partner
2858 407 1073

@LUK1 

Welcome to the Shopify Community.
I read your problem and it seems that I need to analyze your website to provide the solution here.
Would you please share your website URL and if your website is password protected then also provide the password.

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
SANDRASUN
Visitor
1 0 0

Hi there, 

I would like to change the product title size to smaller size, it's too big. Also to be changed when in the product page, I do not want it to be as big as the title of the website. 

Let me know if I can change it and if you can help

www.afterlifemode.com

 

Thanks so much in advance

Sandra 

AsimTalim
New Member
4 0 0

hi there 🙂

 

do you know how i would do the same using the Craft 12.0.0 theme? 

theme.scss is unavailable

 

thanks very much!

juliamaxmax
New Member
11 0 0

there is no such thing there. There is no theme.scss inside assets
what to talk about next?!
non-working material. I can't solve this issue, it's impossible to work