WordPressテーマ「TwentySeventeen」のサイトタイトルが大文字にならないようにする方法

スポンサーリンク

「TwentySeventeen」のサイトタイトルが勝手に大文字になってしまう問題

「TwentySeventeen」サイトタイトルで英字スペルを使用している場合、全て自動で大文字に変換されてしまいます。
本サイトでいうと、サイトタイトルは「remember the milk」としているなずなのに、画面で確認すると下図のように表示されてしまいました。
自分の意図していない内容が表示されてしますと残念な気分になりますね。

「TwentySeventeen」のサイトタイトルを大文字にしない方法

ではどうやってサイトタイトルが自動で大文字になってしまわないようにするか。

style.cssを編集します。
style.cssはいわずもがな、WordPressの管理画面から簡単に修正することができます。

まずはsite-titleクラスを探しましょう。その中のtransformプロパティを「uppercase」から「none」に変更します。

.site-title {
clear: none;
font-size: 24px;
font-size: 1.5rem;
font-weight: 800;
line-height: 1.25;
letter-spacing: 0.08em;
margin: 0;
padding: 0;
text-transform:  none;
}

または、下記のようにコメントアウトしてしまうだけでもOK。

.site-title {
clear: none;
font-size: 24px;
font-size: 1.5rem;
font-weight: 800;
line-height: 1.25;
letter-spacing: 0.08em;
margin: 0;
padding: 0;
/*text-transform:    uppercase;*/
}

動作確認

サイト確認をすると…ちゃんと小文字のまま表示されていますね。

WordPressレッスンブック HTML5&CSS準拠

WordPressレッスンブック HTML5&CSS準拠

はじめてのブログをワードプレスで作るための本

はじめてのブログをワードプレスで作るための本

エンジニアのためのWordPress開発入門 (Engineer's Library)

エンジニアのためのWordPress開発入門 (Engineer’s Library)

  • 作者: 野島祐慈,菱川拓郎,杉田知至,細谷崇,枢木くっくる
  • 出版社/メーカー: 技術評論社
  • 発売日: 2017/01/26
  • メディア: 単行本(ソフトカバー)
  • この商品を含むブログを見る
タイトルとURLをコピーしました