How can I modify the font headings in the Dawn Theme?

I have a couple of questions..

How do i change the color of just the font headings?

How do I change the page name/heading… (see image below)

  • size

  • color

  • position

  • spacing

Hi @inspirea

Would you mind sharing your store’s URL so we can provide a solution for that?

Thanks!

It’s a client’s site and still in development so not able to.

@inspirea

Please share your store URL and if your store id password protected

then also provide password .

Thanks!

It’s a client’s site and still in development so not able to.

i am also facing thi same issue on my website Brands For less

You can change it in your section-main-page.css file.

You need to edit the .main-page-title, here’s an example:

.main-page-title {
  margin-bottom: 1.5rem;
  color: darkblue;
  text-align: center;
  font-size: 28px;
}

Now you can play around with the values. Just note that there’s a media query in there that changes the spacing on the bottom when a screen is bigger than 750px, you could also change that to suit your needs :slightly_smiling_face:

Where do I put this code exactly? I’m new to using code.

@kajderuyter

Where do I put this code exactly? I’m new to using code.

Go to Online Store > Actions > Edit code, then search for section-main-page.css. Open the file, and then you can enter the code like so:

If you don’t know what values to use for the margin, color, text-align, font size, or if you just want to edit something else, google “CSS margin” for instance. You’ll find plenty of info about CSS styling online.

ok tried looking up margins , but not sure what to use…

See image below

Need more space above the About Me and less space under it…

@kajderuyter

ok tried looking up margins , but not sure what to use…

See image below

Need more space above the About Me and less space under it…

Try to lower the margin-bottom. I believe it is 1.5rem now, try to change that to something like 20px (margin-bottom: 20px) and then play around with it to get to how you want it. If it’s too much, lower it by ±4px, if the margin’s too little, up it by ±4px until you have the desired result. Same for margin-top, start with a margin-top: 16px and play with that until you like it. Hope this helps :slightly_smiling_face:

@kajderuyter

I was able to adjust the top margin but the bottom (under the About Us) won’t change even when i put in different values.. see below

If you go to Online store > Themes > Customize, select pages in the top bar, on the left you should see a “Page” section in the menu. If you click that you should be able to change the top and bottom padding. Let me know if that works for you :slightly_smiling_face:

@kajderuyter

Yes that worked.

Still need help with changing the color of the font headings…

and navigations links are white when you’re on that particular page… want to change that color also…