WordPress5.5とSANGO v2.0.6へのアップデートの注意点

日本時間の2020/08/12にWordPress 5.5がリリースされました。WordPressのバージョンを5.5へ上げた際は、テーマとプラグインのアップデートも行ってください。

1. SANGO テーマ v2.0.6
2. SANGO Gutenberg プラグイン 1.5.3

WordPressとSANGOどちらにも大きな変更があるため、このページで注意点をまとめておきます。

1. アップデート後にブラウザのキャッシュを削除

→ WordPress、SANGOテーマ、Gutenbergプラグインのアップデートを行った後に、ブラウザのキャッシュを削除してください。

参考 ブラウザのキャッシュの削除方法

2. カスタマイズのjQueryの書き換え

WordPress5.5〜jQueryのバージョンが上がりました。SANGOでもこれに対応するための変更を行いました。

問題が発生するポイント

WP同梱のjQueryでは、$(function() {}というような記法では正常に動作しません。jQuery(function() {}のように$の代わりにjQueryという文字列を使う必要があります。

参考 WordPressでjQueryが動かない原因と正しい使い方

カスタマイズで追加したスクリプトに$を用いた記法が使われている場合、今回のアップデートにより動作しなくなる可能性があります。

対処法その1：カスタマイズで追加したスクリプトを書き換え

上記リンクで解説されているように$をjQueryに書き換えます。

対処法その2：jQueryをCDNから読み込むように変更

下記のコードを子テーマのfunctions.phpに追加します。これまでと同様に$を用いた記法が使用可能です。

// jQueryをCDNから読み込む
function setup_cdn_jquery() {
  wp_deregister_script('jquery');
  wp_enqueue_script(
    'jquery',
    'https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js', 
    array(),
    '',
    false
  );
}
add_action( 'wp_enqueue_scripts', 'setup_cdn_jquery', 100 );

↑ここではWordPress5.5〜提供されるjQuery と同バージョン（3.5.1）を読み込むような指定をしています。

3. 検索ボックスへのCSSやHTMLの変更

SANGO v2.0.6で検索ボックスのclass名に対してCSSをあてるように変更しました。検索ボックスのデザインが崩れてしまった場合、子テーマ内でsearchform.phpが上書きされている可能性が高いです。

対処法は、子テーマのsearchform.phpを開き、それぞれのHTMLタグのクラス名（class="◯◯"）が、親テーマのsearchform.phpのHTMLタグのクラス名と一致するように修正を加える必要があります。

4. プラグインも忘れずにアップデート

WP5.5に更新した後は、SANGO Gutenbergの最新バージョンをご利用ください。でないとリストブロック等のデザインが崩れます…。

その他の問題

クラシックエディターを使用している場合も注意

SANGOとは直接関係はありませんが、WordPress5.5でクラシックエディターに問題が発生したというツイートや記事をよく見かけます。クラシックエディターを利用している場合は、WP5.5への更新を少し様子見したほうが良いかもしれません。

プラグインが動かなくなる可能性も

WordPressのjQueryバージョン変更により、一部の更新が行われていないプラグインが正常に動作しなくなる可能性があります。