自作プラグイン/card

2021-10-04 (月) 09:05:03
blogcard.jpg

ブログカード風リンク作成プラグイン

card.inc.php
製作者kanateko
ライセンスGPLv3
バージョン2.3
動作確認PukiWiki 1.5.3 ~
最終更新2021-10-04

指定範囲のリンクを全てブログカード風のリンクに置き換える事ができる。#lsなどページを一覧表示するプラグインと組み合わせることで、ブログの記事一覧のようなページが作れる。

  • このプラグインでできること
    • 指定範囲内にあるリンクを全てブログカード風に変換する。
    • 変換したカードを指定したカラム数で表示する。 (1~6)
    • サムネイルのキャッシュを作成し、表示を高速化する。
    • リンク先ページが更新された場合はキャッシュも更新する。
    • レスポンシブ対応。
    • [リクエスト] 指定した見出しをページから抜き出してカードに表示する。

ダウンロード

最新: GitHub

日付バージョン備考
2021-10-042.3
2021-08-232.2
  • ページ名からファイル名への変換で使用する関数を最適化
  • キャッシュを生成しない場合の階層化されたページにある画像の取得方法を修正
  • キャッシュを生成する場合、ページにinfoboxプラグインが使われていた場合の対応を強化
  • キャッシュ保存時に拡張子が正常に付与されない問題を修正
2021-08-042.1
  • infoboxプラグインとの兼ね合いでサムネイルやデスクリプションを抜き出す際の正規表現を調整
2021-07-282.0
  • 定数 (設定項目) を整理、名称を変更
  • カード表示エリアの幅を固定化、幅の設定はCSS側に移行
  • 上記に伴って幅の固定化を切り替える設定項目を廃止
  • カードを縦長表示するカラム数の閾値の設定を追加
  • 各カードの幅をCSSのgridレイアウトで制御するように変更
  • 指定した見出しをデスクリプションの代わりに表示する機能を追加
2021-07-261.5
  • webpに対応
  • スラッシュが2つ以上入ったページにある画像がうまく取得できなかった問題を修正
2021-06-291.4
  • プラグインの呼び出し毎に個別のIDを割り振る機能を追加
2021-06-201.3
  • 画像が縦長の場合にサムネイルの切り抜きを画像の上端に合わせるか設定する機能を追加
  • 存在しないページが含まれている場合にエラーを出すかどうかを設定できるように変更
2021-04-071.2
  • ベースネーム表示機能追加
  • カラム数を複数回指定するとエラーが表示されるよう変更
  • その他バグ修正等
2021-04-041.1
  • カラム数指定時に確実に引数をintで取得できるよう修正
  • カードの高さをプラグイン側で調整するよう変更
  • カラム数2以下の場合はスマホでも横長のカードになるよう変更 (cssの変更のみ)
2021-04-011.0
  • サムネイルの更新機能追加
  • エイリアスに対応
  • 公開に向けて様々なオプションを追加
2021-03-310.6
  • サムネイルのキャッシュ機能追加
  • カラム数指定機能追加
2021-03-300.2初版作成

インストール

  1. GitHubから「card.inc.php」フォルダをダウンロードし、中にはいっている「plugin」と「image」フォルダをPukiWikiのフォルダに入れる。必要に応じて「image」の中にある「eyecatch.jpg*1」を置き換える。
  2. 「skin」フォルダ内の「card.css」の内容をpukiwiki.cssに追加する。
  3. PukiWikiの設定でマルチラインプラグインを許可する。

pukiwiki.ini.phpの56行目

 define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 0); // 1 = Disabled

プラグイン設定

CARD_DISPLAY_VERTICAL_THRESHOLD
カードを縦長表示に変更するカラム数の閾値。
CARD_HIDE_DESCRIPTION_THRESHOLD
カードの説明文を非表示にするカラム数の閾値。
CARD_ALLOW_CACHE_THUMBNAILS
サムネイルのキャッシュ生成を許可するかどうか。
CARD_THUMB_DIR
サムネイルのキャッシュを保存するディレクトリ。
CARD_USE_SHORT_URL
短縮URLを使用しているかどうか。 (参照: PukiWikiのクソ長いURLをURL短縮ライブラリを組み込んで解決する! | SEの良心)
CARD_USE_FONTAWESOME_ICON
Font Awesomeのアイコンを使用するかどうか。 (更新日時の時計アイコン)
CARD_FORCE_BASENAME
強制的にベースネームを表示
CARD_ERROR_ON_NO_EXISTS
存在しないページが含まれている場合にエラーを出すかどうか
CARD_IMAGE_BASELINE_TOP
画像が縦長の場合にサムネイルの切り抜きを上端に合わせるかどうか

使用方法

#card([1-6][,オプション]){{
[[リンク1]]
[[リンク2]]

or

#ls

etc...
}}

カラム数1の場合は記述を省略可。
リンクが1個の場合は小括弧内にリンクを置くだけでもOK。 (ブラケット必須)

#card([[リンク]])
オプション
  • base
    階層化されたページ名の場合、ベースネーム (階層化されたページの最後の名前) のみを表示する。
  • *, **, ***=<数値>
    抜き出す見出しを指定する。 "*" の個数で見出しの深さ (h2 ~ h4) を決定し、数値で上から何番目の見出しを抜き出すかを指定する。
    例えば、 "**=2" なら上から2番目のh3を指定したことになる。

使用例

全て開く

例1:1列表示 + ベースネーム表示

例2:2列表示 + 見出しの抜き出し

例3:3列表示

例4:4列表示

例5:5列表示

例6:6列表示

備考

  • v1.5からv2.0で定数名やカード部分の構造が大きく変わっているので、カスタマイズして使っていた場合はバージョンアップ時に注意が必要。
  • カードの幅計算や繰り返し処理などをSassの方で行っているので、素のCSSの方を弄るのはあまりおすすめしない。
  • 何かしらref以外の画像を表示するプラグインを作成する度にサムネイル取得部分を書き直す羽目になっているので、そろそろ取得方法自体を見直すべきかもしれない

コメント

最新の10件を表示しています。 コメントページを参照

  • Pukiwiki公式を見てすばらしいプラグインだなと思いました。
    作成ありがとうございます。
    記事の説明部分なのですが、
    ・記事タイトル
    ・n番目の見出し(変数を与えて指定できるようにする?)
    のようにできたりしたら好みに説明できてうれしいです。 -- 2021-04-26 (月) 00:05:55
    • プラグインのご利用 & コメントありがとうございます。今回頂いたご要望は、「記事のデスクリプションの代わりに指定した見出しを表示する」ということかと思いますが、個人的にあまり用途が思い浮かばない (そういったブログカードを見たことがない) ので、申し訳ないですが実装の優先度は "低" とさせてください。 -- kanateko 2021-04-30 (金) 10:31:53
    • だいぶ遅くなりましたが、記事の説明部分にページの見出しを指定して表示する機能をv2.0で追加しました。 -- kanateko 2021-07-28 (水) 17:15:49