今回解説していく内容は以下です!
本記事の内容
・固定ページのタイトル非表示
・番外編:CSSで非表示にする方法
WordPressのPHP編集
WordPressのPHP編集はレンタルサーバーのファイルマネージャー、もしくはWordPressの画面より編集します。WordPressで編集する場合は 外観 < テーマエディター < ○○.php を指定してコードを書き換えます!基本的に、このWordPressの画面よりPHP編集は行うようにしてみてください!
PHPの書き間違いで大変なことに?
ずっと前のWordPressは、「PHP」を間違った構文で書いてしまっても保存ができてしまい…自分のWebサイトが表示されなくなってしまった。みたいな恐ろしい経験もたくさんしてきました。現在のWordPress5.0だと、構文が間違っていたらエラーで保存ができなくなっているため安心して書き込む事ができます。
要は初心者がPHPを間違って壊すことがなくなったという事
安心して作業できますよね!
固定ページのタイトル非表示
では、実際に固定ページを編集していきますがその前に一点だけ確認しないといけない事がありました!WordPressのテーマによっては、コードが異なってくるので事前にどういう HTML で タイトルが表示されているのか確認してみましょう!
タイトルが表示されているHTMLを確認
PHPを確認し、非表示に…
外観 < テーマエディター < content-page.php より先ほどの <h1>でclass名が entry-titleになっているものを探せばOKです!
HTMLを非表示にするために、今回は <!– –> でコメントにしてしまいます。※完全に消すわけではありません。
覚えておくと便利なのですが、これにもショートカットキーが存在しエディター上で ⌘ command + /を打ち込んでみてください。コメントアウトできるはずです!
<!--<h1 class="entry-title" itemprop="headline"> <?php if (is_wpforo_plugin_page()) { echo wp_get_document_title(); } else { the_title(); } ?> </h1>-->
あとは対象ページがどうなっているか確認するだけ。すごい簡単でしたね!
流れとしては…
- 非表示にするHTML要素をデベロッパーツールを使用して検索
- content.php にて HTMLをコメントアウトで非表示にする
- 対象ページを確認する
です。ちなみに、固定ページと投稿ページのタイトルの出し方が同じ場合は「記事タイトル」も一緒に非表示にしてしまう。こともあるので注意が必要です。
番外編:CSSで非表示にする方法
この方法はオススメしません!
別にPHPをいじらずとも、CSSで非表示にすることだって可能です。cssで要素を非表示にするには display:none; というコードを使いますが…
<style> h1.entry-title{ display:none; } </style>
という上記のコードをウィジェットに入れてあげるだけです。外観 < ウィジェットよりサイドバーもしくは他のところにカスタムHTMLもしくはテキストを含めばOKです。この方法をオススメしないといった理由はサイドバーがぐちゃぐちゃになったりと後々管理が大変になってくるためです。SEO的にもNGですね。
ただ、HTMLの勉強やCSSの勉強にはもってこいです。
要素を確認しながら、自分の好きなように HTMLにCSSで装飾してみてください!
まとめ
いかがでしたか?簡単に固定ページのタイトルを表示しなくする事ができました。ぜひ、固定ページのタイトルが不要という事であれば、content-page.phpを編集してみてください!
コメント