Change font size for each page tilte and product title

Store Design
,
1

hi guys, would like to check with you guys if any of you could help me with the font size for my new theme that I am developing.

I wanted to change font size for all pages (including blog page title, collection page title and also normal pages)

is there any way I could change all to the same font size 30px?

I have tried to use this code below but it seems to only change the title page for the normal ones, but not build-in pages.

h1.main-page-title.page-title.h0 {

font-size: 30px;

}

Also, is it possible to change the product title font size too?

here’s my link

Your Weekend Outfit – sundaysfit

thank you.

1 Like
2

Hi @jasonthegrammy

Try this one.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.section-header.text-center h1 {
    font-size: 30px !important;
}
.h4.grid-view-item__title {
    font-size: 20px;
}
1 Like
3

Hi Sir,

apologies, I think I need to show you what i meant by title page is below.

jasonthegrammy_0-1697730381786.png
jasonthegrammy_0-1697730381786.png1135×630 56.1 KB

Also, the product title is this one

jasonthegrammy_1-1697730423698.png
jasonthegrammy_1-1697730423698.png1673×885 239 KB

Thank you sir.

1 Like
4

Oh Sorry, Im correct on the first code. But not on the 2nd thinking for collection product title. dTry this one then.

Same Instruction.

div#ProductSection-product-template h1.product-single__title {
    font-size: 30px !important;
}
.section-header.text-center h1 {
    font-size: 30px !important;
}

And Save.

Result:

Made4uoRibe_0-1697731668852.png
Made4uoRibe_0-1697731668852.png561×294 22.8 KB

Made4uoRibe_1-1697731705828.png
Made4uoRibe_1-1697731705828.png493×272 6.22 KB

I size it all 30px.

1 Like
5

Hi sir, not sure if its my website problem or its because I haven’t launch it, but it seems like the title and product title are still the same color even after I’ve pasted the code.

Screenshot below is from the draft theme.

jasonthegrammy_0-1697733585308.png
jasonthegrammy_0-1697733585308.png774×284 7.34 KB

6

Im confused now, color or size you like to change? Please dont forget to save and refresh after. Thanks!

1 Like
7

Apologies, I meant to say ‘size’ hahah it works on my current theme but it’s not working on drafted theme, but that’s alright! thank you sir!

1 Like
8

Good the hear, Make it a habit when you edit something in your store dont forget to save and refresh from theme to preview. So you will get the proper result. Happy weekend!

9

Hi sir, good day to you.

are you able to help me look at the link below and help me with the above enquiries too (title font and product font) ? this is for different theme.

https://64hnhyvny6zo86yk-51731890328.shopifypreview.com

10

Here’s the updated link sir

Your Weekend Outfit – sundaysfit