ワードプレスサイトの外部スクリプトが読み込み不全になってサイトが表示できなくなる事例と対処方法について解説いたします。
スクリプトやスタイルシートが外部のドメインから読み込まれている場合の注意点
独自制作のテーマで特に多いのですが、例えば下記のようなコードで外部のドメインからスクリプトやCSSがheader.phpが直接読み込まれている場合があります。
スクリプトの例
<script async src="https://外部ドメイン/名称.js"></script>
スタイル(デザイン)の例
<link rel="stylesheet" href="https://外部ドメイン/名称.css">
しかし、この例の読み込み方は、そのドメインに何らかの原因で障害が起こったり、配布が停止されたり、読み込み方法のルールが変わってしまった場合、読み込み不全になり、サイトの表示(レイアウト崩れや表示不全)や機能に悪影響を与えてしまう場合がございます。
スクリプトやスタイルシートを自ドメインから読み込むようにする
このような予想外のエラーを防ぐために、外部スクリプトや、外部CSSを自ドメイン内に置いておき、自サーバーから読み込む方が安全です。
この手順は下記のようになります。
広告スクリプトは自ドメイン内で置いておくことは禁止されていたり、うまく動作しないことが多い為ご注意ください
１ 外部ドメインから読み込まれているスクリプトを検索してGITHUBなどからダウンロードします
２ 現在のテーマのフォルダ内にそのスクリプトをFTPソフトウェアでアップロードします
３ そのスクリプトが読み込まれている部分を修正し、自サーバーから読み込まれるようにします
例としましてテーマフォルダ内のURLを取得して任意のフォルダからスクリプトを読み込むコードは下記のようになります
<script src="<?php echo get_template_directory_uri() ?>/テーマフォルダ内の任意のフォルダ/任意のスクリプト.js"></script>
get_template_directory_uri() 関数は使用中のテーマのフォルダのURLを取得できる関数になります。
ご参考になりましたら幸いです。
WordPress ワードプレスのレイアウト崩れや機能不全の原因調査と修正を経験豊かな技術者が代行いたします。お気軽にWPドクターまでご依頼・ご相談お送りください
