
初めてのテーマ変更なので出来るか不安。。
このような悩みに答えます。
どうも。港区OLみきです(*´艸`*)
(@investor_miki3)
WordPressのテーマを変更するのって不安ですよね。
テーマ変更にあたり、私が不安を感じた点は大きく2つありました。
・実際の変更手順がわからない(手探り状態)
・これまで積み上げてきたブログのデータが消えないか心配
そんな不安を解消すべく、本記事では実際にWordPressのテーマを変更した私が全手順を画像付きでわかりやすく解説します!

当記事で分かること
- WordPressのテーマの変更に必要なもの
- WordPressのテーマを変更する手順
- テーマ変更時の注意点
目次
テーマの変更に必要なもの
まずは、テーマ変更に必要なものから解説していきます。
必要なモノ
- 変更したいWordPressのテーマ
- WordPressの検証環境
- All-in-One WP Migration(データ移行に使用するプラグイン)
- BackWpup(本番環境のデータバックアップに使用するプラグイン)
『WordPressの検証環境』って何?
普段見られているブログは本番環境(インターネット上で公開されている環境)で動作しています。
一方、他の人は見ることができない環境のことを『検証環境』と呼びます。
簡単に言うと、"普段見られているブログには一切影響を与えることなく、テーマやデザイン変更など色々試すことが出来る環境" のことです。

簡単!テーマ変更5ステップ!
それでは、テーマ変更方法について解説していきます。
画像付きで解説していますので、そのまま真似ていただければ迷わず進められると思います♪
テーマ変更方法5ステップ
- WordPressのテーマを購入
- 検証環境の構築
- ブログデザインのカスタマイズ
- 記事のリライト
- 本番環境に反映
※本記事では、無料テーマのCocoon(コクーン)から有料テーマのAFFINGER(アフィンガー)への変更手順をベースに解説しています。
基本的には、違うテーマでも大枠の流れは一緒なので参考にできると思います。
なぜ検証環境構築後に本番環境へ反映するのか?
・新テーマへの変更作業中も、ブログを提供し続けることができる
・テーマ変更に伴う表示崩れを修正してから一般公開できる
それでは、順番に解説していきます。
ステップ1:WordPressのテーマを購入
※無料テーマに変更 or テーマ購入済みの人は『ステップ2:検証環境の構築』に進んでください。
まずは、WordPressのテーマを準備(購入)しましょう。
※本記事では本ブログで使用しているAFFINGER(アフィンガー)の購入手順を紹介します。
参考:AFFINGER(アフィンガー)は「稼ぐ」に特化したテーマと言われており、数多くの著名なブロガーが使用しています。
"AFFINGER" の特徴
・SEOや収益化に効果的な機能が豊富
・記事ごとにAMP化を選択可能
・簡単に設置出来るランキング機能をはじめとしたアフィリエイトを始めやすい設計

\収益化に強いテーマ/
step
1AFFINGER公式サイトから購入
①まずは『AFFINGER公式サイト』にアクセスします。
②画面をスクロールすると現れる「ご購入はこちら」をクリック
③「初めてインフォトップをご利用の方はこちら」をクリック
④"お客様情報" と "支払い情報" を入力して「注文内容を確認」をクリック
⑤以下の画面が表示されたら注文完了です!
step
2ファイルをダウンロード
①登録したメールアドレス宛に注文完了メールが届きますので、記載されているURLから購入者ログインページにアクセスしてください。
②マイページにログイン後、『注文履歴・ダウンロード』タブをクリック
③注文履歴の『ダウンロード』をクリックしてファイルをダウンロード
ダウンロードしたファイルはそのままにして、次のステップに進みましょう!
ステップ2:検証環境の構築
テーマの準備(購入)が完了したら、続いては検証環境の構築します。
検証環境はご利用中のサーバー内に構築します。
※本記事で本ブログで利用しているエックスサーバー内に検証環境を構築する手順を紹介します。
step
1検証環境の構築
構築手順については非常に分かりやすいサイトがありますので、こちらをご覧ください。

検証環境構築の中で使用する「All in One WP Migration」はインポートできるファイル容量に制限があります。
もし、ファイルサイズが原因でエラーになった場合はこちらの手順に従って対処してみてください!
step
2テーマのインストール
検証環境の準備ができたら、テーマをインストールしていきましょう!
※本記事では本ブログで使用しているAFFINGER(アフィンガー)の購入手順を紹介します。
①"ステップ1:WordPressのテーマを購入" でダウンロードしたテーマのファイル(Zip)をダブルクリックして解凍します。
※解凍後に出てきたファイル(「wing_af5_infotop_dl」のようなファイル名)は一旦放置して次に行きましょう。
②前段で構築したWordPressの検証環境にログインして、「外観」→「テーマ」→「新規追加」をクリック
③「テーマのアップロード」をクリック
④「ファイルを選択」をクリック
⑤先ほど解凍したファイルをクリックすると以下のような5つのファイルが出てくるので、「WordPressテーマ」をクリック
⑥2つのファイルが出てくるので「affinger5.zip」を選択してアップロードします
⑦「今すぐインストール」をクリック
⑧インストールが完了したら、「テーマのページに戻る」をクリック
⑨今度は同様の手順で「affinger5-child.zip」をインストールします。
⑩インストールが完了したら、「外観」→「テーマ」と進んでください。
下記のようにテーマが2つ追加されていますので、「WING-AFFINGER5 Child」の「有効化」ボタンのみクリックしましょう。
※親テーマである「WING-AFFINGER5」はそのまま放置でOKです!

ステップ3:ブログデザインのカスタマイズ
テーマのインストールが完了したら、次はブログデザインをカスタマイズしていきます。

参考:AFFINGERについてはこちらのYoutubeチャンネルが参考になるので貼っておきますね♪
注意点
特に有料テーマの場合は機能が充実しているが故に、ずーっとデザインのカスマイズしていられます。
次のステップがすごく大変なので、体力を温存する意味でも、カスタマイズにのめり込み過ぎないように注意しましょう!
ステップ4:記事のリライト
テーマ変更で最も大変な作業が記事のリライトです。
テーマを変更すると記事のレイアウトや文字の装飾(テキスト色、吹き出し、ボックス)などが結構な割合で崩れます。

私が最も苦労したのが『吹き出し』の修正です。
どんな感じかというと、
テーマ変更前はキレイに表示されていた吹き出しのアイコンが・・・
でっかくなっちゃった!
・・・と、こんな感じで表示が崩れます。
これをひとつひとつ修正するわけですが、私は全記事(約80記事)修正するのに丸2日を要しました。。
修正自体は簡単ですが、単純作業の繰り返しなので大変です。
ここは気合で頑張るしかないです!気合だ!
注意点
一度に完璧に修正しようとすると相当な労力を必要とするので、ある程度読めるレベルまでの修正に留めることをオススメします。
完璧に修正するのは、時間があるときに少しずつ進めたほうがベター。
ステップ5:本番環境に反映
ここまで来たら、あとは検証環境のデータを本番環境に反映するだけです!
検証環境を構築した時の手順と流れは一緒で「All-in-One WP Migration」を使います。
検証環境構築の際は、「本番環境のデータをエクスポート → 検証環境のデータをインポート」でしたが、今回は「検証環境のデータをエクスポート → 本番環境のデータをインポート」します。
本番環境に反映する前に、念の為、本番環境のデータをバックアップをしておくことを強く勧めます。

※バックアップには『BackWpup』のプラグインがオススメです。
具体的な使い方はサルワカさんのこちらの記事が非常に分かりやすいので参考にしてみてください。

まとめ:WordPressのテーマ変更を徹底解説!!
以上、WordPressのテーマ変更手順の解説でした。
テーマ変更は大変なこと(圧倒的に記事のリライトが大変)もありますが、新たな気持ちでブログと向き合うことができるなど、メリットは大きいと思います。
新たなテーマで、皆さまのブログライフがさらに楽しいものになれば幸いです(*´艸`*)
Good Luck♡
-
-
CocoonからAFFINGERにテーマ変更をした2つの理由と感想【体験談】
続きを見る