XillionMenu

最新の0件

人気の20件

アクセス数

• はじめに
• 口絵絵とリンク先を変える
• メニューに画像を使う
• メニューにボタンを追加する
• フッターの右寄
• サイドバーに検索ボックスを設置
• サイドバーの背景を塗潰す
• タイトルを枠で囲む
• 特定のページをリストに表示させない

はじめに　

今回のPukiWiki導入にあたり、カスタマイズ項目を記しておきます。
筆者のレベルですが、phpの知識ゼロです。ホームページが作成でき、cgiなどはフリーのものを設置できる程度です。
また、サーバーの都合上、PukiWiki1.3.6を使用しています。
ブラウザはie5です。
なお、wiki本体（デフォルトのファイル名がpukiwiki.php）のあるフォルダをルートフォルダと呼び、『./』で表します。
※PukiWikiのデフォルトの機能はメンテナンスをする上で重要なものですので変更や削除は充分気をつけてください。

ページを分割しました。新しいトピックスは数字の大きなページへ追加します。

• PukiWiki/カスタマイズ
• PukiWiki/カスタマイズ/その２
• PukiWiki/カスタマイズ/その３

口絵絵とリンク先を変える　

口絵といっているのは、ページ左上の画像です。

• イメージの保存
  

ルートフォルダに適当な名前で保存します。
下の例ではxillion.jpgを保存しておきます。

• スキンファイルの変更
  

./skin/pukiwiki.skin.ja.phpの29行目を変更します

<a href="http://www.xillion.net/"><img src="xillion.jpg"
width="100" height="100" border="0" /></a><br />

メニューに画像を使う　

画面上部の[]で囲まれたメニューをアイコンにします。

• アイコン画像の準備

./image/にアイコンとして使用したい画像を保存します。
下の例ではマウスが乗っている時の画像new3.pngと
マウスが外れた時の画像new.pngが必要です。
※imageフォルダには画面下部のアイコンなどに使用するgifファイルが存在しています。

• スキンファイルの変更
  

./skin/pukiwiki.skin.ja.phpの44〜62行目を変更します
いらないボタンを削除したり、必要なボタンを追加したりすます。
新規ボタンの例

<a href="<?php echo $script ?>?plugin=newpage">
<img src="./image/new.png" border="0" alt="新規"
onmouseout="this.src='./image/new.png'"
onmouseover="this.src='./image/new3.png'" /></a>

• 画面下部のアイコンの非表示
  

ページ上部にアイコンを使用しますので、下部のアイコンは消しておきました。
./skin/pukiwiki.skin.ja.phpの95〜115行目を削除します

メニューにボタンを追加する　

上のトピックスの応用です。メニューボタンの機能のカスタマイズです。
以下の例ではBBSというボタンメニューに追加して、このボタンを押すとＶＢＡのＢＢＳというページを表示させます。

<a href="<?php echo "$script?".rawurlencode("[[ＶＢＡのＢＢＳ]]") ?>">
<img src="./image/bbs.png" border="0" alt="ＢＢＳ"
onmouseout="this.src='./image/bbs.png'"
onmouseover="this.src='./image/bbs3.png'"/></a>

使用例はVBA Tipsです。

フッターの右寄　

全体をdivタグで右寄せにします。

• スキンファイルの変更
  

./skin/pukiwiki.skin.ja.phpの123〜128行目のaddressタグにdivを挿入します。
　<address><div align="right">
　　　Modified by <a href="<?php echo $modifierlink ?>">
　　　<?php echo $modifier ?></a><br />
　　　<php echo S_COPYRIGHT ?><br />
　　　Powered by PHP <?php echo PHP_VERSION ?><br />
　　　HTML convert time to <?php echo $taketime ?> sec.
　</div></address>

使用例はVBA Tipsです。

※<adreess>タグの中に<div>タグを書くことはできません。

フッターを右寄せにしたい場合は、スキンファイルはデフォルトのままにしておいて、CSSファイルの中のaddressに対して、text-align:right;を指定します。

CSSファイルのaddressに

 address{
     (略)
     text-align:right;
 }

のように書き換えます。-- reimy

※Ver1.3.6ならできるようですね。

• だめですよ。1.3.6であろうが<adress>〜</address>の中に<div>タグは置けません。

HTMLの仕様であれば、PukiWikiのバージョンは無関係でしょうね。
でも実際にやっているんですけどね。。。
たとえばこのページのソースをみればわかると思いますが。。。
まあたいした問題ではないので、できるやり方で実現してみましょう。

サイドバーに検索ボックスを設置　

画面左端のサイドバーの上部に検索ボックスを置きます。
検索ボタンと同等の機能です。

• スキンファイルの変更
  

./skin/pukiwiki.skin.ja.phpの69行目の直前に検索ボックスのコードを組み込みます。
茶色の部分が追加するコードです。

　<h5 class="side_label">検索</h5><br>
　　<form action="<?php echo $script ?>?cmd=search" method="post">
　　<div>
　　　<input type="text" name="word" size="15" value="" >
　　　<input type="submit" value="検索" ><br>
　　</div>
　</form>
　<?php echo convert_html(@join("",@file(get_filename(encode("Menubar"))))) ?>

使用例はVBA Tipsです。

サイドバーの背景を塗潰す　

• スキンファイルの変更
  

./skin/pukiwiki.skin.ja.phpの68行目に背景色を指定します。
下の例では、サイズも120pxから150pxに拡大しています。

　　<td valign="top" style="width:150px;word-break:break-all;background:#ffdddd">

使用例はVBA Tipsです。

タイトルを枠で囲む　

タイトルにボーダーを設定します。
ボーダー以外にも文字種、文字色、背景色も設定ができます。

• スタイルシートの変更
  

./skin/default.ja.cssのh1, h2, h3, h4, h5, h6の設定に追加

　h1, h2, h3, h4, h5, h6
　{
　　border-top: #222288 1px solid;
　　border-bottom: #222288 1px solid;
　　border-left: #222288 1px solid;
　　border-right: #222288 1px solid;
　　font-family: MS ゴシック,verdana, arial, helvetica, Sans-Serif;
　　font-size: 14px;
　　COLOR(882222){color: #226622; 　　background-color: #aaaaee;
　　padding: .3em;
　}

使用例はVBA Tipsです。

特定のページをリストに表示させない　

正規表現でフルにマッチするページ名として指定しています。
|はORを意味します。

• Wiki設定ファイルの変更
  

./pukiwiki.ini.phpの$non_listを変更する

　　$non_list = "^(\[\[\:)|(InterWikiName)|(ExcelVBA)|(MenuBar)|(ヘルプ)|(ＶＢＡのＢＢＳ)";

使用例はVBA Tipsです。