[Cocoon2021]特定ページのタイトルを非表示にするCSSは?WordPress

エディタはグーテンベルグ、テーマはコクーン

Gutenberg(グーテンベルグ)エディタ、テーマはCocoonを使用しての記事になります。

ワードプレスにお引越しを考えていらっしゃる方はエックスサーバー 経由がおすすめですよ。 アップロードが簡単です!

タイトル非表示は空欄にすればいいだけじゃないの?

タイトルを空欄にしてもCSSで消すのと同じようにすることができます。が、そのページへのリンクを貼った時に下のような状態になってしまいます。

けれどタイトルを書いておいてCSSで消すと…

違いがお分かりになるかと思います。

指定したページが開かれている時だけタイトルが消えるようにしているので、外からのリンクなどでは表示させることができます。

逆にどんな時でもタイトルなしにしたい時はタイトル欄に何も書かなくてもいいのかもしれませんね。

例えばブログの1ページをホームページ風に作成して、そのページをトップページに固定したいときなどに使えるかと思います。

タイトルを非表示にするCSSはこれ!

.entry-title {
display: none;
}

タイトル非表示CSSコードを書く場所

タイトルを消したい記事の作成画面の一番下に『カスタムCSS』という欄が見つかると思います。そちらに先ほどのコードをコピーして貼り付けてください。

カスタムCSS

実際に貼り付けてみます。CSSコードを貼り付ける前のプレビュー画面がこちら↓

タイトル非表示ブログの画面

『カスタムCSS』欄に先ほどのコードをコピーして

カスタムCSS

プレビューボタンを押すと

しずくログトップページへ(タイトルなし)

タイトルが消えてそしてタイトル部分のスペースも無くなっていることがお分かりいただけると思います。(シェアボタンがタイトルのあった部分に上がってきています。)これで設定完了です!

さいごに

お読みいただきありがとうございました!Wordpress(Cocoon使用)の設定方法に関する記事をほかにも書いていますのでよかったら読んでいってくださいね。

ワードプレスCocoon
WordpressのCocoonテーマでグーテンベルグエディタを使用しての記事の書き方や設定方法をご紹介しています。その他サイト型トップページ作成方法、Cocoon設定一覧など。できるだけ簡単に設定できる方法をご紹介しています。分かりやすい説明を心がけています。

耳寄り情報

エックスサーバーを使いながらドメインは『お名前.com』や『ムームードメイン』などを利用しているというかたへ

ドメインをエックスドメイン に変更すればエックスサーバーと一元管理できてとっても楽です。

Xサーバー、Xドメインの管理画面です。サーバーとドメインが同じ画面で管理できてすっきりします。ミニマリストさんにもおすすめです。

エックスサーバー、エックスドメイン管理画面

◆エックスドメインただいまキャンペーン中

2021年3月31日までの期間限定で.jp .com .net他8種類ドメインの移管料金が利用料込みでなんと1年間110円(税込み)になるキャンペーン中です。

出典:エックスドメイン
詳しくはこちら→エックスドメイン

◆エックスサーバー以外のサーバーを利用しているというかたへ

エックスサーバー では、2021年4月1日(18:00)まで

“ドメイン永久無料&初期費用0円キャンペーン”を実施中です。

なんとエックスサーバーでアカウントを取るとドメインが1つ無料でもらえます。そしてそのドメインはエックスサーバーと契約している限りずっと無料で使っていいというのです。

ドメインの移管でもこのキャンペーンの対象となるのでこの機会にサーバーとドメインをXサーバーで統一してみてはいかがでしょうか?初回10日間は無料でお試しできます。

わたしはキャンペーンの少し前にXサーバーにドメイン移管をしてしまいました…。みなさんはこの機会をお見逃しなく!

\エックスサーバーキャンペーン中/

さらに上を行くWordpressのテーマはこちら↓

【THE THOR(ザ・トール)】 の特徴
  • 圧倒的にSEOに強い
  • おしゃれで美しいデザイナーズサイトが簡単に作れる
  • アクセスUP収益UPを強力に後押しする「集客・収益化支援システム」を搭載
  • ランキングサイト・口コミサイトなどが簡単に作れる など
ブロガー専用WordPressテーマ「OPENCAGE」 の特徴
  • ブロガー向けのシンプルで高機能なテーマ
  • カスタマイズに時間をかける必要がない
  • 全てモバイルファーストでつくられているのでスマホで見た時のデザインが抜群

インターネット接続キャッシュバックでお得です↓

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