Top>URL短縮対応画像遅延読込・画像リサイズプラグイン


タグPukiWiki, SEの良心, PukiWiki改造計画, URL短縮ライブラリ対応, 画像遅延読み込み, 画像リサイズ, ref, Lazy Load, プラグイン, 自動WebP化, ページ表示高速化, 次世代フォーマットでの画像の配信, PukiWiki用PDFビューアプラグイン, Lightbox, LCP対策, サンプル, 参照記事


2025/12/21 (日) 更新

URL短縮ライブラリ対応画像遅延読込・画像リサイズプラグイン  

項目内容
カテゴリープラグインPukiWiki拡張
公開日2025年08月26日
バージョン1.7.0

概要  

変更履歴  

refプラグイン書式  

ブロック型  

#ref(添付ファイル名|ページ名/添付ファイル名|URL[,ページ名]{[,nolazy][,lb:Lightbox画像グループ識別子][,left|center|right][,wrap|nowrap][,around][,noicon][,noimg][,nolink][,zoom][,999x999][,999%][,タイトル])
 

インライン型  

&ref(添付ファイル名|ページ名/添付ファイル名|URL[,ページ名][,nolazy][,lb:Lightbox画像グループ識別子][,noicon][,noimg][,nolink][,zoom][,999x999][,999%][,タイトル]);
&ref(添付ファイル名|ページ名/添付ファイル名|URL[,ページ名][,nolazy][,lb:Lightbox画像グループ識別子][,noicon][,noimg][,nolink][,zoom][,999x999][,999%]){タイトル};
 

resize_imageプラグイン書式  

ブロック型  

使用不可
 

インライン型  

&resize_image(画像ファイル名[,幅][,高さ][,画像品質][,アスペクト比維持=true][,遅延読み込みをしない=true]);
 

アクション型  

?plugin=resize_image&page=URL短縮ページ名&image=画像ファイル名&width=画像横ピクセル&height=画像縦ピクセル[&q=画像品質][&k|keepaspectrate=true(アスペクト比維持)]
 

PukiWikiエターナルウェア版設定ファイル  

ref.inc.php  

// 画像遅延読み込み・画像リサイズ対応(true:image_resizeプラグイン使用)
define('PLUGIN_REF_RESIZE_IMAGE', true);
// 画像表示にLightboxを利用する場合はtrueに設定
define('PLUGIN_REF_USE_LIGHTBOX', true);
// Lightbox表示中のスクロール禁止(true:スクロール禁止/false:禁止しない)
define('PLUGIN_REF_LIGHTBOX_NO_SCROLL', true);
// GIFファイル個別対応(GIFファイル拡張子)
// ※アニメーションGIFを含めGIFファイルを特別扱いしない場合はヌル('')を設定
define('PLUGIN_REF_GIF', '/\.(gif)$/i');
// PDFビューア対応(PDFファイル拡張子)
define('PLUGIN_REF_PDF', '/\.(pdf)$/i');
// 添付ファイルリスト出力プラグイン名
define('PLUGIN_REF_PDF_VIEWER', 'pdf_viewer');

/* 以下、PukiWiki標準プラグインの設定 */
// Horizontal alignment
define('PLUGIN_REF_DEFAULT_ALIGN', 'left'); // 'left', 'center', 'right'
// Text wrapping
define('PLUGIN_REF_WRAP_TABLE', FALSE); // TRUE, FALSE
// URL指定時に画像サイズを取得するか
define('PLUGIN_REF_URL_GET_IMAGE_SIZE', true); // FALSE, TRUE
// UPLOAD_DIR のデータ(画像ファイルのみ)に直接アクセスさせる
define('PLUGIN_REF_DIRECT_ACCESS', FALSE); // FALSE or TRUE
// - これは従来のインラインイメージ処理を互換のために残すもので
//   あり、高速化のためのオプションではありません
// - UPLOAD_DIR をWebサーバー上に露出させており、かつ直接アクセス
//   できる(アクセス制限がない)状態である必要があります
// - Apache などでは UPLOAD_DIR/.htaccess を削除する必要があります
// - ブラウザによってはインラインイメージの表示や、「インライン
//   イメージだけを表示」させた時などに不具合が出る場合があります

// File icon image
define('FILE_ICON',
	'<img src="' . IMAGE_DIR . 'file.png" width="20" height="20"' .
	' alt="file" style="border-width:0px" />');
// Image suffixes allowed
define('PLUGIN_REF_IMAGE', '/\.(gif|png|jpe?g|swf)$/i');
// Usage (a part of)
define('PLUGIN_REF_USAGE', "([pagename/]attached-file-name[,parameters, ... ][,title])");
 

resize_image.inc.php  

// 画像幅初期値(未設定でオリジナルサイズ)
define('PLUGIN_RESIZE_IMAGE_WIDTH', '');
// 画像高さ初期値(未設定でオリジナルサイズ)
define('PLUGIN_RESIZE_IMAGE_HEIGHT', '');
// リサイズ画像キャッシュフォルダ
define('PLUGIN_RESIZE_IMAGE_CACHE', DATA_HOME . 'cache_resize/');
 

旧バージョン(JPEGでの画像リサイズ)でのPageSpeed Insights計測結果  

旧バージョンでのPageSpeed Insights計測結果

 

最新バージョン(WebPでの画像リサイズ)でのPageSpeed Insights計測結果  

最新バージョンでのPageSpeed Insights計測結果

 

PDFビューアプラグイン対応  

refプラグイン  

- &ref(PDFビューアプラグイン/2021_日本ウイグル協会チラシ.pdf){2021年 日本ウイグル協会チラシ};

refプラグイン+PDFビューアプラグイン(表示幅720px・左寄せ・横表示)  

- &ref(PDFビューアプラグイン/2015_御坂峠天下茶屋リーフレット.pdf){2015 御坂峠天下茶屋リーフレット};&br;&pdf_viewer(./2015_御坂峠天下茶屋リーフレット.pdf,page,yoko);

Lightbox対応  

Lightboxを使わない場合  

&ref(./ウイングマン.jpg,nolink,174x240,ウイングマン);

ウイングマン

 

Lightboxを使う場合(画像単独)  

&ref(./ウイングマン.jpg,174x240,ウイングマン);

ウイングマン

 

Lightboxを使う場合(画像グループ)  

&ref(画像スワイプ表示プラグイン/ロードランナー.jpg,lb:retro_games,243x240,ロードランナー); &ref(画像スワイプ表示プラグイン/タイニーゼビウス.jpg,lb:retro_games,238x240,タイニーゼビウス); &ref(画像スワイプ表示プラグイン/ギャラクシアン.jpg,lb:retro_games,166x240,ギャラクシアン); &ref(画像スワイプ表示プラグイン/ハイドライド.jpg,lb:retro_games,168x240,ハイドライド);

ロードランナー  タイニーゼビウス  ギャラクシアン  ハイドライド

 

ファーストビューエリアの画像を遅延読み込みしない方法(LCP対策)  

CENTER:&ref(top_page.png,nolink,nolazy,PukiWiki改造普及活用計画);
PukiWiki改造普及活用計画
 

GIFファイル個別対応(アニメGIF対応)  

&ref(管理人プロフィール/よっぱ.gif,nolink,アニメGIF対応);

アニメGIF対応

 

参照記事  

オンラインサロン「SEの良心・友の会」 ダウンロード お問い合わせ
 

 

コメントはありません。 Comments/URL短縮対応画像遅延読込・画像リサイズプラグイン



 

*1 内部リンクであっても、別窓(target="_blank")でリンクを表示する場合に外部リンクマーク「外部リンクマーク」を表示する(従来はpukiwiki.skin.php内のjQueryコードで外部サイトへの外部リンクマークの表示を無差別に処理していたが、仕様として正式に取り入れた)。
これにより、リンクが自窓で表示されるのか、別窓で表示されるのかを統一仕様としてサイト訪問者に明示する。

*2 内部リンクであっても、別窓(target="_blank")でリンクを表示する場合に外部リンクマーク「外部リンクマーク」を表示する(従来はpukiwiki.skin.php内のjQueryコードで外部サイトへの外部リンクマークの表示を無差別に処理していたが、仕様として正式に取り入れた)。
これにより、リンクが自窓で表示されるのか、別窓で表示されるのかを統一仕様としてサイト訪問者に明示する。


人気上位6ページ

今日の人気上位6ページ


トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ ログイン   最終更新のRSS
ページトップボタン