AFFINGER

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

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

 

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

 

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

 

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

 

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

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

 

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

 

CocoonとAFFINGER5の機能の比較が知りたい方は「CocoonとAFFINGER5の機能を徹底比較【WordPressテーマ】」をご覧下さい。

 

\稼ぐに特化したWordPressテーマ/

AFFINGER5公式ページを見てみる

 

WordPressテーマの変更について

WordPressテーマの変更について

 

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

 

WordPressテーマを変更した理由

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

 

・Cocoonのカスタマイズに限界を感じたから

・AFFINGER5がSEO対策に強いから

・ブログで本気で稼ごうを思ったから

 

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

 

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

 

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

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

記事数は15記事でした。

 

■CocoonからAFFINGER5に移行した直後

・トップページのデザインはデフォルトになる

・記事のレイアウトが崩れる

 

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

 

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

 

WordPressテーマの変更方法

WordPressテーマの変更方法

 

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

 

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

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

 

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

 

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

 

・プラグイン「Back W Pup」を使用する

・サーバーでバックアップを取る

 

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

 

管理画面にてテーマ変更

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

 

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

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

 

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

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

 

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

 

計測ツールの設定

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

 

・Googleアナリティスク

・Googleサーチコンソール

・Google AdSense

 

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

 

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管理」→「会話・ファビコン等」→「会話風アイコン」で設定できます。

 

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

 

記事ページの修正

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

 

私が修正した箇所です。

・文字色、マーカーはすべて消えていたので修正

・表も崩れていたので、大きさを修正

・アイキャッチ画像の大きさがバラバラになってしまったので修正

 

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

 

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

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

 

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

 

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

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

 

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

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

 

\購入はこちらから/

AFFINGER5公式ページ

【特典】4980円の「STINGERタグ管理マネージャー3」をプレゼント

 

 

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

 

詳細はこちら
【初心者こそアフィンガー5】実際に使ったレビューとデメリットを公開

続きを見る

 

-AFFINGER

Copyright© ricoblog , 2020 All Rights Reserved Powered by AFFINGER5.