Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #76180
    Chantal
    Participant
    Premium Member

    How can I change the font of headers on product pages? Ashe shows a different font for H2 headers on woocommerce product pages then other (blog) pages. See example: https://www.chelise.nl/webshop/winter-speurtocht/.

    I don’t like this font because it’s hard to read. I would like it to be the same as the headers on my other pages. For example: https://www.chelise.nl/doelen-bereiken/. What is also weird, is that H3 headers look different then H2 headers. It’s not uniform (much bigger, different font). It doesn’t look good on a product page.

    But I can’t find a way to change the font. There’s no option in the customizer menu. Please advice.

     

    #76182
    vako
    Keymaster
    WP Royal Team

    Hi Chantal,

     

    Sorry for the late reply we have been on holidays

    To be honest we cant find the differences when we load your website, as you can see from this screenshot: https://prnt.sc/1BWgMxgQPlio all heading fonts have the same Font Family there is only a difference in font size.

    Kind Regards

    #76183
    Chantal
    Participant
    Premium Member

    Hi Vako,

    I think there´s a misunderstanding. I mean the H2 header on a product page. See screenshot:

    #76184
    vako
    Keymaster
    WP Royal Team

    Hi Chantal,

     

    Now we see it more clearly! There is 1 major difference the h2 title on the product page is uppercase and on the post page is capitalized, so this difference makes feeling that they are different fonts when they are the same. In the screenshot below, we will remove an uppercase style from the h2 title on the product page and you can see they are the same: https://prnt.sc/Ufmmkz5xGGkE

    Kind Regards

    #76185
    Chantal
    Participant
    Premium Member

    Hi Vako,

    Yes I understand it is uppercase, but how do I change this? In the backend there is no uppercase. The theme automatically displays an uppercase “font”. I don’t like it. Is there a way to change the settings?

    #76187
    vako
    Keymaster
    WP Royal Team

    Hi Chantal,

     

    Please navigate to Dashboard > Appearance > Customize > Additional CSS and add the CSS snippet below:

    .woocommerce div.product .woocommerce-tabs .panel > h2 {

    text-transform: capitalize !important;

    }

    Kind Regards

    #76188
    Chantal
    Participant
    Premium Member

    Hi Vako

    Thank you. The uppercase is now gone, but still the headers don´t look the same. They are much smaller. And also every word starts with a capital now. For example: https://www.chelise.nl/webshop/babyshower-invulkaarten-blauw/?

    #76197
    Chantal
    Participant
    Premium Member
    #76198
    vako
    Keymaster
    WP Royal Team

    Hi Chantal,

     

    Please navigate to Dashboard > Appearance > Customize > Additional CSS and add the CSS snippet below:

    h2 {

    text-transform: capitalize !important;

    font-size: 36px !important;

    }

    Kind Regards

Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.