Website Theme Customizer

  1. Home
  2. Support
  3. Website Theme Customizer
  4. Typography – Set the Font Styling for Text Shown on the Website
  5. Customizing the Website Page Title Text Typography

Customizing the Website Page Title Text Typography

Using these options, you can configure the typography for the page titles site-wide. Either you want to stand out your page titles with a better font, increased font size or anything else. You get a variety of options to enhance your page titles to better suit your website.

Navigate to your website admin, browse to Appearance > Customize > Typography> Page Title.

Set the Font for the Page Title

If you want to use a custom font for the page title, you can choose one from the dozens of standard and Google fonts. You will definitely find one that looks perfect for your page title.

Just click over the drop-down menu underneath the “Font Family” in Page Title panel and choose your desired font.

Set the Font Weights for the Page Title

Font weight will either make your page title text to look bold or thin. Not every font supports all the font weights but does support a few mostly.

Technically speaking, font weight is an HTML property that accepts numbers, usually from 100 to 900 with an increment of 100 in between each, 100 being thinnest and 900 being the boldest.

These are the options you get to set the font weight.

Thin: 100

Light: 200

Book: 300

Normal: 400

Medium: 500

Semibold: 600

Bold: 700

Extrabold: 800

Black: 900

Just click over the drop-down menu underneath “Font Weight” label in Page Title panel and choose your desired font weight.

Set the Font Styles for the Page Title

You can either make your page title text to follow a normal or an italic style. To do so, just click over the drop-down right beneath the “Font Style” label in Page Title panel and choose your desired setting.

Transforming Text for Page Title

You can choose any of these four options. In case of a page title, some of these options may only look good in some fonts. For example, a page title in Capitalize text using Arial font will probably not look good as other possible configurations. So use your best judgment and live preview to see what works best for your page title.

  • Capitalize
    • It capitalizes the first letter of each word.
  • Lowercase
    • It converts all the letters to lowercase
  • Uppercase
    • It converts all the letters to uppercase
  • None
    • It doesn’t do anything, keeps your text as it is just the way you have written it.

Just browse the drop-down underneath “Text Transform” label in Page Title panel and select a suitable setting.

Changing the Font Size in Pixels for the Page Title

You can easily use the slider under the “Font Size (px)” label inside the Page Title panel to increase or decrease the text size.

You can choose to keep different font sizes for the desktop, tablet, and mobile. Simply click over the small gray color icon next to the label; it will expand it into three icons. First one is for the desktop font size, second for the tablet font size, and third for the mobile font size. 

To Set a Line Height for the Page Title

The Page Title line height is the vertical space between two-page title text lines.

You can use the slider under the “Line Height” label in Page Title panel to make the changes.

You may not have two lines, but if you have a background you will still notice the line height in the theme customizer preview. As essentially the line height increases the top and bottom padding.

You can choose to keep different line height for the desktop, tablet, and mobile just the way you have set under the “Font Size (px)” configuration above.

Set the Letter Spacing for Page Title

With letter spacing feature for your Page Title, you can increase or decrease the space in between letters of the page title.

You can easily use the slider under the “Letter Spacing (px)” label in Page Title panel to make changes to the letter spacing. You also get to choose different letter spacing for the desktop, tablet, and mobile as discussed under Font Size feature above.

Something missing? Contact us
Was this article helpful to you? Yes No

How can we help?