自作スキン/OrangeBox by ありぃ

orangebox.gif

デモサイト: ttp://wiki.youjing.ws/(dead)

特徴

  • 3段組
  • デフォルトスキンのメニュー項目を取捨選択しています。採用したメニュー項目は下記のとおりです。採用しなかったメニュー(新規、凍結など)も、それぞれのプラグインを呼び出すことによって使えます。
    • 編集
    • 添付
    • 差分
    • バックアップ
  • 複数のページを読み込んで表示。これらのページ名を変更したい場合は、直接、スキンファイルを編集することが必要です。
    • MenuBar ― 左に表示されるボックス。pukiwiki.ini.phpによる設定は効きません。
    • SiteNavigator ― 上部のねずみ色のボックス。サイト全体のナビゲーションを想定。
    • PageNavigatorSiteNavigatorの下に表示される。topicpathプラグインの利用を想定。
    • RightBar ― 右側の「編集操作」ボックスの下に表示される。
  • 外部サイトへのリンクに、矢印の画像をつける。(JavaScriptによる実装)
  • 自作スキン/BlueBoxの姉妹版。

ライセンス(利用条件)

  • PukiWiki本体に準じます。
  • 改造・再配布はご自由に。

対応ブラウザ

FireFoxに最適化しています。基本的に、最新のブラウザなら問題なく表示されるはずです。

  • FireFox
    • 最適に表示される(1.0PRで確認)
  • InternetExplorer
    • 最適に表示されないが、閲覧・編集上問題はない。
    • ボックスの角が丸くならない。
  • Opera
    • 正常に動作(7.54)
  • Safari
    • 基本的にきちんと表示
  • IEでボックスの角が丸くならない件、画像を透過PNGから透過GIFに変更されてはいかがでしょうか? -- kogoro? 2004-11-23 (火) 14:33:16
    • 透過gifに変更しても、IEでの表示は変わらないです。丸角にするためにCSSで「:before」と「:after」を使用していますが、IEはこれらの擬似要素に対応していないためです。IEで丸角にならないのはあまり重要な問題ではないと考えていますが、どうでしょうか? ちなみにこのやり方は、http://www.mozilla.org/を真似しました*1。 -- ありぃ 2004-11-23 (火) 22:08:24

ダウンロード

ver変更点ファイル
1.1external_link.jsなどを修正file041112_orangebox.zip
1.02color_xxx.cssにより、色変更が容易に。file041105_orangebox.zip
1.01file041104_orangebox.zip
1.0初回版fileorangebox.zip

設置方法

  1. 上のリンクから最新のzipファイルをダウンロードしてください。
  2. 解凍すると、orangeboxフォルダができます。
  3. orangeboxフォルダを、そのままskinディレクトリ以下にアップロードしてください。
  4. pukiwiki.ini.phpを下のように修正し、アップロードしてください。
    // スキン/スタイルシートファイル格納ディレクトリ
    define('SKIN_DIR', 'skin/orangebox/');
  5. SiteNavigatorPageNavigatorMenuBarRightBarという名前のページを作成してください。通常のWikiページです。無くても動きます。
  6. InterWikiNameに以下の項目が記述されていることを確認し、もし記述が無ければ加えてください。右上の検索フォームを利用するためには、この設定が必要です。
    -[./?cmd=search&word=$1&type=OR 検索]
    -[http://www.google.co.jp/search?q= Google.jp] utf8
  • ご利用いただけるときは、もしよろしければ、作者のサイト (ttp://youjing.ws/(dead)) にリンクしていただけると嬉しいです*2

メニューについて

このスキンでは、メニューに「編集」「添付」「差分」「バックアップ」の4つしかありません。他の機能を利用したい場合の方法について記します。

新規

MenuBarなど任意のページに、newpageプラグインを呼び出すリンクを作成すればOKです。

[[新規:http://pukiwiki.sourceforge.jp/index.php?plugin=newpage]]

凍結

  1. InterWikiNameに以下の内容を記述
    -[[./?cmd=freeze&page= 凍結]]
  2. 例えば「管理者ページ」というページを作って、以下の内容を記述
    #lookup(凍結,凍結)
  3. そうすると「管理者ページ」に入力フォームができます。このフォームに凍結したいページ名を入力すれば、凍結できます。

色の変更方法

  1. orangeboxフォルダ内に、color_orangebox.cssがあります。それを適宜編集してください。
  2. color_orangebox.cssの名前を変えたり、別のcolor_xxx.cssを適用するときは、default.ja.cssを変更してください。
    @import ("color_orangebox.css");
             ↓
    @import ("color_bluebox.css");
    など

たとえばfilecolor_bluebox.cssを適用させると、以下のようになります。

orangebox_color_bluebox.gif

PukiWiki1.4.5への対応

このスキンは、PukiWiki1.4.5でも使用できますが、いくつか修正の必要な箇所があります。

ファイル名の変更

1.4.5では、スキンのファイル名が変更されました。

対応策:orangeboxスキンのファイル名を、「pukiwiki.skin.ja.php」から「pukiwiki.skin.php」に変更してください。

検索フォーム

検索フォームから、「サイト内を検索」することができません。(デフォルト設定でGETメソッドによる検索が禁止されたため)

  • 選択肢1:続・質問箱/590dev:BugTrack/796を参考に、plugin/search.inc.php内の設定を変更してください。ただし、サーバーに負荷がかかりやすくなるそうです。
// Allow search via GET method 'index.php?plugin=search&word=keyword'
// NOTE: Also allows DoS to your site more easily by SPAMbot or worm or ...
define('PLUGIN_SEARCH_DISABLE_GET_ACCESS', 1); // 1, 0
  • 選択肢2:スキンファイル(pukiwiki.skin.php)をエディタで開いて、検索ボックス(100行目付近以降)を削除するか改造してください。この場合、サイト内の検索のみになります。外部サイトの検索については、lookupプラグインをご利用ください。
<h2>検索</h2>
<form action="<?php echo $script ?>" method="post">
<div><input name="encode_hint" value="ぷ" type="hidden" /></div>
<div>
<input name="plugin" value="lookup" type="hidden" />
<input name="refer" value="<?php echo $title ?>" type="hidden" />
<input name="page" size="20" value="" type="text" accesskey="F" title="serch box"/>
<input value="Go!" type="submit" accesskey="g"/><br/>
<input name="inter" value="検索" type="radio" checked="checked" id="serch_site" />
        <label for="serch_site">サイト内</label>
<input name="inter" value="Google.jp" type="radio" accesskey="w" id="serch_web"/>
        <label for="serch_web">Web</label>
</div>
</form></div><!-- END id:rightbar1 -->

これ全体を、以下のように変更してください

<h2>検索</h2>
<form action="<?php echo $script ?>?cmd=search" method="post"> 
<div><input type="hidden" name="encode_hint" value="ぷ" /></div>
 <div>
  <input type="text"  name="word" value="" size="20" />
  <input type="radio" name="type" value="AND"  checked="checked" />AND検索
  <input type="radio" name="type" value="OR"    />OR検索
  &nbsp;<input type="submit" value="検索" />
 </div>
</form></div><!-- END id:rightbar1 -->

技術資料?

ご意見

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

  • hoge/MenuBarのように、階層によって有効なメニューバーを変えるにはどうしたらいいんでしょう? -- アッカ? 2005-08-19 (金) 06:23:00
  • wiki1.4.7では文字化けします。ie6ではひょうじできません。どのようにしたら良いでしょうか。 -- ゆき? 2008-02-17 (日) 23:30:27
  • 1.47はutf8ではないですか?もしそうなら、スキンの*.phpと*.jsをutf-8に変換するとうまく行くはずです。 -- ぴ? 2008-05-23 (金) 12:25:02
  • IE7で横幅を1024以下にすると、まずは右のメニュー、もっと狭くすると左のメニューが本分の下に行ってしまうようです。Firefoxでは全体が細くなり、意図通りに表示されます。 -- Eguchi? 2008-10-16 (木) 21:43:20
  • 自作スキンがつくりたいのです -- 2014-07-06 (日) 18:21:09
  • skin/pukiwiki.skin.php を編集するのが一番単純。ココはorangeboxの話題の場所なので続きは -- 2014-07-07 (月) 03:42:43
  • Q&A/デザイン・CSS質問箱5を探してみてください -- 2014-07-07 (月) 03:44:23
  • cGlDXaHdrdZOziAQ -- eqeokizfcce? 2014-11-12 (水) 16:26:20
お名前:

*1 via 「CSS Analysis―「mozill.org」のCSSを検証する」ウェブデザイニング2004年11月号,135頁
*2 改善点も分かりますし

添付ファイル: fileOSXPrev.gif 1218件 [詳細] file050216river.zip 1955件 [詳細] filecomment.png 1172件 [詳細] filescreen1.jpg 1438件 [詳細] file041112_orangebox.zip 10705件 [詳細] filecolor_bluebox.css 3579件 [詳細] fileorangebox_color_bluebox.gif 4709件 [詳細] file041105_orangebox.zip 1932件 [詳細] file041104_orangebox.zip 1901件 [詳細] fileorangebox.gif 2546件 [詳細] fileorangebox.zip 1952件 [詳細]

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2013-02-09 (土) 20:15:58
Site admin: PukiWiki Development Team

PukiWiki 1.5.2+ © 2001-2019 PukiWiki Development Team. Powered by PHP 5.6.40-0+deb8u1. HTML convert time: 0.734 sec.

OSDN