序文#
pjax の部分更新を開始した後、次のページに移動する際には記事関連ファイルのみをロードする必要があり、ほとんどのファイルを再度ロードする必要はありません。これにより、ウェブサイトの負荷が大幅に低減されます。訪問者にとっては、硬直した画面遷移がなく、ユーザーエクスペリエンスも向上します。
ただし、prism コードハイライトも同時に有効にしている場合、記事ページに移動する際に prism.js ファイルが再度ロードされず、結果として記事内のコードハイライトが無効になります。
このテーマに付属の Prism コードハイライトの再ロード機能はこのような状況では機能しないため、他の解決策を探さなければなりません。
このような状況に対するいくつかの解決策がオンラインで提案されていますが、ここではその中で最も簡単な WordPress 向けの解決策に焦点を当てます。
関連ファイルの変更#
方法は非常に簡単で、1 つのファイルを変更するだけです。Asky シリーズのテーマの場合、変更するファイルの場所は/wp-content/themes/ASky/js/jquery.pjax.jsです。別のタイプのテーマの場合は、この js ファイルの名前を検索することをお勧めします。
変更すべき位置は、以下の図に示すように、312 行目の下です。
関連するコードは次のとおりです：
//Prism Reload
if (container.contents.find("code[class*='language-']").length > 0)
$.getScript("/wp-content/plugins/ank-prism-for-wp/out/prism-js.min.js");//Your Prism.js location
Prism プラグインを使用しているため、最後の行のファイルの場所はプラグインで使用されている prism.js の場所です。
設定が完了すると、コードハイライトを正常に使用できるようになります。また、CDN を使用している場合、キャッシュが長持ちする可能性があるため、CDN コンソールでこのファイルを手動で更新することができます。更新する際には、ウェブサイトが読み込んでいる jquery.pjax.js ファイルの後に？ver=x.x.x があるかどうかを確認し、ある場合はそれを含めることを忘れないでください。