ブログ運営

【ブログ運営】ワードプレステーマを変更する際の注意点と変更後の確認事項!

パソコン

数日前、このサイトのワードプレステーマをハミングバードからJINに変更しました!(ハミングバード は他サイトで使用)

このJINというテーマは初心者向けにすごく簡単に綺麗なサイトが作れるのが魅力で、迷う事なく購入しました!

ムーミー
ムーミー
しかも複数サイトに使えるという太っ腹!即買いですね!!

すぐに試してみたくて何も考えずにテーマ変更してしまい、デザインや設定などを調べながらやるはめになり時間がかかってしまいました。

その経験をふまえて、初心者ブロガーさん向けにテーマ変更する際に安心して作業できるよう記事にまとめてみました。

  • テーマ変更前の注意点
  • テーマ変更後、まずは最低限チェックする項目

テーマを変更する前にやること

バックアップ

テーマ変更する前に必ず現状のバックアップを取る必要があります。

それは、テーマ変更後予期せぬ事態に遭遇した時に、一旦元に戻すことができるからです。

ムーミー
ムーミー
初心者とはいえバックアップのことすら頭になかった私・・・・。

今後もっと記事が増えた場合は、定期的に必ず取らないといけないと反省しました。

バックアップはFTPソフトを使用したりバックアップ用のプラグインを使用してバックアップをとることをおすすめします。

・バックアップ用プラグイン→BackWPup

このBackWPupは自動的にバックアップをとってくれるのでおすすめです!

現在のサイトで追加したCSSのコピー

現在使用中のテーマで追加したCSSはリセットされるので、メモなどにコピーしておきます。

グーグルアナリティクス、サーチコンソールの設置コード確認

事前に確認してコピーしておけば、変更後スムーズに新テーマに設置することができます。

テーマ変更中のデザインを晒したくない方

初心者ブロガーさんでもある程度PVがある方は、変更後の崩れたデザインは長時間表に晒したくはないですよね!

そんな方にはTheme Test Driveというプラグインがおすすめです。

このプラグインは、

閲覧者旧デザインで表示

自分裏側でカスタマイズ

閲覧者には旧デザインのまま、裏側でカスタマイズできるという便利なプラグインです。

その他には、ライブプレビューというワードプレス機能もテーマ変更時に便利です。

ワードプレス 管理画面の『外観』『テーマ』『変更するテーマにカーソルを合わせる』『ライブプレビュー』ボタンが表示されます。

このライブプレビューは非公開の状態でデザインの確認や、メニューやウィジェットの変更、タイトル変更など、ある程度デザインのカスタマイズができます。

カスタマイズし、そのまま有効化にすればデザインがある程度完成された状態で公開することができます。

新テーマに移行してからやること

ムーミーのテーマ変更時の状況

  • ブログ記事10記事
  • ワードプレスのテーマはハミングバード使用
  • PHPカスタマイズあり
  • CSSカスタマイズあり

記事数は少なかったしカスタマイズもあまりしていなかった為、テーマ変更後サイトが大きく崩れることはありませんでしたが、記事内の細かな箇所を修正する必要がありました。
今回私が修正した箇所は以下になります。

サイトタイトルチェック

旧テーマのタイトルを独自に設定していた場合、JINでは反映されていない場合があるそうです。(JIN公式マニュアルより)

SEOチェキというツールを使用して「サイトタイトル」や「ディスクリプション」がきちんと表示されているか確認しておく必要があります!

他テーマでも念のためやっておいた方がいいかもしれません。

 

サイドバーやヘッダーフッダーの変更

テーマ変更するとデザインががらりと変わります。

カスタマイズは簡単にできるので、見やすいように先にある程度設定しておいた方がいいです。

画像サイズの確認

テーマ変更すると、サムネイル画像がバラバラになってしまう場合があるので画像の大きさを揃える必要があります。

上記のような感じになってしまったので、Regenerate Thumbnailsというプラグインを使用したとこと解決できました。

【Regenerate Thumbnails使用方法

①ダッシュボード→プラグイン新規追加→Regenerate Thumbnailsインストール有効化

②ダッシュボード→ツール→Regenerate Thumbnails→「すべてのサムネイルを再生成する」ボタンクリック

あとは100パーセントになるまで待つのみです。簡単ですね!

自動で生成してくれたあとはサムネイル画像は元どおりになっていました。

スクリーンショット画面

タグの変更

過去のテーマで使用していたタグやショートコードは使えないので、全て変更することになりました。テーマ変更後すぐに確認するとこんな感じに表示されます↓

記事内のタグ表示

記事ごとの修正は結構大変・・。

そんな方は、旧サイトタグを一気に変更できる便利なプラグインがJINマニュアルで紹介されています。

Search Regexというプラグインがすごく便利だそうです。

プラグインの見直し

テーマ変更したら、プラグインを見直す必要があるようです。

ちなみに今回変更したJINにはテーマ非推奨プラグインもあるようなので、確認しておきましょう。

私はJIN非推奨プラグインの「All in One SEO Pack」を使用していたので、停止しました。

テーマと相性の悪いプラグインは公式サイトに従って削除した方が不具合はなくなるようです。

グーグルアナリティクスの再設定(JINの場合)

JINのアナリティクス設定の仕方は超簡単です。

アナリティクスのトラッキングコードをHTML設定のhead内に貼り付けすれば完了です。

①アナリティクス管理ページトラッキングコードグローバル サイトタグ(gtag.js)をコピー

②JINHTMLタグ設定のhead内に貼り付け

スクリーンショット

【JIN以外のテーマの場合】
ダッシュボード→外観→テーマの編集→編集するテーマを親テーマに変更→header.php選択→

サーチコンソール設定確認

サーチコンソールのHTMLタグをコピーしておく必要があります。

HTMLタグ確認方法

①サーチコンソールホーム画面→右上の設定マーククリック→確認の詳細クリック

スクリーンショット

②別の方法で確認するクリック


HTMLタグコピー

②JINHTMLタグ設定のhead内に貼り付けスクリーンショット

アドセンス広告設置

アドセンス広告を利用している方は、広告コードの再設置が必要です。

まとめ

では、最後にテーマ変更をスムーズ行うためにやるべきことをまとめます。

変更前にやること

  • バックアップ
  • 旧サイトのcssをメモにバックアップ
  • グーグルアナリティクスのコード確認
  • サーチコンソールのHTMLタグ確認
  • アドセンスコード確認

変更後やること

  • サイトタイトルチェック
  • サイドバーやヘッダーフッダーのデザイン変更
  • サムネイル画像サイズ変更
  • 記事のチェックとタグ変更
  • プラグインの見直し
  • グーグルアナリティクスの再設定
  • サーチコンソール再設定
    (アドセンス広告をしている方は再設置)

変更後の崩れたデザインを晒したくない方は、ライブプレビュー機能または、Theme Test Drive機能使用します。

私のように何も考えずにテーマ変更するのはNGです!!

また追加情報がありましたら追記します!

息子
息子
テーマ変更お疲れ様!