Home>Support>How to change Vantage Header text from all caps

How to change Vantage Header text from all caps

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I’d like to change the default all caps in the header to normal text. I’ve looked and found how to adjust basically everything else about the header, but not that. How do I make this happen?

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 10 months ago Greg Priday
    Hi, I Work Here

    Hi Skylar

    Do you have a URL I could take a look at to see exactly which header you’re trying to change?

  2. 10 years, 10 months ago Skylar Bader

    Thanks for the quick response! It’s http://www.SkylarBader.com

  3. 10 years, 10 months ago Sreedhanya Shanmughan

    Hi, Could you please post how to do this on the support forum as well? I am trying to do the same, and can’t seem to find an answer! Thanks much!

  4. 10 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Hi everyone

    Skylar is using the Headline Widget at the link indicated. To change the Headline Widget’s first line from all caps to another variant you should insert the following under Appearance > Custom CSS (Vantage Premium) OR into your own Custom CSS module, my preference is the one bundled with the WordPress plugin, Jetpack:

    /* Headline Widgets Font */
    
    .widget_headline-widget h1 {
    font-variant: normal;
    }
    

    normal can also be swapped out with one of the following values:

    normal|small-caps|initial|inherit;

    Ref: http://www.w3schools.com/cssref/pr_font_font-variant.asp
    Ref: https://siteorigin.com/basics/modifying-theme-design-with-custom-css/

  5. 10 years, 10 months ago Skylar Bader

    I tried this and it didn’t work. I’ll outline the steps I took.

    I pasted into the Appearance > Custom CSS block. I wasn’t sure about the copying and pasting because of the black box around the text. Never encountered that before.
    /* Headline Widgets Font */

    .widget_headline-widget h1 {
    font-variant: normal;
    }

    I clicked Save. I checked my website, and the headline is still all-caps even a while later.

    I checked the reference page you linked to, and it says the change should go live once I clicked Save on the Custom CSS page. I left everything as is in the coding so that you can check it out on my page.

    I also tried replacing “normal” with “normal|small-caps|initial|inherit;” because I like the idea of small caps. But I wasn’t sure if I should use that entire string or whether those were several different options. (Oh, how I long for the days of Geocities when HTML was simple!)

    Thank you for your help!

  6. 10 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Sorry about that! The snippet to paste into Custom CSS should be:

    /* Headline Widgets Font */
    
    .widget_headline-widget h1 {
    text-transform: none;
    }
    
  7. 10 years, 10 months ago Skylar Bader

    Thank you! It worked! Now I feel like my webpage isn’t screaming at everybody ;)

  8. 10 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    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.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More