MevvBridge のドキュメント

サイトを壊さずに Elementor を止める。

MevvBridge は変換ツールではなく、互換性のための橋渡しです。認識できたものはお客様自身の Elementor データから作り直し、それ以外は Elementor がまだ有効なうちに見たままの姿で取り込みます。このページでは、二つの手順、編集できるまま残るもの、凍結されるもの、元に戻す方法、そして意図的に行わないことを説明します。

インストール

MevvBridge には WordPress 6.0 以降と PHP 8.1 以降が必要です。完全に無料で、Pro 版はありません。制限された機能は一つもありません。

Elementor が有効なうちにインストールしてください。凍結レーンは Elementor 自身の描画結果から取り込みます。Elementor を止めた状態で引き継ぎを実行すると、結果は空になります。

  1. プラグインをアップロードして有効化します。Elementor はまだ削除しないでください。
  2. 管理画面の左メニューから MevvBridge を開き、レポートを読みます。
  3. 引き継ぐを押してください。何も削除されず、どのページも編集されません — 凍結される要素の見た目が取り込まれるだけです。
  4. Elementor を無効化し、各ページを見て回ります。
  5. すべて問題なければ、Elementor を削除できます。
  6. 必要に応じてブロックに変換を押してください。この手順のあとはコンテンツがネイティブの WordPress になり、MevvBridge 自体も削除できます。

手順 4 のあとに不具合が見つかったら、Elementor を再び有効化してください。MevvBridge は自ら身を引きます。

仕組み

MevvBridge は _elementor_data の投稿メタ — 決して削除しない、お客様の元データ — を読み取り、すべての要素を二つのレーンのいずれかに振り分けます。

生きたままのレーン
認識できた要素は、リクエストのたびにお客様のデータからマークアップも CSS も作り直されます。編集できるまま、レスポンシブなまま残ります。
凍結レーン
それ以外は、Elementor がまだ有効なうちに一度だけ取り込まれます。要素の描画済み HTML と、その要素を対象とする CSS ルールだけです。それらは元のとおりに出力されます。編集はできませんが、壊れることもありません。

判定はブラックリストではなく、ホワイトリストです。「これは認識できる」という誤りはページを壊しますが、「これは認識できない」という誤りは編集できなくなるだけです。サードパーティのウィジェットは意図的にホワイトリストの外に置いています。その設定スキーマは、当社からは見えないからです。

ブロックへ変換するまで、post_content には一切手を触れません。MevvBridge は the_content の時点で処理に加わり、ページをその場で生成します。これを行うのは、移行元のページビルダーが一つも有効でないときだけです。Elementor を入れ直せば、この橋は退きます。

レポート — 移行する前に読んでください

MevvBridge の管理画面は、左メニューの MevvBridge にある一つだけです。管理者権限が必要で、操作はすべてそこで行います。

スキャンは、投稿タイプを問わず、Elementor のデータを持つ公開済みコンテンツを探します。これは重要です。ヘッダー、フッター、テンプレートライブラリはそれぞれ独自の投稿タイプで保存されており、固定ページと投稿だけを見るスキャンでは取りこぼしてしまいます。

サマリー
ページ数、要素数、そしてそのうち何個が凍結されるか。
一覧表
コンテンツ 1 件につき 1 行です: コンテンツ · 種類 · 稼働中 · 凍結されます · 凍結される対象。最後の列には、凍結されるウィジェットの種類とその件数が示されます。
動的コンテンツに関する警告
⚠ 印が付きます。リクエストのたびに変わるコンテンツ — 商品グリッドや投稿一覧です。凍結すると、取り込んだ時点の表示のまま固定されます。
変換できないコンテンツ
⛔ 印が付きます。凍結すると動かなくなる要素 — チェックアウトフォーム、お問い合わせフォーム、ログイン、スライダーです。これらを含むページはブロック変換の対象から外され、Elementor のまま残されます。

二つは別の問題として、意図的に切り分けています。動的とは情報が古くなること、危険とは動かなくなることです。

上部のステータスチップは、MevvBridge がページを生成しているときは有効、元のページビルダーがまだ有効なあいだは元のプラグインが有効と表示します。

ステップ 1 — 引き継ぐ

この手順は Elementor を削除しませんし、ページを一つも編集しません。行うのは取り込みだけです。

  • 凍結されるすべての要素の描画済み HTML。Elementor 自身のフロントエンド描画から取得します。
  • その要素を対象とする CSS ルールだけ。切り替え後もルールが効き続けるよう、ページ単位のスコープ接頭辞は取り除かれます。
  • アイコンおよびアイコンボックス要素の SVG。これらは生きたままのレーンに残りますが、アイコン自体は描画結果の中にしか存在しません。SVG が見つからない場合は、何も出力しません。勝手に作ったアイコンを出すほうが悪いからです。
  • 移行元のプラグインがフロントエンドに実際に出力していたスタイルシート。アップロードフォルダーへ複製し、その後あらためて読み込みます。
  • 有効なキットに設定された Elementor のグローバルカラーとタイポグラフィ。お客様のページがすでに参照しているのと同じ CSS 変数として再出力します。
  • Elementor が有効なときにだけテーマが出力するインライン CSS。

取り込んだ要素は投稿メタではなく専用のテーブルに保存されるため、リクエストのたびに読み込まれることはありません。

サイト全体を一度のリクエストで取り込みます。非常に大規模なサイトでは PHP の実行時間制限に達することがあります。これは既知の制約であり、黙って失敗するわけではありません。結果の通知には、取り込んだ要素の数と、最初に発生したエラーが表示されます。

ステップ 2 — ブロックに変換

任意の手順で、手順 1 を実行したあとにだけ選べます。標準のブロックマークアップを post_content に書き込むため、コンテンツは WordPress ネイティブになり、MevvBridge を削除できるようになります。

  1. 認識できた要素は mevvsoft/* ブロック — つまり MevvBlocks のブロックになります。
  2. 凍結された要素は、CSS を内側に埋め込んだ core/html ブロックになります。そのため、すべてのプラグインが無くなっても残り続けます。
  3. 書き込みを行う前に、元の post_content_mevvbridge_onceki_icerik の投稿メタにバックアップされます。

変換はページ単位で、全部か無かです。凍結された要素の取り込み結果が無い場合、そのページは中途半端に書き込むのではなく、まるごと飛ばされます。半分のページは、何もしないより悪いからです。動かなくなる要素を含むページも同様に飛ばされ、通知にその名前が示されます。

この手順のあと、これらのページを編集するには MevvBlocks が必要です。閲覧には必要ありません。マークアップは標準的で、凍結部分もコアの HTML ブロックだからです。

なぜコアのブロックにしないのか。WordPress 7.1 に至っても、コアブロックの属性にはブレークポイントという考え方が無いからです。基準としたトップページでは、生きたままの 35 要素のうち 23 要素がタブレットまたはモバイル用の値を持っていました。それを core/group として書き出せば、レスポンシブ性かピクセル単位の再現性か、どちらかを捨てることになります。

編集できるまま残るもの

次の Elementor 要素タイプは、お客様のデータから作り直され、生きたままのレーンに残ります:

containerheadingtext-editorbuttondividerimagetestimonialiconicon-boxicon-listshortcode

ショートコードは凍結せず、その場で実行します。ショートコードを凍結すれば、出力が取り込み時点のまま固定されてしまうからです。

次の三つのサードパーティ製ウィジェットには対応するネイティブのブロックがあるため、凍結せずに置き換えます:

uael-woo-products
商品ブロックになります。表示件数、デスクトップ/タブレット/モバイルのカラム数、並び順、カテゴリーの絞り込みを引き継ぎます。
uael-woo-categories
商品カテゴリーブロックになります。レイアウト、カラム数、タイトルの位置、絞り込みルールを引き継ぎます。
wpforms
WPForms のショートコードを収めたショートコードブロックになります。これは当社のフォームエンジンではありません。元のウィジェットも WPForms を呼び出していただけで、ショートコードも同じことをします。

認識できても対応するブロックが無い種類は、真似をせずに凍結します。おおよその置き換えは、静かな破損にほかなりません。

凍結とは、実際には何を意味するのか

凍結された要素は見た目が同じで、マークアップとしても機能し続けます。ただし:

  • MevvBridge でもブロックエディターでも、生の HTML を超える編集はできません;
  • 動的コンテンツを表示していた場合、取り込んだ日の内容がそのまま表示され続けます;
  • JavaScript を必要としていた場合 — スライダー、カルーセル、アコーディオンなど — 凍結された写しは中身を縦に並べて出力します。対話性を与えていたスクリプトが失われているからです。

この最後の例こそ、スライダーとカルーセルが危険な要素の一覧に入っている理由です。MevvBridge は、これらを含むページを変換しません。移行元プラグインのスクリプトを持ち越す案は却下しました。そのスクリプトは、ビルダー自身のフロントエンドランタイムと、ページごとの設定に依存しているからです。

凍結された要素をふたたび自分の手に取り戻すには、移行元のプラグインを入れ直すか、その要素を削除してブロックで作り直してください。

ヘッダーとフッターのテンプレート

ページ本文だけを持ち越す移行は、気づかないうちにフッターを失います。MevvBridge は Header Footer Elementor 自身の設定を読み取り、移行元のヘッダーとフッターのテンプレートを、その場所に出力します。

テーマ用のレシピは Astra、GeneratePress、Storefront に用意されています。お使いのテーマにレシピが無い場合は、何も出力しません。既存のヘッダーを外せないテーマにヘッダーを後付けすれば、確実にヘッダーが二つになるからです。MevvBlocks に該当するテンプレートがすでにある場合、MevvBridge はそちらに譲ります。

元のクラス名はそのまま再現されるため、以前の構成から受け継いだ CSS も効き続けます。

元に戻す

どの時点でも、何も削除されません。_elementor_data は元の場所にそのまま残ります。MevvBridge はそれを読むだけで、書き込むことはありません。

ブロック変換の前なら
Elementor を再び有効化してください。MevvBridge はそれを検知し、コンテンツフィルター、スタイルの保管、グローバル設定、ヘッダー/フッターの引き継ぎから手を引きます。取り消すべきものは何もありません。
ブロック変換のあとなら
元のコンテンツは、変換された各ページの _mevvbridge_onceki_icerik 投稿メタに入っています。これ用のボタンはありません。WP-CLI で復元してください。

復元には一つ落とし穴があります。wp_update_post() はエスケープ済みの入力を前提とし、自らそれを解除します。wp_slash() を通さずにバックアップを書き戻すと、ブロック属性内のエスケープ列がバックスラッシュを失い、SVG が画面に u003csvg という文字列のまま表示されます。

wp eval '
foreach ( get_posts(["post_type"=>"any","numberposts"=>-1]) as $p ) {
  $y = get_post_meta( $p->ID, "_mevvbridge_onceki_icerik", true );
  if ( $y ) wp_update_post([ "ID"=>$p->ID, "post_content"=>wp_slash($y) ]);
}'

そのあとでページキャッシュを消してください。LiteSpeed の場合は wp litespeed-purge all です。

無料版と Pro 版

説明すべき線引きはありません。MevvBridge は変換の手順も含めて、すべて無料です。制限された機能はなく、ライセンスキーもなく、Pro 版もありません。

これは意図した立場です。このプラグインは、サブスクリプションから抜け出すために存在します。その出口に料金を課すのは、色を変えただけの同じ罠でしょう。

うまく動かないとき

レポートが空になる
Elementor のデータを持つ公開済みコンテンツがありません。下書きのページはスキャン対象外です。
引き継ぎで何も取り込まれない
Elementor がすでに無効化されています。もう一度有効化し、引き継ぎを実行してから、無効化してください。
「ブロックに変換」がグレーアウトしている
手順 1 がまだ実行されていません。条件は引き継ぎを実行したかどうかであり、何かが凍結されたかどうかではありません。凍結された要素がゼロのサイトは最良の状態であり、そこで締め出すべきではないからです。
変換で一部のページが飛ばされた
凍結された要素の取り込み結果が無かったか、凍結すると動かなくなる要素をそのページが含んでいます。通知にはその件数が、レポートの表には ⛔ 印とともに名前が表示されます。
Elementor を止めたら文字組みや余白がずれた
Elementor を有効にした状態で、引き継ぎをもう一度実行してください。スタイルの取り込みは、サイトがフロントエンドに実際に出力したものを計測します。そのため管理画面からではなく、フロントエンドのリクエスト上で実行する必要があります。
ページが以前のままに見える
全ページキャッシュが古い HTML を返しています。キャッシュを消してください。LiteSpeed なら wp litespeed-purge all です。URL に適当なクエリ文字列を付け足せば、キャッシュを経ないページを確認できます。
フッターが二つ表示される
お使いのテーマにレシピが無いか、MevvBlocks のフッターテンプレートも有効になっています。フッターを出力しているのが一つだけであることを確認してください。
引き継ぎまたは変換がタイムアウトした
どちらも一度のリクエストで実行されます。大規模なサイトでは、そのリクエストの PHP 実行時間制限を引き上げるか、負荷の少ない環境で実行してください。

できないこと

以下は、この製品が自らについて正直に述べたものです。いずれも不具合ではありません。

  • Elementor のみ対応。Beaver Builder は、身を引く判断のためには移行元プラグインとして認識されますが、このバージョンに Beaver の読み取り機能はありません。
  • サードパーティのウィジェットは必ず凍結されます。非公開の設定スキーマを再現する試みは実際に検証し、試したすべての事例で失敗しました。凍結が、正直な結論です。
  • 凍結された要素は編集できず、ひとりでに編集可能になることもありません。生きたままのレーンへ引き上げる機能は、今後の課題です。
  • 動的コンテンツは取り込み時点で固定されます。凍結された商品グリッドが、商品カタログの変化に追従することはありません。
  • フォーム、チェックアウト、ログイン、スライダー、カルーセルを含むページは、一切変換されません。それらは Elementor のまま残ります。
  • 持ち越されるのはヘッダーとフッターのテンプレートだけです。Elementor Pro のテーマビルダーによる個別ページ、アーカイブ、ポップアップは対象外です。
  • フォームエンジンはありません。WPForms の置き換えが引き継ぐのは呼び出しだけで、フォームを出力するのは引き続き WPForms です。
  • 編集用の画面はありません。MevvBridge が行うのは描画です。変換後のページの編集は MevvBlocks の役目です。
  • ヘッダー/フッターの引き継ぎは、三つのテーマレシピと Header Footer Elementor 自身の設定に限られます。
  • 取り込んだ内容は専用のテーブルに保存されるため、WordPress の WXR エクスポートには含まれません。それでも復旧は安全です。元データは一度も削除されていないので、移行元のプラグインを入れ直して、もう一度取り込むだけです。
  • どちらの処理も一度のリクエストで実行され、分割処理は行いません。