MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。
WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。


小文字で入力したタグやタイトルが大文字になる謎

さて、SyntaxHighlighter Evolvedも導入したことですし、ようやくCSSでのカスタマイズに触れることができます。

まず、「小文字で入力したタイトルやタグ、作者が勝手に大文字にされちゃってる問題!」です。

icons-css

タイトル・作者(analytics root-013)
title

タグ(google)
tag

「どうせWordPressの仕様とか、PHPのせいなんでしょ?」

そんなふうに考えていた時期が僕にもありました・・・

しかし、実はテーマの中のstyle.cssで決められていたんですね。
テーマをカスタマイズすることの方が多いので最初は気がつきませんでした。

ちょっと、タイトル部分を
右クリック>要素を検証
から、Developer Tool で確認してみましょう。
FireFoxならFireBug、IEなら開発者ツール(F12)で確認できます。

僕はクローム派です。google chrome 万歳。
シークレットウィンドウも何気に便利!

tool

すると、.entry-titleのCSSが表示されます。

tool2

犯人は貴方です。text-transformさん。
(ここのサイトはHTMLの勉強を始めたときに大変お世話になりました。とてもいいサイトです。HTMLもCSSも実例つきで解説されています。)

さて、ChromeのDeveloper ToolでCSSの数値やプロパティをクリックすると、直接入力して変更できるわけですが、

tool4

今回は追加でいきます。
一番したのプロパティの右端をクリックすると、
新規プロパティを追加することができます。
しかもコード入力支援付きです。

tool3

ついでにline-heightもちょっと広くしたかったので

 text-transform: none;
 line-height: 1.5;

を追加しました。

で、.entry-title { }をぐぐーっとドラッグしてください。そしてCtrl+C コピー!

tool5

あとは、子テーマなり拡張CSSなりに、Ctrl+V ペースト!!

tool6

そして余分なプロパティを削除します。

tool7

クラス指定を手打ちで間違えることもないし、僕は大概この方法でカスタマイズ作業してますね。
慣れすぎちゃってDreamWeaverが使いにくくなっちゃったくらいです。
(コード支援の感覚がびみょーに違う)

タグも、作成者も、同じ方法でいけるかと思います。
以上!

「小文字で入力したタイトルやタグ、作者が勝手に大文字にされちゃってる問題!」でした!

このようなWordPressの質問はこちらに書き込んでもらえればなにかアドバイスができるかもしれません。初心者歓迎ですのでお気軽に。

WordPressに関する無料相談はこちらから掲示板にコメントをしてください。
WordPress無料相談 質問を受付中です。

おすすめコンテンツ

“小文字で入力したタグやタイトルが大文字になる謎” への2件の返信

  1. はじめまして。最近Wordpressを始めたばかりの超初心者です。cssもほとんどよく分かっていない状況ながら、なんとか色々と設定をしてサイトをカスタマイズしていたのですが、どうしても大文字になってしまう問題(しかも右側の再度ウェジェット部分だけ)をどうしても解決できずに数日もやもやしていました。他のサイト様の情報も私には当てはまらず、もうあきらめるしかないかもと思っていたところに、root-013様のこちらの記事を読ませていただき、見よう見まねでやってみたところ、問題が解決しました!!本当に、感謝しております。ありがとうございました。

    1. RiSさま
      コメントありがとうございます!自分も手探りから始めたので、同じような方のお役に立てたのは嬉しいです^^
      自分もまだまだですが、HTML CSS PHP と勉強していくと、もっと色々なことができるようになると思いますよ!

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA