tweet.inc.php_ver2.1

このプラグインには新版があります。最新版についてはこちらのページを参照してください。

tweet.inc.php

PukiwikiにTwitterの単体のツイートを埋め込むだけのプラグインです。ツイートが読み込めないときのフォールバックを設定できます。遅延読み込みにも対応しています。

PukiwikiにTwitterの単体のツイートを埋め込むだけのプラグインです。

TLの複数のツイートを埋め込んだり検索結果を表示するような高度な機能は備えていません。JavaScriptを利用しているので自分のpukiwikiサーバにはほとんど負荷をかけません。自分のpukiwikiを「はてなダイアリー」的なブログのように利用するために自作して自分だけで使っていたプラグインですが、せっかく作ったので公開しておきます。

ver1.0と比べての変化点は、TwitterのサイトからJSONでツイート内容を取得してキャッシュしておく機能が付いた点です。また、ver2.0からver2.1に変わるときにキャッシュファイルの形式を変更しました（拡張子も.datから.txtに変更し、互換性はありません）。

しくみ

Twitter Publishで発行されるHTMLタグを出力するだけなので単純な構造です。プラグインの第1引数にツイートIDかツイートのURLのどちらかを記載します。これによって、旧版ver1.0ではフォールバックを記載しておくことができましたが、ver2.0以降ではJSONキャッシュから自動でフォールバックが作成されます。

#tweet(1375069974583074816) // ツイートIDを書く場合
#tweet(https://twitter.com/m0370/status/1375069974583074816) // ツイートURLを書く場合

上記のように記載すれば、下記のようなツイートが表示されます。

Twitter #この7文字を見ただけで心ときめく人がRTしてくれる

— レ点.bot💉💊🧬 (@m0370) March 25, 2021

昔すぎるツイートは読み込めません

ツイートのURLでもツイートIDでも使用できるようにしていますが、ツイートIDかどうかを判定するところを暫定的に9桁で判定しているので、非常に昔のツイート（ツイートIDが8桁以下だった時代）のツイートは読み込めません。

ぼくがTwitterを始めた2007年6月の時点ですでにツイートIDは9000万台なので、ツイートIDが8桁と言えば2007年夏頃までの古いツイートでしょうか…（ちなみに当時のTwitterはまだインターフェイスが日本語化されておらず非常にマイナーでした）。

Twitter #この7文字を見ただけで心ときめく人がRTしてくれる

— レ点.bot💉💊🧬 (@m0370) March 25, 2021

遅延読み込みを有効にするには

lazysizes.jsを使用しているサイトでは遅延読み込みを使用することができます。遅延読み込みをしない場合のツイート埋め込みは、ページ読み込み速度を評価するPagespeed Insightのスコアが非常に悪くなり、ひいてはSEOにも悪影響を与えるので、lazysizes.jsを使っているサイトでは設定の遅延読み込み部分をTRUEにすることをオススメします。

define('PLUGIN_TWEET_LAZYLOAD', 'TRUE'); //遅延読み込み有効（lazysizes.jsが必要です）
define('PLUGIN_TWEET_LAZYLOAD', 'FALSE'); //遅延読み込み無効

なお、この設定をTRUEにする場合のlazysizesは、blockquote要素でも遅延読み込みを有効にするためのunveilhooksプラグインを併用する必要があります。当サイトではJavaScript用CDNのjsdelivrを使っていますので、下記のHTMLタグをスキンに設置しておいて外部からこのjsファイルを読み込ませています。もちろんローカルに設置してもかまいません。

<script src="https://cdn.jsdelivr.net/combine/npm/lazysizes@5,npm/lazysizes@5/plugins/unveilhooks/ls.unveilhooks.min.js" async></script>

プラグインの中身（ver2.1）

<?php
// ver1.0 初期バージョン
// ver2.0 JSON取得してキャッシュする。widgets.jsはローカルに置くようにした。
// ver2.1 データ保管方式を .datから.txtに変更、ブラウザのnative loading="lazy"などに対応

define('PLUGIN_TWEET_LAZYLOAD', FALSE); // lazysizes.jsを使っているサイトはTRUEに、使っていないならFALSEに

//設定ここまで

function plugin_tweet_convert()
{
$tw = func_get_args();
preg_match('/[0-9]{9,30}/', $tw[0], $tweetids); //URLでもツイートIDでも投稿できるように
$tweetid = end($tweetids);
$tweeturl = 'https://twitter.com/user/status/' . $tweetid ;
$datcache = CACHE_DIR . 'tweet/' . $tweetid . '.txt';

//オプション設定
$options = array(
	CURLOPT_SSL_VERIFYPEER => false,
	CURLOPT_RETURNTRANSFER => true,
	CURLOPT_TIMEOUT => 3 //タイムアウト(秒)
);

if(file_exists($datcache)){
	//キャッシュがある場合
	$json = file_get_contents($datcache);
	$arr = json_decode($json, true);
	$html = html_entity_decode($arr['html']);
} else {
	//キャッシュがない場合
	$json_url = 'https://publish.twitter.com/oembed?maxwidth=550&dnt=true&url='. urlencode($tweeturl);
	$ch = curl_init($json_url);
	curl_setopt_array($ch, $options);
	$json = curl_exec($ch);
	$arr = json_decode($json, true);
	curl_close($ch);
	
	if ($arr === NULL) {
		//json取得失敗
		$html = '<blockquote class="twitter-tweet"><a href="https://twitter.com/user/status/' . $tweetid . '">' . $tw[1] . '</a></blockquote>';
	} else {
		//json取得成功
		$html = html_entity_decode($arr['html']);
		//キャッシュする
		file_put_contents($datcache, $json);
	}
}

if (PLUGIN_TWEET_LAZYLOAD) {
	//scriptをlazyloadに置換
	$twjs1 = '<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>';
	$twjs2 = '<div class="lazyload" data-script="https://platform.twitter.com/widgets.js"></div>';
	$html = str_replace($twjs1, $twjs2, $html);
}

return <<<EOD
$html
EOD;
}
?>

更新日：2021-07-03 閲覧数：648 views.