WordPress.org

Ready to get started?Download WordPress

Forums

Preference Lite
Font size of the post's title (4 posts)

  1. akinom269
    Member
    Posted 9 months ago #

    Hello,
    I have a big problem with changing the size of post's title. I'm guessing I should change something here but I have no idea what:

    h1.entry-title {
    	margin-bottom:40px;
    	line-height: 28px;
    	line-height: 1.750rem;
    }
    h1.entry-title a,
    h1.intro-title a {
    	display:block;
    	min-height:22px;
    }
    h1.intro-title {
    	font-size:20px;
    		font-size:1.250rem;
    	line-height:22px;
    		line-height:1.375rem;
    }
  2. StyledThemes
    Member
    Theme Author

    Posted 9 months ago #

    The last part will be the one... h1.intro-title, and as you can see, there are two font sizes:

    1. px
    2. rem

    The rem will override the px value for modern browsers, but older browsers that cannot understand the rem one will fallback to use the px. Both are the same in font size though.

    You can remove the rem line if you prefer to work only with px, but to know what conversion is for a px font size, this online tool is great: http://www.pxtoem.com (rem is very similar to em).

  3. akinom269
    Member
    Posted 9 months ago #

    Thank you so much! I tried to change only the font size in px and nothing happened.
    Now, I have a diffrent problem. I want to change the color of the title of pages. When I'm opening one of them I can see the title on the top. I tried to change the color #333 to diferent one but it's not working :( I'm guessing it is h1.
    Could you be so kind and help me again?
    This is the typography code:

    p {
    	margin-bottom:20px;
    		margin-bottom: 1.250rem;
    }
    h1, h2, h3, h4, h5, h6{
    	font-family: open_sans, sans-serif;
    	font-weight:400;
    	color:#333;
    	margin-bottom:16px;
    		margin-bottom:1rem;
    }
    h4, h5, h6 {
    	margin-bottom:11px;
    		margin-bottom:0.688rem;
    }
    h1 {
    	font-size:32px;
    		font-size:2.000rem;
    text-decoration: underline;
    font-variant: small-caps;
    background-color: #f5e4ab;
    text-align: center;
    letter-spacing: 1.4pt;
    }
    h2 {
    	font-size:21px;
    		font-size:1.313rem;
    }
    h3 {
    	font-size:18px;
    		font-size:1.125rem;
    }
    h4 {
    	font-size:16px;
    		font-size:1rem;
    }
    h5 {
    	font-size:14px;
    		font-size: 0.875rem;
    }
    h6 {
    	font-size:12px;
    		font-size: 0.750rem;
    }
    h1.entry-title {
    	margin-bottom:40px;
    	line-height: 28px;
    	line-height: 1.750rem;
    }
    h1.entry-title a,
    h1.intro-title a {
    	display:block;
    	min-height:22px;
    }
    h1.intro-title {
    	font-size:30px;
    		font-size:1.875rem;
    	line-height:22px;
    		line-height:1.375rem;
    }
    
    aside h3 {
    	font-size:16px;
    		font-size:1rem;
    }
    aside h4{
    	font-size:14px;
    		font-size: 0.875rem;
    }
    #footer-wrapper aside h4 {
    	color:#fff;
    }
    
    h1.entry-title-status,
    h2.status-date {
    	margin-bottom:8px;
    }
  4. StyledThemes
    Member
    Theme Author

    Posted 9 months ago #

    The best recommended way of doing all this is not to edit the theme files (style.css) but to use a child theme (which is included in this theme in a folder called "child-theme" that you can install and then you can override the font sizes for the above selectors (h1, h2, h3, etc.). If you have jetpack installed, you can even do it with the Edit CSS that comes with it.

    Colours are done from the theme options (customizer) which should handle your needs. If something is not there, then again, you can use the child theme to edit. I recommend you read up on why and how to use a child theme for theme modifications:

    http://codex.wordpress.org/Child_Themes

Reply

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.