【Elementor】画像が表示されないときの対処法(編集画面では表示されるが、プレビューや実際のページで小さいリプレース画像が表示される)

wordpress-prograshi(プロぐらし)-kv WordPress
記事内に広告が含まれていることがあります。

Elementorで編集画面でセットした画像が、プレビューや実際のWEBページで見ると表示されないことがあります。

画像が見つからないときに表示されるリプレイスメントのアイコンが表示されます。


この原因と対処法についてまとめています。


原因

ElementorはWordPressのサイトURL設定を基に画像のパスやフォントの読み込みを行います

そのため、WordPressアドレス(URL)とサイトアドレス(URL)が一致していない場合に、プレビュー時に問題が発生します。

特に、HTTPSとHTTPの混在や、www.の有無が原因となることが多いです。

例えば、サイトアドレスがhttps://example.comなのに、ElementorのプレビューURLがhttp://example.comになっていると、画像やフォントが読み込まれません。


今回の場合は、ドメイン自体はhttpsにしているのに、WordPressアドレス(URL)とサイトアドレス(URL)がhttpになっていることでした。


対処法

対処法は簡単です。

WordPressの管理画面で「設定 → 一般」へと進みます。


例えば、WordPressアドレス(URL)とサイトアドレス(URL)がhttpになっている場合は、これを修正します。

 ↓ httpsに直します。


以上で修正は完了です。

無事にプレビューや本番環境でページが表示されました。


もし、編集画面では画像が表示されるのに、プレビューや実際のWEBページで見ると表示されないという場合は試してみてください。

タイトルとURLをコピーしました