OGPを設定して、リンクを貼った時にサイトのアイコンを表示させる

OGPは、Open Graph protocolの略で、以下のようにリンクをSlackやTwitterに貼った時に、
アイコンや説明文を指定して表示させることができます。

設定は以下のようなmetaタグを、HTMLに書き込みます。

<meta property="og:locale" content="国">
<meta property="og:site_name" content="サイト名">
<meta property="og:title" content="ページのタイトル">
<meta property="og:type" content="サイトの区分（websiteとかblogとか）">
<meta property="og:url" content="サイトのURL">
<meta property="og:image" content="表示させたい画像">
<meta property="og:description" content="サイトの説明">

ちなみにこのサイトは以下のように設定しております。

<meta property="og:locale" content="ja_JP">
<meta property="og:site_name" content="Nな人のWebしるべ">
<meta property="og:title" content="OGPを設定して、リンクを貼った時にサイトのアイコンを表示させる">
<meta property="og:type" content="website">
<meta property="og:url" content="https://nnahito.com/">
<meta property="og:image" content="https://nnahito.com/images/nnahito.png">
<meta property="og:description" content="ソフトウェアエンジニアの戯言と備忘録">

[PR] おすすめの本

この記事を書いた人

Nな人（えぬなひと）。
Nは本名から取っています。
Laravelが大好きなPHPerで、WEBを作るときはLaravelを技術スタックに絶対推すマン。
PHP、Pythonと、昔はperlを書いていたP言語エンジニア。
最近はNimを書いたりしています。