WordPressテーマLightningは2021年5月にリニューアルしました。従来よりLightningをお使いの方へのご案内です。

Lightning Pro から移行するべきかどうか

Lightning Pro から Lightning 14系 + G3 Pro Unit に切り替え推奨手順を紹介します。
まずは自身のサイトを移行するべきかどうかのご確認をしてください。

受託で過去に制作したサイトは Lightning Pro のまま推奨

Lightning Pro はメンテナンス継続です

G3版 は内部構造が違うので新規構築用を想定としています。
独自にコードを書いてカスタマイズした部分などは崩れる可能性が高いので、受託案件で Lightning Pro で作ったものは移行せずにそのまま利用いただいたく方が良いです。

新しい機能の改善などは Lightning G3 Pro Unit がメインになりますが、不具合の修正や WordPress のバージョンアップに伴う対応は継続します。

むしろ「機能追加や仕様変更のアップデートで不具合が出るのが嫌なので不具合修正だけにしてほしい」という声もかなりいただいていましたので、そういう場合は Lightning Pro を使う方が良いとも言えます。

VK Blocks Pro などのプラグインや共通機能などは従来通りアップデート

Lightning Pro の新規機能頻度は下がりますが、VK Blocks Pro や ExUnit などのプラグインは更新されますし、投稿一覧など G3 や Katawara と共通で使っているプログラムの部分などはアップデートされますので、まったく機能追加されないというわけではありません。

新規制作や自分の管理するサイトはG3推奨

基本新規サイト制作での利用がお勧めですが、自社サイトなど頻繁にメンテナンスして長期的に使うサイトであれば、カスタマイズ度合いにもよりますが移行をお勧めしています。

移行で注意が必要な
G2とG3の仕様の大きな違い

PHPやCSSでかなりカスタマイズしている方向けの注意

CSSのクラス名は大幅に変更になっています。

今回クラス名がほとんど変更になっているので、テーマに関するCSSを上書きカスタマイズしている部分に関しては概ね崩れます。Lightning Pro の継続利用がお勧めです。

アクションフック名・フィルターフック名が変更になっています

テーマ全体を作り直しているので各所フック名が変更になっています。フックでカスタマイズしている方は別テーマに切り替えているつもりでフック処理を見直してください。

ただ、アクションフックに関しては G3 Pro Unit では Lightning 機能設定 から 開発モードを 有効にするとアクションフックの場所が一部確認できます。

子テーマでテンプレートファイルを複製・カスタマイズしている場合

そもそもテンプレート構成・ファイル名が違うので、過去に子テーマに複製したファイルがあっても G3 モードでは読み込まないか、もし読み込むと崩れると思われます。

その他の仕様の違いによる注意

ウィジェットエリア「トップページコンテンツエリア上部」はありません

G3ではブロックで構築する事を前提としています。トップページに指定した固定ページに各種ブロックを配置して構成する事を想定していますが、どうしてもトップページウィジェットエリアを使いたい場合は下記からウィジェットエリア追加プラグイン「Lightning G3 Expand Widget Areas」をご利用ください。

Lightning G3 Expand Widget Areas

Lightning 13 までと違い、G3版では ウィジェットエリア「トップページコンテンツエリア上部」はありません。 G3ではトップページもトップページに指定した固定ページに各…

移行の手段

主に以下の方法が挙げられます。メリット・デメリットをご確認の上、ご自身に合う方法で移行してください。

A. 開発環境で移行してからまるごと本番に反映する

メリット

  • 本番に影響しない環境でしっかり調整してから反映できる

デメリット

  • サイトの容量が大きい場合は有料版のプラグインを購入する必要がある
  • 対象のサイトのサブディレクトリに他のWordPressが入っていたりする場合は引っ越しでトラブルになる可能性がある

B. バックアップをとった上で本番環境で作業する

メリット

  • テスト環境からの引っ越しでトラブルになる事はない

デメリット

  • 作業中崩れ続ける
  • やっぱりうまくいかなそうだから一旦戻そう となった時に、作業中のを一旦バックアップ取り忘れてもとのバックアップから復元すると作業した内容が全て消失する

A. 開発環境で移行してからまるごと本番に反映

開発環境の用意

まずは開発環境を用意しましょう。以下の開発環境構築ツールがお勧めですが(どちらでもかまいません)、よくわからない場合は別途レンタルサーバーに開発用のサブドメインなどを指定して用意してもかまいません。

自分のPC内に簡単にWordPressのローカル開発環境をつくれる! Local by Flywheel の設定方法 | 株式会社ベクトル

インターネットに接続していなくても自分のPCの中だけでWordPressを動かすことができるローカル環境を「Local by Flywheel」を使って簡単に構築する手順をご紹介します。

WordPress用の無料のローカル開発ツール DevKinstaを使ってみた! | 株式会社ベクトル

WordPressの運用に特化したホスティングサービス「Kinsta」が無料で提供しているローカル開発ツール「Devkinsta」のインストールから基本的な使い方までをご紹介します。

STEP
1

本番環境のデータを開発環境に複製

本番環境のデータを開発環境に複製します。

たった3ステップでサイトの引っ越しが完了するプラグイン「All-in-One WP Migration」が簡単すぎ! | 株式会社ベクトル

当ブログでも何度か WordPressサイトの引越し関連の記事を書いてきましたが、今回紹介するブラグイン「All-in-One WP Migration」は管理画面からの操作だけでサイトの引っ…

ただ、本番サイトで UpdraftPlus などでバックアップをとっている場合は、バックアップファイルまでエクスポートしてしまうとデータ容量が大きくなりすぎるので、下記の記事を参考にエクスポート対象から除外してください。

All-in-one WP Migration で特定のディレクトリを除いてエクスポートする方法 | 株式会社ベクトル

All-in-one WP Migration で特定のディレクトリを除外できる Folder Excluder for AIO WP Migrationr プラグインの使い方をご紹介します。

STEP
2

開発環境でG3に切り替え

本ページ下部の「G3への切り替え作業例」を参考に作業してください。

STEP
3

開発環境からG3に切り替えたサイト情報をエクスポート

プラグイン All in One WP Migration でエクスポートします。

STEP
4

本番環境のデータを再度エクスポート

開発環境で作業中に本番サイトを更新した場合や、移転トラブルが発生した時に備えて念の為プラグイン All in One WP Migration で再度エクスポートします。

STEP
5

本番環境にデータを移転

開発環境でG3に切り替えたサイトを All in One WP Migration で本番環境にインポートします。

STEP
6

B. バックアップをとった上で本番環境で作業する

バックアップをとる

まずは以下のプラグインなどでバックアップを設定します。

バックアップ用プラグイン UpdraftPlus を使ったWordPressのバックアップ・復元 | 株式会社ベクトル

WordPressのバックアップはとっていますか?今回紹介するUpdraftPlusなら簡単にバックアップ&復元をする事ができます。

STEP
1

G3への切り替え作業を行う

本ページ下部の「G3への切り替え作業例」を参考に作業してください。

※もしうまく行かなくて復元する場合、作業した内容もとっておきたい場合は復元前に一度バックアップをとってください。

STEP
2

G3への切り替え作業例

トップページコンテンツエリアに配置したウィジェットの調整

G3版ではトップページコンテンツエリア上部のウィジェットはありませんので、トップページに指定した固定ページにブロックを使って書き換えてください。全く同じようにはならない部分もありますが、概ねより高機能なブロックが用意されています。
どうしてもウィジェットを使いたい場合は以下を参考にトップページコンテンツエリア上部を追加するコードを書いてください。

Lightning G3 でトップページコンテンツエリア上部ウィジェットエリアを設定する | 株式会社ベクトル

Lightning G3 では トップページコンテンツエリア上部ウィジェットを廃止しているので、使いたい方は下記のコードを子テーマのfunctions.phpなどに貼り付けてください。fu…

STEP
1

Lightning無料版をインストール・有効化

STEP
2

外観 > カスタマイズ > Lightning 機能設定 で Generation3 を選択

STEP
3

Lightning G3 Pro Unit をインストール・有効化

STEP
4

G3 Pro Unit のライセンスキーを登録

設定 > G3 Pro Unit 設定 画面からライセンスキーを登録してください。

STEP
5

必要に応じて各種調整

STEP
6