Heading small letters

Support
#1

Hi there,
I can’t seem to change the letters in the headings to small ltters? Can you please help me?
Thanks in advance!

#2

Hi there,

Do you mean you want to set the headline element texts to small caps?

If so, please set the Text Transform option to lowercase.

Hope this helps.

#3

Thank you, but I meant in the customizer, I want all headings to be in small caps throughout the site. How do I do that?:slight_smile:

#4

Hi there,

The only option available in the Theme Options setting is to make the headlines uppercase but you can add a custom CSS to set them to small caps instead.

Please try this code in the Global CSS:

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    text-transform: lowercase;
}

Hope this helps.

#5

Hi again, thank you but Iwould need the first letter to be uppercase, sorry if I was unclear…
Also another question, I am trying to add spacing in the headings in the customizer but it doesn’t seem to wanna take it? And also I would need less space between the lines in the body text, can you please help me?

#6

Hello @AnneLiljenberg,

Thanks for updating the thread. :slight_smile:

Please replace the CSS with following to make first letter Uppercase.

h1:first-letter {text-transform: capitalize !important;}

I would like to share that to make above changes I took help of Google Chrome dev tools. If you would like to get started with Chrome dev tools, please take a look at following resources:

Please note that in above codes I used text-transform and :first-letter element property. To learn more about text-transform and :first-letter element, please take a look at following tutorial.

https://www.w3schools.com/cssref/pr_text_text-transform.asp

If you would like to learn CSS, please watch following YouTube video.

Thanks.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.