日本のニット職人が家族のために作ったまかないマスク

cocoon simplicity 移行

cocoonワードプレス
この記事は約5分で読めます。

wordpressの無料テンプレートでは秀逸のひとつに違いないsimplecity

そのsimplecityの設計思想はそのままに、蓄積されたノウハウを詰め込んだ後継ワードプレステーマ[Cocoon(コクーン)]を見つけたので、早速テーマをsimplicityからcocoonに移行しました。

長く使うことになるのと別サイトの参考になるように備忘録を記載しておきます。

cocoonのインストール

simplicityからcocoonに移行だけど、特に意識せずにcocoonをインストール

Cocoonテーマをインストールする方法
WordPressにCocoon親テーマと子テーマをインストールして利用するおすすめのインストール方法です。

Simplicityの投稿設定をCocoonで引き継いで利用する方法

SEOタイトルやメタディスクリプションが引き継いでなかったので、SEO設定を引き継ぎます。

  1. 左カラム[Cocoon設定]内[Cocoon設定]をクリック
  2. 右カラム[Cocoon設定]内[その他]タブをクリック
  3. [その他の設定]内[Simplicity設定]の[Simplicityから投稿設定を引き継ぐ]をチェックで、[変更をまとめて保存]をクリック。

simplicityから投稿設定を引き継ぐ

これでsimplicity2テーマで記載した、SEOタイトルやメタディスクリプションがSEO設定に引き継がれます。

ここまでしてくれると移行の手間が格段に減るので、作者様に感謝です。

Simplicityの投稿設定をCocoonで引き継いで利用する方法
Simplicityの投稿ページで設定していた「SEO設定」「広告設定」「AMP設定」を引き継ぐ機能を追加しました。その使い方の解説ページ。

cocoon タグ非表示

記事の下にタグがずらっと並ばないように、タグとついでにカテゴリーも非表示にします。

  1. 左カラム[Cocoon設定]内[Cocoon設定]をクリック
  2. 右カラム[Cocoon設定]内[投稿]タブをクリック
  3. [カテゴリ・タグ表示設定]内[カテゴリ・タグ表示]で[カテゴリもタグも表示しない]を選択して[変更をまとめて保存]をクリック。

cocoonタグ非表示

タグはいつでも使えるようにたくさん設定してはいますが、普段はみえなくてもいいかなと。

cocoon 自動広告

テーマを変更したら広告はすぐに始めたいですよね。

cocoonテーマでのgoogleアドセンス、自動広告の表示方法を解説します。

Adsenseで自動広告を適用する

Adsenseにログインします。

Google AdSense - ウェブサイトを収益化
Google AdSense を使用してウェブサイトを収益化しましょう。広告のサイズは自動的に最適化され、表示とクリックが促進されます。
  1. 左カラム[広告]内[サマリー]をクリック
  2. すべてのサイト内から自動広告を開始するドメインの横にある編集アイコンをクリック

アドセンス自動広告のセット

プレビューでサイトを表示した後、右[サイトの設定] で、[自動広告] をオンにして、[Apply to site]をクリックしてサイトに適用します。

広告設定のプレビュー

必要に応じて、[既存の広告ユニットの最適化][広告のフォーマット][広告の読み込み][ページ除外]を設定してください。

Adsenseで自動広告のコードを取得する

Adsenseにログインします。

  1. 左カラム[広告]内[サマリー]をクリック
  2. 右[サマリー]内[サイトごと]の[コードを取得]をクリック

自動広告のコードを取得

googleアドセンスの自動広告のコードが精製されました。

adsense自動コード

コードをコピーして利用してください。

Set up Auto ads on your site - AdSense Help

CocoonにAdsenseの自動広告を設定する

  1. 左カラム[Cocoon設定]内[Cocoon設定]をクリック
  2. 右カラム[Cocoon設定]内[アクセス解析・認証]タブをクリック
  3. [その他のアクセス解析・認証コード設定]内[ヘッド用コード]にgoogleアドセンス、自動広告のコードをコピペして[変更をまとめて保存]をクリック。

Cocoonに自動広告を設定する

これで、cocoonのテーマにAdsense自動広告を設定することが出来ました。

cocoon 自動広告とマニュアル広告を併用

自動広告と広告ユニットの併用 googleアドセンス
google adsense の自動広告。 各ページにコードを一つ追加するだけで、広告と最適化を自動でしてくれる便利システム。

googleアドセンスでレスポンシブのコードを取得

  1. AdSense にログインします。
  2. 左カラム[広告]内[サマリー]をクリック
  3. 右カラム[広告ユニットごと]タブを選択。
  4. 新しい広告ユニットの作成から[ディスプレイ広告]をクリックします。

ディスプレイ広告をクリック

  1. 広告ユニットにわかりやすい名前をつけて
  2. 広告のサイズを選んで
  3. 作成をクリック

コードの名前をつける

レスポンシブ リンク広告は、ページのレイアウトやユーザーのデバイスに合わせて自動的にサイズが調整されます。

コードが生成されますので、コードをコピーをクリックします。

コード生成ツール

googleアドセンスを記事の下に設置

  1. 左カラム[Cocoon設定]内[Cocoon設定]をクリック
  2. 右カラム[Cocoon設定]内[広告]タブをクリック

cocoon広告設定

[アドセンス設定]内[広告コード]に先ほど生成したgoogleアドセンス、広告ユニットコードをコピーして貼り付けます。

広告の表示位置は[本文下]をチェックします。

cocoonアドセンス設定

広告の表示位置はチェックした場所すべてに広告が挿入されます。

これで、自動広告と併用して記事下にレスポンシブ広告が表示されます。

その他

Simplicity
別サイト用、ワードプレステーマ、Simplicity適用の覚え書き。
WordPress コメント 名前とメールアドレスを必須にしない
もっと気軽にコメントをしてもらいたい。なら、名前とメールアドレスを必須にしないと効果があるかも。 あっ。こんなところに設定の変更があったんですね。で備忘録。

simplecityの設計思想はそのままに、蓄積されたノウハウを詰め込んだ後継ワードプレステーマ[Cocoon(コクーン)]はSEO・高速化・モバイルファースト最適化済みのシンプルで秀逸なテーマです。

コメント

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