facebookやtwitterのようにurlを貼るだけで、イメージ画像や説明文が表示されるには、被リンク側がOpenGraphのためmeta情報を書き、表示側がそれを表示する必要がある(PHP版)

1, 被リンク側が、情報をヘッダに書いておく

<meta property="fb:admins" content="XXXXXXXXXXXXXXX" />
<meta name="twitter:card" content="summary_large_image">
<meta name="og:title" content="投稿時に表示されるサイト名">
<meta name="og:description" content="投稿時に表示される説明文">
<meta property="og:image" content="画像のURLをフルパスで指定">

2, phpから、その情報を読み込んで、表示する
※表示形式は各サイトで、勝手にデザインする
https://github.com/scottmac/opengraph/

<?php

require_once('OpenGraph.php');  
$url = 'https://paypay.ne.jp/';
//URLを指定  
$graph = OpenGraph::fetch($url);  

// 適当にブラウザに表示する
printf("<a href='%s' target='_new' rel="noopener noreferrer">\n", $graph->url);
printf("%s<br>\n", "<div style='background:#FFFFFF; padding:10px; border-radius: 10px; border: 2px dotted #ff0000; height:200; width:500;'>");
printf("%s<br>\n", $graph->url);
printf("<img src=%s height=150 width=150  align='left'>", $graph->image);
printf("<b>%s</b><br>", $graph->title);
printf("%s<br>\n</div>", $graph->description);
print("</a>");

<?php

require_once('OpenGraph.php');

$url = 'https://paypay.ne.jp/';

//URLを指定

$graph = OpenGraph::fetch($url);

// 適当にブラウザに表示する

printf("<a href='%s' target='_new' rel="noopener noreferrer">\n", $graph->url);

printf("%s<br>\n", "<div style='background:#FFFFFF; padding:10px; border-radius: 10px; border: 2px dotted #ff0000; height:200; width:500;'>");

printf("%s<br>\n", $graph->url);

printf("<img src=%s height=150 width=150 align='left'>", $graph->image);

printf("<b>%s</b><br>", $graph->title);

printf("%s<br>\n</div>", $graph->description);

print("</a>");

関連記事