• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Header Font

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Header Font

This topic is: resolved

Tagged: executive pro, heading styles, titles

  • This topic has 4 replies, 2 voices, and was last updated 2 years, 7 months ago by marci.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 7, 2019 at 11:52 am #493896
    marci
    Participant

    How can I change the header styles such as font and sizes? It looks odd to me to have the
    titles and headers larger than my site name.

    I'm using Windows, Firefox, Executive pro theme

    http://driftlessprairies.org
    October 7, 2019 at 4:28 pm #493902
    marci
    Participant

    I found the style sheet for these but can someone help me to ensure I do the CSS correctly? I'm not sure I understand the font size in "rem" - can I change it to "pt"? And how would I underline or italicize? I'm not a designer.

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
    color: #333;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: 700;
    line-height: 1.25;
    margin: 0;
    margin-bottom: 10px;
    padding: 0;
    }

    h1 {
    font-size: 42px;
    font-size: 4.2rem;
    }

    h2 {
    font-size: 36px;
    font-size: 3.6rem;
    }

    h3 {
    font-size: 30px;
    font-size: 3rem;
    }

    h4 {
    font-size: 24px;
    font-size: 2.4rem;
    }

    h5 {
    font-size: 20px;
    font-size: 2rem;
    }

    h6 {
    font-size: 16px;
    font-size: 1.6rem;
    }

    October 8, 2019 at 3:17 pm #493931
    marci
    Participant

    Through this process, I *think* I've figured out that the post and page titles are NOT H1. Can someone help me with the CSS to change those as well? I'd like to make them smaller and use the same font as the headings (H1-H6) which I'd like to be Arial Narrow.

    October 8, 2019 at 6:21 pm #493932
    Anita
    Keymaster

    The title on your pages is called the ".entry-title" and wrapped in an H1. Look for this in your stylesheet.

    .entry-title {
        font-size: 42px;
        font-size: 4.2rem;
        line-height: 1;
        margin-bottom: 20px;
    }

    You would change both the "px" and the "rem" font sizes.

    You should learn how to use the Developer Tools in your browser so you can view and target specific areas. You'll be able to locate the code I just provided.

    Also as an FYI, Design Palette Pro works with your theme. If you do not wish to learn how to use the Dev Tools, you can purchase DPP and you will be able to change the fonts sizes, colors, etc., of your theme.


    Love coffee, chocolate and my Bella!

    October 9, 2019 at 7:37 am #493940
    marci
    Participant

    Thanks. I can "inspect" but I don't always understand what I'm looking at. I had a couple classes many years ago.

    I'm not sure how I would have have known H1 was wrapped in the title. It was more confusing that the theme editor would show an H1. I *think* I'm learning that I should "inspect" rather than look in the theme editor.

    I would love to learn how to use Dev Tools. Is that a self learning thing or is there a class? I appreciate the DPP suggestion. I see where I can easily change the title but haven't found the other heading adjustments.

    I'm not a designer. I'm a restoration practitioner wanting a nice looking website to help other landowners understand complex and complicated processes. I make no money off this site, the site is solely for educational purposes and my work is 100% volunteer.

    I really appreciate your help.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Header Font’ is closed to new replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2022 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble