OGPの画像を表示させたい。
Q&A
Closed
解決したいこと
OGPで設定した画像が表示されない。
発生している問題・エラー
index.htmlファイルのhead要素の中にOGPの設定を記述。
<!-- ogp -->
<meta property="og:title" content="HP" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://isp333study.starfree.jp/sample/" />
<meta property="og:image" content="image/antique.jpg" />
<meta property="og:site_name" content="HP" />
<meta property="og:description" content="雑貨店" />
path
htmlフォルダ
-index.html
-cssフォルダ
-style.css
-imageフォルダ
-antique.jpg
必要なフォルダ・ファイルをレンタルサーバーに載せてサーバー上に表示されてるか確認。
表示されていることを確認できたら、URLをコピーしてラッコツールズの「OGP確認」を行う。
サイトの名前や説明は表示されているが、画像が表示されていない。
自分で試したこと
レンタルサーバーに載せた画像がサーバー上に表示されるか検証。
レンタルサーバーURL/htmlフォルダ/image/antique.jpg
↓
ちゃんとサーバー上に表示されていることを確認。
index.htmlのOGP設定の画像をサーバー上で表示されたURLに変更する。
<!-- ogp -->
<meta property="og:title" content="HP" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://isp333study.starfree.jp/sample/" />
<!-- 変更 -->
<meta property="og:image" content="http://レンタルサーバー.jp/htmlフォルダ/image/antique.jpg" />
<meta property="og:site_name" content="HP" />
<meta property="og:description" content="雑貨店" />
結果
変化なし。
0