PukiWiki/カスタマイズ

Last-modified: 2018-11-14 (水) 15:23:59 (2552d)

Top / PukiWiki / カスタマイズ

PukiWikiカスタマイズ

先頭にスペースを入れなくても、ソースコード全体を囲って、pre表示できるように対応

PukiWiki 1.4.6～のMultiline plugin hack拡張機能を有効に設定 pukiwiki.iniphp

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

次の場所からpre.inc.phpファイルをダウンロードし、pluginフォルダに配置します。
http://lsx.sourceforge.jp/?Plugin%2Fpre.inc.php

使用方法

ソースコード全体を#pre{{と}}で囲うと、pre表示となります。
```
#pre{{
echo "Hello, ";
echo "world!";
}}
```
　　　　　　↓整形後の表示結果

#pre{{
echo "Hello, ";
echo "world!";
}}
#pre(soft){{と}}で囲うと、リンクやフェースマークが有効となります。
「#pre(soft){{」の中にスペースを入れてはいけません。

↑

180wiki-black skinのインストール

180style wikiで提供されている「180wiki-black」というテーマのワイドバージョンとスマホ対応版をインストールしました。(2014-02-08)

インストール方法

「自作スキン | 180style wiki」から180wiki-blackの次の２つのzipファイルをダウンロード
- Wiki/PukiWiki/Skin/black-w1000（ワイドバージョン）
- Wiki/PukiWiki/Skin/black-smartphone（スマホ対応版）
それぞれのページで記述されているようにphpファイルを書き換えます。

インストールの注意点：

skinフォルダ直下に展開しないとcssが適用されないようです。（サブフォルダに配置して、SKIN_FILEにサブフォルダを追加するだけだと効きませんでした）
readme.txtなどのテキストファイルは配置しなくてもOKです。
ワイドバージョンとスマホ対応版で一部ファイル名が同じですが、skinフォルダ上に上書きでOKです。
skin自身はUTF-8対応で、PapuuWikiはEUCでした。skin内のファイルは特にUTF-8用のままサイトにアップしてOKでした。
インストールでpukiwiki.ini.php, default.ini.phpなど元からEUCのファイルを書き換えますが、EUCのまま書き換えます。

↑

GS2 skinのインストール（旧スキン）

注：2014-02-08に「180wiki-black skin」に変えました。デザイン、編集などのメニュー配置がいいので、導入しました。
当wikiではプログラムソースをよく載せるので、ページが幅広で、見やすくて良さそうなのも、採用のポイントとなっています。
配色はクールで見やすかったのでskyを採用し、テーブルの配色が見にくかったので、調整しました。

skin/pukiwiki_gs2.css.php

thead td.style_td,
tfoot td.style_td {
	color:inherit;
/*	background-color:<?php echo SKIN_CSS_BGCOLOR; ?>; */
	background-color:#A1AAB8;
}

skin/gs2_color/pukiwiki_gs2_color_sky.php

	define('SKIN_CSS_BOX_BDCOLOR', 	'#9898A9');	// normal box border

h2, h3, h4の縁取りを調整し、それぞれ右マージンを０，２５，５０ピクセルとして、上下階層構造がよく分かるようにしました。

本文の各要素で、左マージンを設定

pre, dl, ol, p, blockquote {
	line-height:175%;
	margin-left:2em
}

pre {
	...
	margin-left:3em;
	...
}

li {
	margin: 3px 0px;
	margin-left:1em;
}

↑

pukiwiki.ini.php変更

WikiNameの無効化
日本語でページを書く場合、ほとんど使わず、見た目に悪影響を与えるので、無効化しました。

$nowikiname = 1;

更新および削除の表示項目数増加

$maxshow = 180;
$maxshow_deleted = 180;

アンカータグ自動挿入無効化
ほとんど使わず、整形前の文章が見にくくなるので、無効化しました。

$fixed_heading_anchor = 0;

↑

テーブルを左寄せ

中央だと、解像度の大きいモニタで本文と離れすぎるので、1em空けた左寄せにします。
skin/pukiwiki.css.php (GS2 skinをインストールしているときは、pukiwiki_gs2.css.php。180wiki-black skinをインストールしているときはデフォルトで左寄せでした)

.style_table {
	padding:0px;
	border:0px;
/*	margin:auto; */
	margin:auto auto auto 1em;
	text-align:left;
	color:inherit;
	background-color:#ccd5dd;
}

パラメータの順番は、上右下左

↑

FrontPageでなくトップを開くように変更

pukiwiki.ini.php

$defaultpage  = 'FrontPage';     // Top / Default page
    ↓
$defaultpage  = 'トップ';     // Top / Default page

↑

外部リンク左端にマークを付け、_blankで開くように変更

外部リンクがすぐ分かり、別で開いたほうが使いやすいので、このようにしています。
編集中のプレビューから間違えて開いたときに、編集中の内容が消えないようにする効果もあります。

リンクマークの画像を用意
image/ext_link.png

skin/pukiwiki.css.php (GS2 skinをインストールしているときは、pukiwiki_gs2.css.php。180wiki-black skinをインストールしているときは180wiki.css、180wiki-sp.css)

a.external {
  padding-left: 14px;
  background: url("../image/ext_link.png") no-repeat left bottom;
}

pukiwiki.ini.php

<?php
    // 外部リンクを表すマーク表示で使用する変数
    // 自サイトのURL (内部・外部リンクの区別のため)
    $my_site = 'papuu.jp';
?>

lib/make_link.php

class Link_url

     function toString()
     {
         if (FALSE) {
             $rel = '';
         } else {
             $rel = ' rel="nofollow"';
         }
         return '<a href="' . $this->name . '"' . $rel . '>' . $this->alias . '</a>';
     }
         ↓
     function toString()
     {
         global $my_site;
 
         if (FALSE) {
             $rel = '';
         } else {
             $rel = ' rel="nofollow"';
         }
 
         if (strpos($this->name, $my_site)) {
             return '<a href="' . $this->name . '"' . $rel . '>' . $this->alias . '</a>';
         } else {
             // 内部・外部リンクを区別する
             return '<a href="' . $this->name . '" target="_blank" class="external"' . $rel . '>' . $this->alias . '</a>';
         }
     }

class Link_url_interwiki

    function toString()
    {
        return '<a href="' . $this->name . '" rel="nofollow">' . $this->alias . '</a>';
    }
         ↓
     function toString()
     {
         // 内部・外部リンクを区別する
         return '<a href="' . $this->name . '" target="_blank" class="external" rel="nofollow">' . $this->alias . '</a>';
     }

class Link_interwikiname
    function toString()
    {
        return '<a href="' . $this->url . $this->anchor . '" title="' .
            $this->name . '" rel="nofollow">' . $this->alias . '</a>';
    }
         ↓
    function toString()
    {
        // 内部・外部リンクを区別する
        return '<a href="' . $this->url . $this->anchor . '" title="' .
            $this->name . '" target="_blank" class="external" rel="nofollow">' . $this->alias . '</a>';
    }

参考ページ

cubic9.com 内部・外部リンクを区別する
よくきたblog ... googleを利用して相手にリファラーを教えない方法も載っています。

↑

ページ編集時にプレビューボタンなどと『テキスト整形のルールを表示する』のリンクが近くて押しにくいので、<br>２つを挿入

lib/html.php 269行目付近

		$body .= '<br><br><ul><li><a href="' .

↑

ページ編集のテキストエリアサイズを拡げる

MacやiPadで編集しやすいようにするため拡げました。 default.ini.php

$cols = 132; // 80から拡げました
$rows = 32; // 20から拡げました

↑

ロリポップなどPukiWiki認証ができないサーバに対応する

PukiWikiはApacheモジュールとして動作しているPHPでないと認証に失敗します。 Apacheモジュールとして動作しているPHPかどうかはphpinfo();で表示できます。

phpinfo()で表示される項目名	値	PukiWikiの認証	レンタルサーバ例
Server API	CGI/FastCGI	失敗	ロリポップ、らくらインターネット
Server API	Apache	成功	XREA

CGI版PHPでもPukiWikiの認証を動作させるプラグインが自作プラグイン/login.inc.php | pukiwiki.sourceforge.jpで公開されています。
こちらを改良したものがlogin.inc.php | 俺 wiki.wetcradle.comで公開されていますので、こちらのページからインストールしました。

ただし、そのままだと複数のイメージを利用したページを編集しようとした時、認証画面が何度も出て編集できなくなります。これを防ぐため次の行をコメントアウトしました。
pukiwiki.ini.php

session_regenerate_id(TRUE);

詳しくは次のページのコメント欄に載っています。自作プラグイン/login.inc.php | pukiwiki.sourceforge.jp

↑

PukiWikiにGoogleアナリティクスを導入

トラッキングコードを「skin/pukiwiki.skin.php」ファイルの</head>の前に配置（180wiki-black skinをインストールしているときは180wiki.skin.php、180wiki-sp.skin.php）

PukiWiki/カスタマイズ