【WordPress】ページのタイトルを非表示にする方法(CSS)

WordPress
スポンサーリンク

当ブログは収益を目的としたアフィリエイト広告およびアドセンス広告を使用しており、記事内にそれらの広告が含まれる場合があります。

WordPressのデフォルトでは、h1のページタイトルが自動的に表示されるようになっていますが、サイトのジャンルによっては トップページや特定のページでタイトルを非表示にしたい場合があります。

この記事の内容は、ページタイトルを消す(見えなくする)方法です。

使用するWordPressテーマは『Cocoon』です。

テーマエディターファイルに記述する方法

すべてのページのタイトルを非表示にする

「テーマファイルエディター」子テーマ(Cocoon Child)で、「スタイルシート(style.css)に以下のCSSを記述します。

/************************************
** すべてのページのタイトルを非表示にする
************************************/
.entry-title {
display: none;
}

/***○○○○○***/ の部分は単なる覚え書き(メモ)なので、省略も可。

固定ページだけタイトルを非表示にする

先ほどの記述の先頭に「.page」を加えます。

/************************************
** 固定ページだけタイトルを非表示にする
************************************/
.page .entry-title {
display: none;
}

投稿ページだけタイトルを非表示にする

先ほどの記述の先頭に「.post」を加えます。

/************************************
** 投稿ページだけタイトルを非表示にする
************************************/
.post .entry-title {
display: none;
}
スポンサーリンク

特定のページでタイトルを非表示にする方法

固定ページや投稿ページの編集画面の操作パネルに、「カスタムCSS」を記述する欄があります。

「カスタムCSS」は、ページごとに個別にCSSの要素を加えたいとき使用します。

タイトルを非表示にしたいページの「カスタムCSS」の欄に、先ほどと同じコード(↓)を記述すると…

.entry-title {
display: none;
}

…そのページだけ非表示の設定が適用されます。

カスタムCSSの記述場所が見つからない場合は?

編集画面の右上の3点の記号から、最下部にある「設定」をクリック。

「パネル」「追加」「カスタムCSS」という項目があるので、ここをONにすれば表示されます。

タイトルとURLをコピーしました