自作プラグイン/ogp.inc.php
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
]
開始行:
** ogp.inc.php [#h2f1c3f1]
|RIGHT:100|LEFT:360|c
|~サマリ|OGPを取得してブログカードを表示する|
|~リビジョン|1.4|
|~対応バージョン|1.5.1|
|~投稿者|[[m0370]]|
|~投稿日|&new{2019-09-14 (土) 07:28:03};|
はてなブログのようなブログカードを実装するプラグインを探...
**ver 1.4 [#b9d50472]
画像が存在しない場合に画像を非表示（noimg）とするよう対応...
''注：''一部のWordpressプラグインなど、OGP画像ファイルがj...
-私のサイトでは力技として、cache/ogpフォルダに保存されるg...
*本体 [#vb43c87b]
下記のスクリプトをogp.inc.phpと名前を付けて保存し、plugin...
<?php
// 'ogp' plugin for PukiWiki
// Twitter: @m0370
// ver1.31 (2020.5.5)
// キャッシュ関連のバグを修正
// ver 1.4 (2020.7.16)
// HTMLパース,noimg対応。画像がない場合や画像ファイルの...
// 一部のWordpressプラグインなど、OGP画像がjpg拡張子にな...
function plugin_ogp_convert()
{
$ogpurl = func_get_args();
$uri = get_script_uri();
$ogpurlsp = (explode('://', $ogpurl[0]));
$ogpurlmd = md5($ogpurlsp[1]);
$datcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.dat';
$gifcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.gif';
$jpgcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.jpg';
$pngcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.png';
if(file_exists($pngcache)) { $imgcache = $pngcache ; }
else if(file_exists($gifcache)) { $imgcache = $gifcache...
else { $imgcache = $jpgcache ; }
if(file_exists($datcache) && file_exists($imgcache)) {
$ogpcache = file_get_contents($datcache);
$ogpcachearray = explode("<>", $ogpcache);
$title = $ogpcachearray[0];
$description = $ogpcachearray[1];
$src = $imgcache ;
$imgfile = file_get_contents($imgcache) ;
} else {
require_once(PLUGIN_DIR.'opengraph.php');
$graph = OpenGraph::fetch($ogpurl[0]);
if ($graph) {
$title = $graph->title;
$url = $graph->url;
$description = $graph->description;
$src = $graph->image;
$title_check = utf8_decode($title);
$description_check = utf8_decode($description);
if(mb_detect_encoding($title_check) == 'UTF-8'){
$title = $title_check; // 文字化け解消
}
if(mb_detect_encoding($description_check) == 'UTF-...
$description = $description_check; // 文字化け...
}
$detects = array('ASCII','EUC-JP','SJIS','JIS','CP...
// 上記以外でもUTF-8以外の文字コードが渡ってきてた...
if(mb_detect_encoding($title) != 'UTF-8'){
$title = mb_convert_encoding($title, 'UTF-8', ...
}
if(mb_detect_encoding($description) != 'UTF-8'){
$description = mb_convert_encoding($descriptio...
}
$imgfile = file_get_contents($src);
$imginfo = getimagesize($src);
file_put_contents($datcache, $title . '<>' . $descrip...
$filetype = $imginfo[2];
if( $filetype == 1 ){
file_put_contents($gifcache, $imgfile) ;
} else if ( $filetype == 3 ){
file_put_contents($pngcache, $imgfile) ;
} else {
file_put_contents($jpgcache, $imgfile) ;
} //どの拡張子でもない場合どうするか(webp,gzip)、jpg...
} else return '#ogp Error: Page not found.';
}
if( filesize($imgcache) == 0 ){
$ogpurl[2] = "ogp-noimg" ;
}
if($ogpurl[1] == "amp"){
$imgtag = 'amp-img class="ogp-img" layout="fill"' ;
} else if($ogpurl[1] == "noimg") {
$ogpurl[2] == "ogp-noimg" ;
$imgtag = 'amp-img class="ogp-noimg" layout="nodisplay...
} else {
$imgtag = 'img class="ogp-img"' ;
// $imgtag = 'amp-img class="ogp-img ' . $ogpclass . '"...
}
$ogpurl[0] = htmlspecialchars($ogpurl[0]);
return <<<EOD
<div class="ogp $ogpclass">
<div class="ogp-img-box $ogpurl[2]"><$imgtag layout="fi...
<div class="ogp-title">$title</div>
<div class="ogp-description">$description</div>
<div class="ogp-url">$ogpurl[0]</div>
<a class ="ogp-link" href="$ogpurl[0]" target="_blank">...
</div>
EOD;
}
?>
*CSS [#l908cd38]
スタイルシートは自由にカスタマイズしてご利用下さい。下に...
/*OGP スタイルシート*/
.ogp {
position: relative;
z-index: 1; /* 必要であればリンク要素の重なりのベー...
word-wrap: break-word;
word-break: break-all;
border: 1px solid rgba(0,0,0,.1);
border-radius: 4px;
padding: 10px;
margin:20px 2px;
min-height: 100px;
max-height: 280px;
max-width: 480px;
overflow: hidden;
}
.ogp-link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-indent:-999px;
z-index: 2; /* 必要であればリンク要素の重なりのベー...
}
.ogp-title{
font-size: 100%;
font-weight:bold;
margin: 0 0 2px;
line-height: 1.3em;
color: #000;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ogp-description{
line-height: 1.5em;
font-size: 80%;
color: #000;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.ogp-url{
line-height: 1.8em;
font-size: 80%;
color: #7b8387;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.ogp-img-box{
float: right;
position: relative;
width: 100px;
height: 100px;
margin-left:10px;
}
.ogp-noimg{display:none;}
.ogp-img img{object-fit: cover;}
img.ogp-img{width: 100px;height: 100px;object-fit: cover;}
終了行:
** ogp.inc.php [#h2f1c3f1]
|RIGHT:100|LEFT:360|c
|~サマリ|OGPを取得してブログカードを表示する|
|~リビジョン|1.4|
|~対応バージョン|1.5.1|
|~投稿者|[[m0370]]|
|~投稿日|&new{2019-09-14 (土) 07:28:03};|
はてなブログのようなブログカードを実装するプラグインを探...
**ver 1.4 [#b9d50472]
画像が存在しない場合に画像を非表示（noimg）とするよう対応...
''注：''一部のWordpressプラグインなど、OGP画像ファイルがj...
-私のサイトでは力技として、cache/ogpフォルダに保存されるg...
*本体 [#vb43c87b]
下記のスクリプトをogp.inc.phpと名前を付けて保存し、plugin...
<?php
// 'ogp' plugin for PukiWiki
// Twitter: @m0370
// ver1.31 (2020.5.5)
// キャッシュ関連のバグを修正
// ver 1.4 (2020.7.16)
// HTMLパース,noimg対応。画像がない場合や画像ファイルの...
// 一部のWordpressプラグインなど、OGP画像がjpg拡張子にな...
function plugin_ogp_convert()
{
$ogpurl = func_get_args();
$uri = get_script_uri();
$ogpurlsp = (explode('://', $ogpurl[0]));
$ogpurlmd = md5($ogpurlsp[1]);
$datcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.dat';
$gifcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.gif';
$jpgcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.jpg';
$pngcache = CACHE_DIR . 'ogp/' . $ogpurlmd . '.png';
if(file_exists($pngcache)) { $imgcache = $pngcache ; }
else if(file_exists($gifcache)) { $imgcache = $gifcache...
else { $imgcache = $jpgcache ; }
if(file_exists($datcache) && file_exists($imgcache)) {
$ogpcache = file_get_contents($datcache);
$ogpcachearray = explode("<>", $ogpcache);
$title = $ogpcachearray[0];
$description = $ogpcachearray[1];
$src = $imgcache ;
$imgfile = file_get_contents($imgcache) ;
} else {
require_once(PLUGIN_DIR.'opengraph.php');
$graph = OpenGraph::fetch($ogpurl[0]);
if ($graph) {
$title = $graph->title;
$url = $graph->url;
$description = $graph->description;
$src = $graph->image;
$title_check = utf8_decode($title);
$description_check = utf8_decode($description);
if(mb_detect_encoding($title_check) == 'UTF-8'){
$title = $title_check; // 文字化け解消
}
if(mb_detect_encoding($description_check) == 'UTF-...
$description = $description_check; // 文字化け...
}
$detects = array('ASCII','EUC-JP','SJIS','JIS','CP...
// 上記以外でもUTF-8以外の文字コードが渡ってきてた...
if(mb_detect_encoding($title) != 'UTF-8'){
$title = mb_convert_encoding($title, 'UTF-8', ...
}
if(mb_detect_encoding($description) != 'UTF-8'){
$description = mb_convert_encoding($descriptio...
}
$imgfile = file_get_contents($src);
$imginfo = getimagesize($src);
file_put_contents($datcache, $title . '<>' . $descrip...
$filetype = $imginfo[2];
if( $filetype == 1 ){
file_put_contents($gifcache, $imgfile) ;
} else if ( $filetype == 3 ){
file_put_contents($pngcache, $imgfile) ;
} else {
file_put_contents($jpgcache, $imgfile) ;
} //どの拡張子でもない場合どうするか(webp,gzip)、jpg...
} else return '#ogp Error: Page not found.';
}
if( filesize($imgcache) == 0 ){
$ogpurl[2] = "ogp-noimg" ;
}
if($ogpurl[1] == "amp"){
$imgtag = 'amp-img class="ogp-img" layout="fill"' ;
} else if($ogpurl[1] == "noimg") {
$ogpurl[2] == "ogp-noimg" ;
$imgtag = 'amp-img class="ogp-noimg" layout="nodisplay...
} else {
$imgtag = 'img class="ogp-img"' ;
// $imgtag = 'amp-img class="ogp-img ' . $ogpclass . '"...
}
$ogpurl[0] = htmlspecialchars($ogpurl[0]);
return <<<EOD
<div class="ogp $ogpclass">
<div class="ogp-img-box $ogpurl[2]"><$imgtag layout="fi...
<div class="ogp-title">$title</div>
<div class="ogp-description">$description</div>
<div class="ogp-url">$ogpurl[0]</div>
<a class ="ogp-link" href="$ogpurl[0]" target="_blank">...
</div>
EOD;
}
?>
*CSS [#l908cd38]
スタイルシートは自由にカスタマイズしてご利用下さい。下に...
/*OGP スタイルシート*/
.ogp {
position: relative;
z-index: 1; /* 必要であればリンク要素の重なりのベー...
word-wrap: break-word;
word-break: break-all;
border: 1px solid rgba(0,0,0,.1);
border-radius: 4px;
padding: 10px;
margin:20px 2px;
min-height: 100px;
max-height: 280px;
max-width: 480px;
overflow: hidden;
}
.ogp-link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-indent:-999px;
z-index: 2; /* 必要であればリンク要素の重なりのベー...
}
.ogp-title{
font-size: 100%;
font-weight:bold;
margin: 0 0 2px;
line-height: 1.3em;
color: #000;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.ogp-description{
line-height: 1.5em;
font-size: 80%;
color: #000;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.ogp-url{
line-height: 1.8em;
font-size: 80%;
color: #7b8387;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.ogp-img-box{
float: right;
position: relative;
width: 100px;
height: 100px;
margin-left:10px;
}
.ogp-noimg{display:none;}
.ogp-img img{object-fit: cover;}
img.ogp-img{width: 100px;height: 100px;object-fit: cover;}
ページ名:
![[PukiWiki-official]](image/pukiwiki-official.png "[PukiWiki-official]")
