WordPressテーマの変更時に行う設定【CocoonからAFFINGER5】

WordPressテーマをCocoonからAFFINGER5に変更したいけど、何を設定したら良いの？

こんなお悩みを解決していきます。

当サイトもWordpress（ワードプレス）のテーマをCocoonから、AFFINGER5（アフィンガー5）WINGに移行しました。

今回は実際に私が行った設定や、CocoonからAFFINGER5にテーマ移行したときに行った方が良い設定を紹介していきます。

初心者の方でもわかりやすいように、画像を使って説明していきます。

これからWordPressテーマをCocoonからAFFINGER5に変更する予定の方は、ぜひ最後まで記事をお読みください。

WordPressテーマの変更について

私がWordPressテーマをCocoonからAFFINGER5に変更した理由と、移行したときの状況を紹介します。

WordPressテーマを変更した理由

私がWordPressテーマをCocoonからAFFINGER5に変更した理由です。

ブログを始めたころは初期投資にお金をかけたくなかったので、とりあえず無料テーマから使おうと思っていました。

しかしCocoonでのカスタマイズがCSSの知識が必要であったこと、ブログで稼ぐなら有料テーマの方が良いと感じたので移行を決意しました。

WordPressテーマを変更したときの状況

WordPressテーマをCocoonからAFFINGER5に移行するならなるべく早い方が良いと思い、ブログを開始して14日目の初心者のときに変更しました。

記事数は15記事でした。

難しい設定はなかったですが、記事数が多ければ多いほど修正に時間がかかります。

テーマ移行を行うのであれば早めにすることをおすすめします。

WordPressテーマの変更方法

WordPressテーマの変更方法について説明します。

WordPressテーマ変更前にバックアップ

WordPressテーマ変更前には必ずバックアップを取って下さい。

理由は万が一テーマ変更中にWordPressにアクセスできなくなってしまったときに、元の状態に戻せるからです。

バックアックを取る方法は下記の２種類です。

どちらの方法でも良いので、バックアップを必ずとってからテーマ変更を実施して下さい。

管理画面にてテーマ変更

WordPressの管理画面にてテーマ変更していきます。

「外観 」→ 「テーマ」をクリックします。

変更したいテーマの「有効化」をクリックすれば、WordPressテーマが変更されます。

WordPressテーマ変更で設定すること

WordPressテーマをCocoonからAFFINGER5に変更した際の設定を６つ紹介します。

計測ツールの設定

以下の３つの計測ツールが正しく機能しているか確認して下さい。

機能してないようであればコードの再設置が必要です。

WordPress管理画面を開きます。

「ATTINGER管理」→「Google・広告/AMP」→「Google関連に関する設定」で設定できます。

各IDを入力して下さい。

CSSの設定

CSSカスタマイズは引き継げないため、再度設定する必要があります。

Cocoonの場合はCSSの編集を「外観」→「テーマエディター」→「スタイルシート（style.css）」で行っていたと思います。

しかし、AFFINGER5はスタイルシート（style.css）で編集するには、親テーマをカスタマイズする必要があります。

AFFINGER5の場合は、「外観」→「カスタマイズ」→「追加CSS」で編集を行います。

※CSSコードを追加するので、念のためバックアップを取っておくことを推奨します。

Table of Contents Plusのインストール

Cocoonには目次機能が付いていましたが、AFFINGER5には目次機能がありません。

そのためプラグインで「Table of Contents Plus」をインストールする必要があります。

まずWordPress管理画面から「プラグイン」をクリックします。

検索窓に「Table of Contents Plus」と入力して下さい。

Table of Contents Plusをインストールして、「有効化」をクリックして下さい。

「設定」→「TOC+」→「Table of Contents Plus」で設定していきます。

あとはお好みで設定すればOKです。

ブログカードの設定

記事の途中に挿入している「ブログカード」が、すべてURLの表示に変わっているため再設定が必要です。

投稿画面の「カード」をクリックすると、コードが表示されます。

コードに「記事ID」を入力すれば、ブログカードがプレビュー画面で表示されています。

記事IDは投稿一覧の右側に表示されています。

Cocoonで使用していたブログカードは、すべてこの方法で書き換える必要があります。

吹き出し機能の設定

吹き出し機能もアイコン画像と、吹き出しマークが消えていたので再設定が必要です。

AFFINGRE5でも吹き出し機能はあります。

「AFFINGER5管理」→「会話・ファビコン等」→「会話風アイコン」で設定できます。

投稿画面への入力は、「タグ」→「会話ふきだし」→「会話１」をクリックすると、コードが表示されます。

記事ページの修正

あとは実際に記事ページを見て、崩れているところを修正して下さい。

私が修正した箇所です。

１記事ずつ確認して、崩れている部分を修正していく必要があります。

WordPressテーマは早めに変更しよう

WordPressテーマをCocoonからAFFINGRE5に変更した際に設定することを紹介しました。

初心者の私でも設定ができたので難しくはないですが、記事数が多ければ多いほど時間がかかってしまいます。

まだテーマ移行していない方は、記事数が少ないうちに変更することをおすすめします。

只今AFFINGRE5を購入すると通常4980円で販売している「STINGERタグ管理マネージャー3」が、期間限定で無料でついてきます。

この機会にぜひAFFINGRE5を導入してみて下さいね。

AFFINGER5の詳しいレビューに関しましては「【初心者こそアフィンガー5】実際に使ったレビューとデメリットを公開」を参考にして下さい。