※当サイトはアフィリエイト広告を利用しています

無料テーマ「Cocoon」の導入と設定

今回はワードプレスのレイアウトや設定をいじるための「テーマ」の導入について解説します。

アフィリエイト初心者にオススメのテーマは無料で利用できる「Cocoon」。

今回は以下の点をざっくり説明していきます。

  • Cocoonのダウンロードから導入まで
  • Cocoonでやっておきたい初期設定
  • Cocoonに必要なプラグイン
  • Cocoonのサイトデザイン

Cocoonのダウンロードから導入まで

まずは、Cocoonの親テーマ子テーマを無料ダウンロードしましょう。

ダウンロードできたらブログのダッシュボード画面に移って、Cocoonを導入していきます。

↑左側メニューから外観⇒テーマ⇒新規追加

↑テーマの追加画面からテーマのアップロードをクリック。

↑ファイルを選択⇒Cocoonのzipファイルを選択⇒開く

そして今すぐインストールをクリックしたら有効化はせず、今度は子テーマもインストールしましょう。

※ファイル名にChildが入ってるのが子テーマです。

↑子テーマをインストールして「有効化」を押せば導入は完了。

ちなみに子テーマを有効にするのは、

Cocoonをアップデートした時に設定やカスタマイズを上書きさせないためです。

Cocoonで最低限やっておきたい初期設定

Cocoonの設定は少し特殊で、ダッシュボード左側メニューに「Cocoon設定」が追加されます。

Cocoon設定では様々な項目の設定がここから行えます。

あまりにも項目が多すぎて何をどういじればいいか戸惑いますね。

詳しい案内はCocoon制作者の作ったマニュアルページ(要ブックマーク)を参考にして頂くとして、

ここでは必要最低限やっておいた方がいい設定を解説していきます。

※ここで触れていない設定は特にいじらなくて大丈夫です。
※ブログ運営に慣れてきたらマニュアルページを見ながら適宜いじっていきましょう。

「スキン」の設定(ブログのレイアウト・デザイン)

Cocoon設定の「スキン」から、有志が作成したスキンを使って簡単にサイトデザインを変えることができます。

↑スキン一覧から、気になるスキンの画像マークにカーソルを合わせるとデザインが確認できます。

サイトデザインは凝りだすとキリがないので、こうして1タッチでお洒落なデザインに変えられるのは助かります。

「広告」の設定

下部にある「PR表記設定」⇒「自動挿入ページ」⇒「全ての投稿ページ」にチェックを入れて「保存」

「アクセス解析・認証」

「アクセス解析設定」⇒「解析全般」⇒「サイト管理者も含めてアクセス解析する」のチェックを外して「保存」

「本文」の設定

ここでは外部リンク設定だけ変えておけばOK。

外部リンクを開くときは、新しいタブで開くを選択。

そして、リンク横には新しいタブで開くことを示唆するアイコンフォトをつけてあげましょう。

↑テーブル設定はレスポンシブテーブルの「横幅の広いテーブルは横スクロール」にチェック。

画像の設定

↑読者目線に立った時、記事に画像があるのとないのではどちらが興味を持って読んでもらえるかは言うまでもありません。

本文上にアイキャッチを表示する」にチェックを入れておけば、アイキャッチとして設定した画像が自動で記事本文の上に表示されるようになって見栄えがよくなります。

「エディター」の設定

↑エディター設定で「Gutenbergを有効にする」のチェックを外しましょう。

記事の執筆エディターが使いやすくなります。

※これは好みの問題もあるので、チェックが入った状態でも記事を書いてみて、どちらが使いやすいか自分で判断しましょう。

「高速化」の設定

最後に、Cocoon設定はダッシュボード左側にもいくつか項目があります。

これらの項目は現状放置で構いませんが、

高速化だけ設定しておきましょう。

といっても設定は簡単、以下の項目にチェックを入れるだけです。

チェックリスト

①ブラウザキャッシュの有効化(ブラウザにリソースを保存する)
②HTMLを縮小化する(HTMLのサイズを減らす)
③CSSを縮小化する(CSSのサイズを減らす)
④JavaScriptを縮小化する(JavaScriptのサイズを減らす)
⑤Lazy Loadを有効にする

⑥変更を保存

Cocoonに必要なプラグイン

Cocoonなら追加でプラグインを入れる必要がほとんどありません。

とりあえず、スタメンはこんな感じになりました。

・Akismet(迷惑メール対策)
・Broken Link Checker(リンク切れチェック)
・Contact Form 7(お問い合わせフォーム設置)
・Google XML Sitemaps
・WP Multibyte Patch

各プラグインの導入については以下の記事で紹介してます。

【ワードプレス】プラグインの使い方とおすすめのプラグイン6選

2018年7月9日

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です