Firefox、Chromeでの文字化け

[ロイヤル]

お世話になります。
FirefoxとgoogleChromeにてヘッダーメニューのアイコン？が文字化けします
safariでは、正常表示するのでブラウザ側の問題でしょうか？

ちなみにDigiPressのこのページではFirefox、googleChromeともに
正常に表示するので
私の方のメニュー表示が何かの設定がおかしいでしょうか？

サイト
http://www.royal-techno.com/rabo-div/

添付ファイル:

添付ファイルを開くにはログインしてください。

[ロイヤル]

windows環境 Chrome表示できました。　firefox化けました。

[DigiPress サポート]

Chrome, FireFox, IE等、すべての対象ブラウザにて正常に表示できていません。

該当サイトでは以下のJavascriptエラーが発生しています。

3Font from origin ‘http://royal-techno.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.royal-techno.com’ is therefore not allowed access.

ソースを確認すると、サイトの表示ドメインは “http://www.royal-techno.com/” であるにも関わらず、CSSやJavascriptの読み込み元、つまりWordPress(およびテーマ等)のインストール先は “http://royal-techno.com/”(※wwwなし) となっています。

このため、アイコンフォントのデータも “http://royal-techno.com/” を基点としたURLからロードしようとしており、許可されていない別のサイトからリソースを読み込もう(クロスドメイン)とすると判断され、フォントデータが読み込まれていません。

“www.royal-techno.com” として表示するのであれば、テーマおよび全てのリソース(CSS, JS, 画像等)も 同じドメインから読み込まれなくてはなりません。

さくらインターネットに多いケースですが、今一度サーバーのコントロールパネルからドメインの設定を見直し、実際のドメイン環境からWordPressのリソースが読み込まれるようにしてください。

設定方法や詳細についてはこちらではサポート致しかねますので、必要な場合はご利用のホスティングサービス側にお問い合わせください。

[DigiPress サポート]

なお、何か表示に問題が発生した場合は、まずは以下のトラブルシューティングのチェック項目を確認し、対象の切り分けを行ってみてください。

トラブルシューティング

[ロイヤル]

ありがとうございます。

上記をふまえて修正してみます。

ご丁寧にありがとうございます。

[投稿者]

投稿