The default site title and description texts have two variations. One for wider computer screens and one for narrows screens such as mobiles. The site title and description font text can be changed.

The default site title and description text.

A changed site title (description has not been changed).

Where and how to change the site title and description:

In WordPress Admin > Appearance > Edit CSS.

Enter the CSS code below.

The CSS code:

/* SITE TITLE */
/* Mobiles */
.site-title {
	font-family: Tahoma;
	font-size: 20px;
	text-transform: lowercase;
}

/* Computer screens */
@media screen and (min-width: 48em) {
.site-title {
	font-family: Tahoma;
	font-size: 40px;
	text-transform: lowercase;
	}
}

/* SITE DESCRIPTION */
/* Mobiles */
.site-description {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 15px;
	line-height: 17px;
	text-transform: lowercase;
}
 
/* Computer screens */
@media screen and (min-width: 48em) {
.site-description {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 22px;
	line-height: 26px;
	text-transform: lowercase;
	}
}
Bharat Karavadra

About Bharat Karavadra

"I research and share leading-edge information, tools and exercises to help people transform and heal their life situations."

3 Comments

  • Peter Reck says:

    FANTASTIC, Bharat!

  • Peter Reck says:

    1) AVAILABLE FONTS: The above CSS script example shows "Tahoma" as "font-family". Is there a list somewhere, that indicates all fonts that are supported through Twentyseventeen (or where is the source that features the various fonts?

    2) Will the above script also apply to the "Tagline" (also referred to as site-description)?

    Thank you!

    Peter

    • Peter,
      1) I do not know of a definitive list, however, there is a list of web safe font sets where you can use one font set that caters as best as possible for the variations of browsers and operating systems. You can see this list here https://www.w3schools.com/cssref/css_websafe_fonts.asp

      2) Yes, you can use similar CSS for the site-description. I have updated this post with an example that also uses the web-safe font set for Tahoma. Also note that I have changed the line-height (line spacing) for the site description.

      I hope that helps.

Comment, ask or share something...

Do NOT follow this link or you will be banned from the site!
%d bloggers like this: