Dawn theme - collection title size issue how to make it smaller?

[lslelegance]

dawn theme - Shopify collection titles size issue how to make it smaller ? @oscprofessional

[Alexander-MAS]

@lslelegance You can do it from the theme “Edit code” area: https://prnt.sc/DP9QdZgM34G1

Going this way you need to open the CSS asset file called “component-collection-hero.css”.

In the opened asset kindly find the CSS rule called “.collection-hero__title”.

For the found CSS rule add the new line of code “font-size: 25px”, where “25px” is your value of the new Font size.

Here is the result that you have to reach out:

[deejayyy33]

Hi @Alexander-MAS these steps worked great for Desktop version, but how can I change the size of these collection page headings on Mobile version?

Also, could you please advise on steps to change /page headings also on both Desktop & Mobile, without interfering with any other H1 headings across the website?

I appreciate your assistance

[Alexander-MAS]

Hi @deejayyy33
Sure, here you go:

1. To change the font size for Collection page title for Mobile layout, kindly use the next one CSS rule:

@media screen and (max-width: 749px) {
  .collection-hero__title {
    font-size: 18px;
  }
}

You can past it right after the main CSS rule of the Collection title:

2. To change Title for Page templates you should open the “section-main-page.css” asset and find the CSS selectors called “.main-page-title”. These are selectors that you can use to past your Font size CSS rule, for example:

The first one “.main-page-title” selector will works for Mobile layout, and the second one will do the job for Desktop version.

Let me know if you have further questions.

[deejayyy33]

Thanks so much @Alexander-MAS this worked perfectly!