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?
Hi Skylar
Do you have a URL I could take a look at to see exactly which header you’re trying to change?
Thanks for the quick response! It’s http://www.SkylarBader.com
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!
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/
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!
Sorry about that! The snippet to paste into Custom CSS should be:
/* Headline Widgets Font */ .widget_headline-widget h1 { text-transform: none; }Thank you! It worked! Now I feel like my webpage isn’t screaming at everybody ;)
Super, glad that helped.