【HTML／OGP画像】OGP画像の設定でうまくいかなかったことの備忘録

ワードプレスではないCMSのホームページについて、OGPの画像設定をした際のあれこれを備忘録として書きます。

１．前提条件

・ワードプレスではないので実質HTMLのmetaタグの操作。
・http://独自ドメインで公開されているホームページ。
・このCMSはプラグイン等はあまりないと思う。

２．事前にやったこと

ワードプレスばかり触っていると、テーマやプラグインにOGP設定があるのでHTMLレベルで確認することは無かったです。

もうひとつhttpsじゃなくhttpというのも少しひっかかったので（根拠はない💦）、httpでかつhtml直書きでogpに関するタグ調整をやってみようと思いました。

ネット検索でいろーんな情報は得られましたが、最終的には公式の記述を参考にしました。

Open Graph protocol

３．自分なりの正解パターンを得る

ここからは、上記の公式サイトやネット情報から自分なりに描いた正解パターンをもとに、具体的に記述していきます。