PukiWiki備忘録・続
をテンプレートにして作成
開始行:
Wikiアプデの際に生まれた副産物の配布および紹介が主なペー...
Wikiカスタムにあたってのメモも記述
-----
この項目のそれは全てUTF-8が前提、且つ1.5.3以降＋PHP7系で...
旧環境およびPHP8環境だとエラーを吐く可能性もあります。利...
-----
TFFAC時代：[[PukiWiki備忘録:https://www.tffac.wiki/?PukiW...
-----
#contents
*配布 [#te035e4b]
**PukiWiki 1.5.4向けのスキン [#b806cc74]
***名称 [#xd2fd657]
ff
…「フォルティッシモ」です。エフエフではありません。ホント...
商標対策ヨシ！
***使い方 [#m851f7a5]
+ionicons v2一式を[[外部の専用ページへ:https://ionicons.c...
+スキン一式を[[添付ファイル一覧:https://t-fbl.wiki/?plugi...
+skinchg.phpのみディレクトリの最上層に置き、残りはskin直...
+同梱の改造済プラグインは使うならpluginの同名ファイルと置...
+これでOK。後述するOGPはアップロード後、一定時間が経って...
***収録内容 [#cc5ff417]
-pukiwiki.skin.php
--ff本体
-pukiwiki.css
--ff専用CSS
-pukiwiki-sp.css
--ff専用CSS。スマホ／タブレット用
-skinchg.php
--疑似PC表示固定機能。Cookieを利用しページ最上部のトグル...
-smooth-scroll.js
--スムーズスクロール用。jQuery呼び出しは不必要。再配布
-改造版のpcomment.inc.php
--後述する改造が面倒・分からない人向け。必要無い場合は適...
***通常のスキンとの違い [#df56d467]
-Milligramのソースを一部流用したFlexbox仕様でレイアウトを...
-Ioniconsを利用して編集者向けメニューをアイコン化
-デフォルトスキンよりレスポンシブ対応を強化、PC表示固定機...
-PC表示時のみページタイトル下に簡易検索窓搭載
-後々カスタマイズしやすくする為、無駄な隙間は悉く撤廃
***TFFAC版スキンとの違い [#bc14a539]
-OGP対応。Twitt…XでURLを入力するとカードっぽいのが出てく...
-&color(Red){pcommentのラジオボタン周り調整};(要プラグイ...
-Wiki最下部の著作権表記をほぼスキン側で管理。00が従来のPu...
-font-familyを Meiryo,Verdana,sans-serif; に変更、統一
-文字サイズ指定方法・配色・マーカー・注釈位置などの一部見...
-大きい表への対処は overflow-x:auto; に丸投げ。状況に応じ...
-input周りのレスポンシブ対応が甘かったので修正
-これらの影響で以前は多少配慮していたCSS3非対応環境を完全...
-また、以前ほど沢山の環境でテストしていません。もう手元に...
***ライセンス [#a42cfdf3]
スキン本体と専用CSSのライセンスは[[PukiWiki本家:https://p...
再配布している同梱物(smooth-scroll.js)はMIT
***以前と同様の注意事項 [#x095fc9d]
当Wikiの見出し横に付いている編集用鉛筆マークは改造版%%par...
故に配布中の専用スキンにデフォルトでは付いていません。あ...
また、デフォルトで想定しているサイズは横幅1280まで
それ以上だとブラウザの中央配置となり周囲に余白が生まれま...
右上のロゴ枠は自分で用意してください。一応バナーを置く事...
***以前と同様の対応を投げた箇所 [#ef74ee83]
%%2K%%WQHD以上のディスプレイ対応と4インチ未満の端末サポー...
iOSのPC向け表示時における文字入力時の自動拡大。iPadも考慮...
***補足 [#g27ccfc6]
#region(OGP用の画像ってどこに入れればいい？サイズは？それ...
+PukiWikiの本家ロゴが置いてある場所、つまりimageです。デ...
+デフォルトでは小さい方を指定しているのでアスペクト比1:1...
+Wikiを使う層には関係無いだろう、という理由で対応してませ...
#endregion
#region(pcommentのラジオボタン周り調整＋2行以上の文章を扱...
pcomment.inc.phpを開き、まずは投稿フォームの文章側inputを...
$comment = '<input type="text" name="msg" size="...
PLUGIN_PCOMMENT_SIZE_MSG . '" required />';
を、以下に書き換え
任意の数値は最小の方の文字数制限。このWikiでは荒らし対策...
これだと一行一文字を繋げる遊びが出来なくなるのでまあ一長...
$comment = '<textarea name="msg" minlength="任意...
PLUGIN_PCOMMENT_SIZE_MSG . '" required></textare...
#br
次にその少し下にあるinput群を少し弄る。EOD;直前の
<input type="hidden" name="count" value="$count" />
$radio $title $name $comment
<input type="submit" value="{$_pcmt_messages['btn_comm...
</div>
EOD;
を、以下に書き換え
なおここはフォームの配置に関わる所なのでそのままでもいい...
textarea化するならコメントだけ別の行にした方が使いやすい...
<input type="hidden" name="count" value="$count" />
$radio $title $name
<input type="submit" value="{$_pcmt_messages['btn_comm...
$comment
</div>
EOD;
#br
次に209行目辺りの
$msg = str_replace("\x08" . 'MSG' . "\x08", $ms...
$msg = str_replace("\x08" . 'NAME' . "\x08", $na...
$msg = str_replace("\x08" . 'DATE' . "\x08", $da...
を、以下に書き換え
n{7,}の部分は必要な処置＋荒らし対策。一定以上の空白改行を...
この場合、文章中の連続空白改行は5行まで許される。6行分以...
$msg = str_replace("\x08" . 'MSG' . "\x08", pre...
$msg = str_replace("\x08" . 'NAME' . "\x08", $na...
$msg = str_replace("\x08" . 'DATE' . "\x08", $da...
#br
最後に終わりの方にあるラジオボタン用の記述を変更
// Add radio buttons
if ($reply)
$comments = preg_replace('/<li>' . "\x01" . '(\d...
'<li class="pcmt"><input class="pcmt" ty...
$comments);
を、以下に書き換え
今回配布のCSS的にはここが一番重要。ここをきっちり書き換え...
ここの書き換えが終わった後に配布スキン用CSSの最後にあるad...
// Add radio buttons
if ($reply)
$comments = preg_replace('/<li>' . "\x01" . '(\d...
'<hr><li class="pcmt"><label for="pcmt_$...
$comments);
#endregion
#region(なんでVerdana→メイリオじゃないの？)
両方使えるWindows環境下だと前後の文に左右されて英字表記が...
同じSwitch表記なのに次の行では文字の間隔が違ったりする謎...
カウンターの数字表記はVerdanaの方が好みだった… ので...
AndroidのVerdana＋機種依存だと可読性は普通なのでなおさら謎
現環境がiOSおよびメイリオが入っている環境のMacでどうなっ...
#endregion
#br
*コメント [#mf4be8ad]
#pcomment(./コメント1,below,reply,30)
終了行:
Wikiアプデの際に生まれた副産物の配布および紹介が主なペー...
Wikiカスタムにあたってのメモも記述
-----
この項目のそれは全てUTF-8が前提、且つ1.5.3以降＋PHP7系で...
旧環境およびPHP8環境だとエラーを吐く可能性もあります。利...
-----
TFFAC時代：[[PukiWiki備忘録:https://www.tffac.wiki/?PukiW...
-----
#contents
*配布 [#te035e4b]
**PukiWiki 1.5.4向けのスキン [#b806cc74]
***名称 [#xd2fd657]
ff
…「フォルティッシモ」です。エフエフではありません。ホント...
商標対策ヨシ！
***使い方 [#m851f7a5]
+ionicons v2一式を[[外部の専用ページへ:https://ionicons.c...
+スキン一式を[[添付ファイル一覧:https://t-fbl.wiki/?plugi...
+skinchg.phpのみディレクトリの最上層に置き、残りはskin直...
+同梱の改造済プラグインは使うならpluginの同名ファイルと置...
+これでOK。後述するOGPはアップロード後、一定時間が経って...
***収録内容 [#cc5ff417]
-pukiwiki.skin.php
--ff本体
-pukiwiki.css
--ff専用CSS
-pukiwiki-sp.css
--ff専用CSS。スマホ／タブレット用
-skinchg.php
--疑似PC表示固定機能。Cookieを利用しページ最上部のトグル...
-smooth-scroll.js
--スムーズスクロール用。jQuery呼び出しは不必要。再配布
-改造版のpcomment.inc.php
--後述する改造が面倒・分からない人向け。必要無い場合は適...
***通常のスキンとの違い [#df56d467]
-Milligramのソースを一部流用したFlexbox仕様でレイアウトを...
-Ioniconsを利用して編集者向けメニューをアイコン化
-デフォルトスキンよりレスポンシブ対応を強化、PC表示固定機...
-PC表示時のみページタイトル下に簡易検索窓搭載
-後々カスタマイズしやすくする為、無駄な隙間は悉く撤廃
***TFFAC版スキンとの違い [#bc14a539]
-OGP対応。Twitt…XでURLを入力するとカードっぽいのが出てく...
-&color(Red){pcommentのラジオボタン周り調整};(要プラグイ...
-Wiki最下部の著作権表記をほぼスキン側で管理。00が従来のPu...
-font-familyを Meiryo,Verdana,sans-serif; に変更、統一
-文字サイズ指定方法・配色・マーカー・注釈位置などの一部見...
-大きい表への対処は overflow-x:auto; に丸投げ。状況に応じ...
-input周りのレスポンシブ対応が甘かったので修正
-これらの影響で以前は多少配慮していたCSS3非対応環境を完全...
-また、以前ほど沢山の環境でテストしていません。もう手元に...
***ライセンス [#a42cfdf3]
スキン本体と専用CSSのライセンスは[[PukiWiki本家:https://p...
再配布している同梱物(smooth-scroll.js)はMIT
***以前と同様の注意事項 [#x095fc9d]
当Wikiの見出し横に付いている編集用鉛筆マークは改造版%%par...
故に配布中の専用スキンにデフォルトでは付いていません。あ...
また、デフォルトで想定しているサイズは横幅1280まで
それ以上だとブラウザの中央配置となり周囲に余白が生まれま...
右上のロゴ枠は自分で用意してください。一応バナーを置く事...
***以前と同様の対応を投げた箇所 [#ef74ee83]
%%2K%%WQHD以上のディスプレイ対応と4インチ未満の端末サポー...
iOSのPC向け表示時における文字入力時の自動拡大。iPadも考慮...
***補足 [#g27ccfc6]
#region(OGP用の画像ってどこに入れればいい？サイズは？それ...
+PukiWikiの本家ロゴが置いてある場所、つまりimageです。デ...
+デフォルトでは小さい方を指定しているのでアスペクト比1:1...
+Wikiを使う層には関係無いだろう、という理由で対応してませ...
#endregion
#region(pcommentのラジオボタン周り調整＋2行以上の文章を扱...
pcomment.inc.phpを開き、まずは投稿フォームの文章側inputを...
$comment = '<input type="text" name="msg" size="...
PLUGIN_PCOMMENT_SIZE_MSG . '" required />';
を、以下に書き換え
任意の数値は最小の方の文字数制限。このWikiでは荒らし対策...
これだと一行一文字を繋げる遊びが出来なくなるのでまあ一長...
$comment = '<textarea name="msg" minlength="任意...
PLUGIN_PCOMMENT_SIZE_MSG . '" required></textare...
#br
次にその少し下にあるinput群を少し弄る。EOD;直前の
<input type="hidden" name="count" value="$count" />
$radio $title $name $comment
<input type="submit" value="{$_pcmt_messages['btn_comm...
</div>
EOD;
を、以下に書き換え
なおここはフォームの配置に関わる所なのでそのままでもいい...
textarea化するならコメントだけ別の行にした方が使いやすい...
<input type="hidden" name="count" value="$count" />
$radio $title $name
<input type="submit" value="{$_pcmt_messages['btn_comm...
$comment
</div>
EOD;
#br
次に209行目辺りの
$msg = str_replace("\x08" . 'MSG' . "\x08", $ms...
$msg = str_replace("\x08" . 'NAME' . "\x08", $na...
$msg = str_replace("\x08" . 'DATE' . "\x08", $da...
を、以下に書き換え
n{7,}の部分は必要な処置＋荒らし対策。一定以上の空白改行を...
この場合、文章中の連続空白改行は5行まで許される。6行分以...
$msg = str_replace("\x08" . 'MSG' . "\x08", pre...
$msg = str_replace("\x08" . 'NAME' . "\x08", $na...
$msg = str_replace("\x08" . 'DATE' . "\x08", $da...
#br
最後に終わりの方にあるラジオボタン用の記述を変更
// Add radio buttons
if ($reply)
$comments = preg_replace('/<li>' . "\x01" . '(\d...
'<li class="pcmt"><input class="pcmt" ty...
$comments);
を、以下に書き換え
今回配布のCSS的にはここが一番重要。ここをきっちり書き換え...
ここの書き換えが終わった後に配布スキン用CSSの最後にあるad...
// Add radio buttons
if ($reply)
$comments = preg_replace('/<li>' . "\x01" . '(\d...
'<hr><li class="pcmt"><label for="pcmt_$...
$comments);
#endregion
#region(なんでVerdana→メイリオじゃないの？)
両方使えるWindows環境下だと前後の文に左右されて英字表記が...
同じSwitch表記なのに次の行では文字の間隔が違ったりする謎...
カウンターの数字表記はVerdanaの方が好みだった… ので...
AndroidのVerdana＋機種依存だと可読性は普通なのでなおさら謎
現環境がiOSおよびメイリオが入っている環境のMacでどうなっ...
#endregion
#br
*コメント [#mf4be8ad]
#pcomment(./コメント1,below,reply,30)
ページ名:
PukiWiki 1.5.4
© 2001-2025
PukiWiki Development Team
.
© 2023 SQUARE ENIX CO., LTD. All Rights Reserved. Developed by indieszero Co., Ltd. LOGO ILLUSTRATION:© 2022 YOSHITAKA AMANO
![[PukiWiki]](image/logo.webp "[PukiWiki]"){kind=logo}