This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Font Size and Color Change

Resolved 10 replies themetheme-vantage
chemdata
11 years ago · Last reply by Andrew Misplon 11 years ago

I was trying to change the color and font size of the pages. Your documentation stated “Select the font style, size and color by navigating to Fonts.” However, I could not locate the Fonts part after Appearance > Customize >.

I then added the following to the style.css file in my vantage-child theme with no luck also.

/* Consistent fonts across all elements */
body,button,input,select,textarea{
color:#ff0000;
font-family:Arial;
font-family:"Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
line-height:1.5em;
font-size:18px;
word-wrap:break-word;
}

What do you advise. Thanks.

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

10
  1. Andrew Misplon Staff 11 years, 6 months ago

    Hi

    The expanded Customizer options discussed in the documentation are a part of Vantage Premium. You can upgrade for as little as $5. To view the offering head to Appearance > Premium Upgrade.

    If you’d like to stick to Vantage Free here are the selectors you can target:

    /* Body */
body,button,input,select,textarea {
	font-family: Arial, “Helvetica Neue”, Helvetica, sans-serif !important;
}
/* Site Title Font */
header#masthead h1 { 
	font-family: Arial, “Helvetica Neue”, Helvetica, sans-serif !important;
}
/* Heading Font */
h1,h2,h3,h4,h5,h6 { 
	font-family: Arial, “Helvetica Neue”, Helvetica, sans-serif !important;
}
  2. chemdata 11 years, 6 months ago

    Thanks. I added the suggested code to the vantage-child style.css file as follows:

    /* Body */
body,button,input,select,textarea {
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
	color:#000ff;
	font-size:13px;
}
/* Site Title Font */
header#masthead h1 { 
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
	color:#0000ff;
	font-size:13px;
}
/* Heading Font */
h1,h2,h3,h4,h5,h6 { 
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
	color:#0000ff;
	font-size:13px;
}

    However the only one that changed font color was header#masthead h1. The other two kept the font color as it was.

  3. Andrew Misplon Staff 11 years, 6 months ago

    Try using !important for the color and font-size properties too.

  4. chemdata 11 years, 6 months ago

    Andrew thanks again. Adding the !important corrected the problem.

  5. chemdata 11 years, 6 months ago

    I guess I spoke to soon. It corrected the font size problem but not the color as the text in the body of the page did not change.

  6. Andrew Misplon Staff 11 years, 6 months ago

    Please send through a link and I’ll take a look.

  7. chemdata 11 years, 6 months ago

    Here is link to test site:
    http://deadplanetpublishing.com/vantage/

  8. Andrew Misplon Staff 11 years, 6 months ago

    Add this, should resolve:

    .entry-content {
color: #666666 !important;
}
  9. chemdata 11 years, 6 months ago

    Andrew you nailed it. That did the trick. Thank you very much!!!

  10. Andrew Misplon Staff 11 years, 6 months ago

    Super, glad that helped.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread