【Cocoon完全ガイド⑥】レスポンシブ対応・更新・ブログカード・タグ設定・高速化の注意点

インターネット
この記事は約5分で読めます。

WordPress初心者がよく遭遇するレスポンシブ対応・ブログカード・タグ設定・高速化の注意点

運営者
運営者

この記事では、下記の悩みを解決します。
・レスポンシブ対応の設定?(表がスマホで横スクロールできない)

・画面下の黒いバーを非表示にする場合
・サイトヘルスとは?
・日付表示を設定するには?
・更新(テーマ・プラグイン)を行う場所は?
・ブログカードのPV数を消したい
・投稿表示などコントロールしたい
・タグを入力するのが面倒
・カテゴリーを一時的に非表示にしたい
・Cocoonの高速化設定等
を分かりやすく解説します。

初心者の方でも、この記事を参考にサイト作成進める手助けになれば幸いです。

また、私自身、WordPress を使い始めた頃は、「どこを触ればいいのか分からない」
といった初歩的な部分で何度もつまずきました。
この記事では、私が実際に経験したトラブルと、そのときにどう解決した事も交えて解説します。

レスポンシブ(横スクロール:Cocoon)

テーブルがスマホの画面より大きい場合、スクロールバーを表示させる。

操作方法:Cocoon設置→「本文」⇒「横幅の広いテーブルは横スクロールする。」に✓を入れる。⇒「変更をまとめて保存」

画面下の黒いバーを非表示にする場合

管理画面でサイトを表示させると画面下に下図が表示され、ブラウザに直接サイトのアドレスを入力しサイトを表示させると下図が表示されない場合、参考にしたサイトを紹介します。

ログイン状態でのみ表示されるため、
一般ユーザーには見えません。

黒いバーの非表示設定(引用:よしてっくさんのブログ)

サイトヘルス

サイトの健康診断のようなもの。

操作:「ツール」⇒「サイトヘルス」

参考にしたページ(引用:WEBST8)

サイト全体の日付設定

下図で設定した日付はWordPress全体で表示される。

操作方法:「設定」⇒「一般」⇒「日付形式」より選択。⇒「変更を保存」

更新(テーマ・プラグイン)

※ 更新前は、必ずバックアップを取得することをお勧めします。
更新中は画面を閉じない(メンテナンスモードで動作中のため)ようにしましょう。(最新版と表示されるまでです。)また更新後の確認も実施されることをお勧めします。初心者の内は、1つ1つ更新し確認し進めてください。

テーマの更新方法

確認する場合:再度「更新」ボタンを押し右のように「お使いのテーマはすべて最新版です。」と表示されればOKです。
テーマのバージョンを見てバージョンアップでも確認できます。

プラグインの場合

Site Kit By Googleの更新は、更新するたびに英語表示に切り替わります。
日本語パックをサーバにアップすることで解決しますが、毎回なので手間です。

日付(投稿日の削除)

解決方法:Cocoonのテーマの場合、表示させたくない個所の✓を外しました。

下図のように日付が2つ表示される。(左側は、公開日で右側は最終更新日です。)

操作方法:「Cocoon設定」⇒「本文」⇒✓を見直す。⇒「変更をまとめて保存」

ブログカードの日付の削除

ここでは、ブログカードで表示されていた日付を削除した時の操作を下記に記載します。
参考になれば幸いです。

操作方法:「Cocoon設定」⇒「インデックス」⇒✓を見直す。⇒「変更をまとめて保存」

ブログカードの投稿日付の場合、「インデックス」を選択する。

ブログカード表示のPV数削除方法

ここでは、メニューよりリンクされ下図のように表示される場合、赤枠部分を削除したいと思い削除したときの方法を記載します。参考になれば幸いです。

はじめの画面

操作方法:[Cocoon設定]⇒[Cocoon設定]⇒[管理者画面]⇒[PVエリアを表示]の✓を外す。⇒[インデックスにPV数を表示する]の✓を外す⇒[変更をまとめて保存]
※ 下図の①②の2か所の✓を外さないとできません。

設定画面
完成図

タグの表示方法の切替え

下図の設定で解決できましたので紹介します。ご参考にしていただければ幸いです。

タグ表示がカテゴリー表示のようにチェックリストのようなドロップダウンリストで表示できるようにできないか?

あらかじめタグを設定しているのに、投稿ページで設定するときにまた記入しないといけなく記入間違いなどあると検索できない等不便を感じていた。

操作方法:「Cocoon設定」⇒「Cocoon設定」⇒「エディター」⇒「タグ選択をチェックリスト形式にする」に✓を入れる⇒タグがリスト表示される。(下図参照ください。)

投稿ページ削除に伴いカテゴリーを除外の設定

まだ編集途中のページを下書きに戻し、対象ページのカテゴリーが一つのみでしたので一時的に非表示とした時の設定を記載します。

参考にしていただければ幸いです。
※ カテゴリーの削除はSEOの観点から推奨されませんので苦慮の末非表示としました。
設定方法:「Cocoon設定」⇒「投稿」⇒「カテゴリー」項目より除外カテゴリーに✓を付ける。
上記で設定できました。(詳細は下図参照ください。)

ページの改頁を挿入

改ページしたら目次が表示されなくなったので下図、赤枠✓を追加した。

高速化

下図のチェックで「CSS」に✓を付けるとアイキャッチ画像が消えた。(私だけかもしれませんが、念のためです。)

初心者は 1つずつ設定 → 表示確認 を推奨します。

キャッシュは良くトラブルの原因に名りますので必ず確認しましょう。エラーが表示される場合はこの✓を外すなど対応してみてください。

まとめ

最後まで記事を見ていただきありがとうございました。
この記事では、初心者でも記事通りに進めていけば安心してサイト作成いただけます。また初心者がつまずきやすいCocoonテーマの操作を解説しました。必要な場面に遭遇しましたらご活用いただけると幸いです。

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