WordPressのElementorプラグインで「プレビューを読み込めませんでした」とエラーになる


WordPressでElementorのプラグインを使おうと思ったところ、

プレビューを読み込めませんでした

というエラーメッセージが表示されて編集ができない事象が発生しました。

Elementorのログとかも出てなく、何が原因がよく分からなかったが、なんとか解決できたので、内容を記載します。

テーマが原因

上記キャプチャの「さらに詳しく」をクリックすると以下の公式ページに飛びました。

公式のページで表示された解決方法がいくつかありました。
1つ1つ確認していくと、テーマの問題でした。

独自作成テーマを使用していて、デフォルトテーマに切り替えた時は、うまく読み込めたので、テーマが原因ということが分かります。

functions.phpが原因

テーマが悪いってことは、感覚的にfunctions.phpかなと思って調べてみました。
テーマは違うが、以下の記事を見つけることができました。

以下の記述で、デフォルトjqueryの読み込みをなくしていたのが原因でした。

functions.php
wp_deregister_script('jquery');

WordPressだと、デフォルトjqueryの読み込みをなくすのは、よくありそうです。

デフォルトjqueryの読み込みをなくすのはフロントのみとする

管理画面で編集している時は対象外にしたいので、is_admin関数を使うようにしたが、Elementorの編集時は管理画面と判断されませんでした。

どうやって判断すれば、と困っていたところ、Elementorのis_preview_modeという関数があることに、なんとか辿り着きました。

functions.php
function my_delete_local_jquery() {
  if (!\Elementor\Plugin::$instance->preview->is_preview_mode()) {
    wp_deregister_script('jquery');
  }
}
add_action( 'wp_enqueue_scripts', 'my_delete_local_jquery' );