#author("2021-04-02T22:07:28+09:00","default:kanateko0404","kanateko0404")
RIGHT:&tag(プラグイン,自作,追加);
#ref(blogcard.jpg,center,nolink,wrap,400x0)
#contentsx
*ブログカード風リンク作成プラグイン [#x4043488]
#style(class=table_float_right){{
|>|~card.inc.php|h
|RIGHT:100|150|c
|~製作者|kanateko|
|~ライセンス|GPLv3|
|~バージョン|1.0|
|~動作確認|PukiWiki 1.5.3 ~|
|~最終更新|2021/04/01|
}}
指定範囲のリンクを全てブログカード風のリンクに置き換える事ができる。#lsなどページを一覧表示するプラグインと組み合わせることで、ブログの記事一覧のようなページが作れる。
-このプラグインでできること
--指定範囲内にあるリンクを全てブログカード風に変換する。
--変換したカードを指定したカラム数で表示する。 (1~6)
--サムネイルのキャッシュを作成し、表示を高速化する。
--リンク先ページが更新された場合はキャッシュも更新する。
--レスポンシブ対応。スマホの場合は大きいカードを一列で表示する。
#clear
*ダウンロード[#nc904a0b]
最新: [[GitHub>https://github.com/kanateko/pukiwiki-plugin]]
|~日付|~バージョン|~備考|h
|2021/04/01|1.0|#ul(サムネイルの更新機能追加,エイリアスに対応,公開に向けて様々なオプションを追加)|
|2021/03/31|0.6|#ul(サムネイルのキャッシュ機能追加,カラム数指定機能追加)|
|2021/03/30|0.2|初版作成|
*インストール [#ma9d057e]
+GitHubから「card.inc.php」フォルダをダウンロードし、中にはいっている「plugin」と「image」フォルダをPukiWikiのフォルダに入れる。必要に応じて「image」の中にある「eyecatch.jpg¬e{:リンク先に画像がない場合に変わりに表示するサムネイル画像};」を置き換える。
+「skin」フォルダ内の「card.css」の内容をpukiwiki.cssに追加する。
+PukiWikiの設定でマルチラインプラグインを許可する。
pukiwiki.ini.phpの56行目
#prism(php){{
define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 0); // 1 = Disabled
}}
*プラグイン設定 [#l10e79ce]
:NO_DESC_NUM|カードの説明文を非表示にするカラム数の閾値。
:FIX_WIDTH|カードの表示範囲を固定幅にするかどうか。
:WRAPPER_WIDTH|カード表示範囲の幅。
:ALLOW_MAKE_THUMBNAILS|サムネイルのキャッシュ生成を許可するかどうか。
:THUMB_DIR|サムネイルのキャッシュを保存するディレクトリ。
:USE_SHORT_URL|短縮URLを使用しているかどうか。 (参照: [[PukiWikiのクソ長いURLをURL短縮ライブラリを組み込んで解決する! | SEの良心:https://dajya-ranger.com/pukiwiki/embed-url-shortener/]])
:USE_FONTAWESOME_ICON|[[Font Awesome:https://fontawesome.com/]]のアイコンを使用するかどうか。 (更新日時の時計アイコン)
*使用方法 [#gf4f575f]
#card([1-6]){{
[[リンク1]]
[[リンク2]]
or
#ls
etc...
}}
カラム数1の場合は記述を省略可。
リンクが1個の場合は小括弧内にリンクを置くだけでもOK。 (ブランケット必須)
#card([[リンク]])
*使用例 [#me8eb03d]
長くなるのでそれぞれ折りたたみ表示中。
ちなみに折りたたみ表示に使用しているのは自作プラグインの「ac.inc.php」(そのうち公開予定) 。
**例1:1列表示 [#we0ea89e]
#ac(alt){{{
#card{{
[[自作プラグイン]]
[[プラグインの変更箇所]]
}}
#card{{
[[自作プラグイン]]
[[プラグインの変更箇所]]
}}
}}}
**例2:2列表示 [#l4a75370]
#ac(alt){{{
#card(2){{
#lsx(prefix=自作プラグイン)
}}
#card(2){{
#lsx(prefix=自作プラグイン)
}}
}}}
**例3:3列表示 [#edecb7fa]
#ac(alt){{{
3列表示からはカードが縦長のタイプになる。
#card(3){{
#taglink(ゲームWiki,num=:6)
}}
#card(3){{
#taglist(ゲームWiki,num=:6)
}}
}}}
**例4:4列表示 [#n37c8730]
#ac(alt){{{
4列からは説明文がなくなり、更新日時の表示が簡略化される。
#card(4){{
#taglist(ゲームWiki,num=:12)
}}
#card(4){{
#taglist(ゲームWiki,num=:12)
}}
}}}
**例5:5列表示 [#m122fc67]
#ac(alt){{{
#card(5){{
#taglist(ゲームWiki)
}}
#card(5){{
#taglist(ゲームWiki)
}}
}}}
**例6:6列表示 [#oc411821]
#ac(alt){{{
#card(6){{
#lsx(prefix=/,num=:20)
}}
#card(6){{
#lsx(prefix=/,num=:20)
}}
}}}
*追加したい機能 [#rc557fc6]
-スマホ表示時のカラム数指定機能
--カラム数ごとに更に細かく条件分岐させてクラスを分ければできそう。でもめちゃくちゃめんどくさい。
*コメント [#n8472dd2]
#pcomment2(,10,above,reply)