How do I change "Category Title" Font Size?

Site URL: https://www.d-timepieces.com/

Hi, can someone advise on how do I change the font size of my category title? On my site, the category title font sizes are too big and becomes two lines on mobile. How do I change the font size? Specifically the world "timepieces" for reference. Thank you!

Add to Home > Design > Custom CSS

/* Shop title */
@media screen and (max-width:767px) {
h3.nested-category-title {
    font-size: 40px !important;
}
}

I tried this and it didn't work. My category title in my store are huge.

44 minutes ago, mguz said:

I tried this and it didn't work. My category title in my store are huge.

Can you share link to store page? WE can check easier.

The site isn't live yet... here is a screenshot.

Hi,
Need to check on your site, live!

Please share the password protected URL of it.

Please use the like button if it helps you!

Best,
Leopold

The site is live now. Here you go https://www.artbymga.com/shop/sky-above-us3

6 hours ago, mguz said:

The site is live now. Here you go https://www.artbymga.com/shop/sky-above-us3

Hi

Use this code in Design -> Custom CSS

@media screen and (min-width:678px){
    h3.nested-category-title.nested-category-title-padding {
    font-size: 40px !important;
}
}

@media screen and (max-width:677px){
    h3.nested-category-title.nested-category-title-padding {
    font-size: 20px !important;
}
}

Please use the like button if it helps you!

Best,
Leopold

Thank you! That worked for all the categories. However, the parent category title "Shop" is still large. Is there a way to make it smaller, or hide the category title on just that page?  https://www.artbymga.com/shop

Thank you!!

You are welcome!

Use this code in Design -> Custom CSS

@media screen and (min-width:678px){
    .tweak-products-width-inset .products.collection-content-wrapper h3.nested-category-title {
    font-size: 40px !important;
}
}

@media screen and (max-width:677px){
    .tweak-products-width-inset .products.collection-content-wrapper h3.nested-category-title {
    font-size: 20px !important;
}
}

Please use the like button if it helps you!

Best,
Leopold

Thank you!! Worked perfectly.

Hi there (if someone's still here 🙂

I'm having a similar issue and the code is not working on my website. Can anyone help me please? 

https://www.onelovelash.com/strip-lashes-1
Code: Onelovelash2020

On 12/1/2020 at 2:42 AM, marionlesso said:

Hi there (if someone's still here 🙂

I'm having a similar issue and the code is not working on my website. Can anyone help me please? 

https://www.onelovelash.com/strip-lashes-1
Code: Onelovelash2020

Where is category title?

On 9/10/2020 at 6:10 PM, IXStudio said:

You are welcome!

Use this code in Design -> Custom CSS

@media screen and (min-width:678px){
    .tweak-products-width-inset .products.collection-content-wrapper h3.nested-category-title {
    font-size: 40px !important;
}
}

@media screen and (max-width:677px){
    .tweak-products-width-inset .products.collection-content-wrapper h3.nested-category-title {
    font-size: 20px !important;
}
}

Please use the like button if it helps you!

Best,
Leopold

@IXStudio
Hej from Sweden 🙂

I have the same problem but on the blog, I used the code that you wrote but it doesn't work, I guess because the code is for product not blog. Do you know how can I fix it?

17 hours ago, shirazdaryan said:

@IXStudio
Hej from Sweden 🙂

I have the same problem but on the blog, I used the code that you wrote but it doesn't work, I guess because the code is for product not blog. Do you know how can I fix it?

Hi dear,
Please share your website URL.

Best,
Leopold

10 hours ago, IXStudio said:

Hi dear,
Please share your website URL.

Best,
Leopold

you meant this url?
https://www.shirazanddaryan.com/blog-4

19 hours ago, shirazdaryan said:

you meant this url?
https://www.shirazanddaryan.com/blog-4

Add to Design > Custom CSS

/* blog category size */
span.blog-categories-list * {
    font-size: 30px !important;
}

21 hours ago, tuanphan said:

Add to Design > Custom CSS

/* blog category size */
span.blog-categories-list * {
    font-size: 30px !important;
}

 

Thanks, I did that but still doesn't work, also my custom font stopped working.

/* blog category size */
span.blog-categories-list * {
    font-size: 30px !important;
}

@font-face {
    font-family: 'MADEMirage-Thin';
       src: url('https://static1.squarespace.com/static/5e20661b8a7f147d7be64d9e/t/5fdb14fe3ef1ef746ce2f2b7/1608193278855/MADEMirage-Thin.otf');
  }

h1,h2,h3,h4 {font-family: 'MADEMirage-Thin';}

https://static1.squarespace.com/static/5e20661b8a7f147d7be64d9e/t/5ff888f378fe271191a8dc12/1610123507042/sign.png

Remove last line (link) in your code. 

On 1/17/2021 at 9:03 AM, tuanphan said:

Remove last line (link) in your code. 

still doesn't work. categories font size doesn't change, it's strange

span.blog-categories-list * {
    font-size: 30px !important;
}

sorry, I don't understand it, do you know why the code doesn't work?

Does anybody else know what is the problem?

span.blog-categories-list * {
    font-size: 30px !important;
}

On 1/22/2021 at 5:28 PM, shirazdaryan said:

sorry, I don't understand it, do you know why the code doesn't work?

Does anybody else know what is the problem?

span.blog-categories-list * {
    font-size: 30px !important;
}

Try adding to Code Injection > Header

<style>
  span.blog-categories-list * {
    font-size: 30px !important;
}
</style>

How do I make this title preferably H1 combined with body or just H1 size:

2 hours ago, michaell said:

How do I make this title preferably H1 combined with body or just H1 size:

Try adding this to Design > Custom CSS

div.list-section-title p {
    font-size: 50px !important;
}