「Cocoon」日付を非表示にする方法

Cocoonでは、デフォルトの設定で「投稿ページ」と「固定ページ」の右上に「投稿日・更新日」が表示されています。

赤枠で囲んでいる場所が、今回非表示にしたい場所です。

ブログサイトなら良いのですが、一般のホームページとして使おうと思うと、デザイン的に邪魔なので非表示にする方法を説明していきます。

3パターンのやり方を記載しています。

1.全ての日付を非表示にする方法

①管理画面の「Cocoon設定」→「Cocoon設定」クリック

Cocoon設定の画面が表示されます。

②「本文」タブをクリック

③投稿情報表示設定の投稿関連情報の「投稿日の表示・更新日の表示」のレ点チェックを外す

④「変更をまとめて保存」をクリック

⑤非表示になっているか確認する

※環境のせいか・・・「日付が消えるまで時間がかかったので気を付けて下さい」

見事に消えていました。

2.特定の固定ページの日付を非表示にする方法

①右メニュバーの「固定ページ」→「固定ページ一覧」をクリック

固定ページ一覧が表示される

②非表示にしたい記事IDをメモする

IDという欄に表示されている数字が「記事ID」です。

③左メニューバーの「外観」→「テーマエディター」をクリック

テーマの編集画面が表示される。

④以下のコードを「コピー」する

1ページのみ日付を非表示にしたい場合

/*---------------------------------
固定ページの日付を非表示にする、おまじない
--------------------------------*/
.post-●● .date-tags {
  display: none;
}

複数ページ日付を非表示にしたい場合

/*---------------------------------
複数の固定ページの日付を非表示にする、おまじない
--------------------------------*/
.post-●● .date-tags,
.post-●● .date-tags,
.post-●● .date-tags {
  display: none;
}

※「，」で区切れば複数指定ができます。

⑤スタイルシート（style.css）にコピーしたコードを「ペースト」する

※「.post-●●」の●●に先ほどメモした「記事ID」の数字を入れ変える。

⑥「ファイルを更新」をクリック

これで、指定した固定ページの日付を日付を非表示にできます。

3.投稿ページの「投稿日・更新日」をコードで非表示にする方法

①投稿日を非表示にするコード（）

/*投稿日を非表示にする、おまじない*/
.post-date {
  display: none;
}

②更新日を非表示にするコード

/*更新日を非表示にする、おまじない*/
.post-update{
  display: none;
}

③スタイルシート（style.css）にコピーしたコードを「ペースト」する

④「ファイルを更新」をクリック

これで「投稿日・更新日」を非表示にする事ができます。

4.「Cocoon」の日付を非表示にする方法のまとめ

以上が日付を非表示にする方法でした。

意外と気になる日付の表示、消すとスッキリするのでぜひ試してみて下さい。

非表示のやり方は3通り記載したので、非表示になるまで色々試してみて下さい。

それでもできない場合は、コメントに書いてください。