はじめに

  • Web Gallery Professionalの管理ページ用スキンです。訪問者向ページ・携帯向ページは変化しません。
  • ブラウザのCSS実装状況によってディテールの異なるパーツがあります。
  • Web Gallery Professional本体のバージョンは2.30で確認しています。本体バージョンが異なる場合は、スキンの修正が必要になる事があります。変更箇所はWeb Gallery Professional本体の更新履歴を確認してください。
  • スキンを導入する前に、Web Gallery Professional付属の初期状態のスキンで、CGIの機能や動作を確認してください。
  • ライセンスは『Creative Commons 表示 - 継承 2.1 日本 (CC BY-SA 2.1)』です。
    http://creativecommons.org/licenses/by-sa/2.1/jp/
  • 使用に際して生じたいかなる損害も当方は責任を負いません。作業前のバックアップ推奨です。
  • 設置・カスタマイズに関するサポートは行っておりません。

使い方

CGI本体ファイルを編集します。記述ミス等があるとCGIの動作に問題が発生します。
ファイルの文字コードは必ずUTF-8N(=UTF-8 BOM無し)で保存してください。

  1. defaultフォルダの内容を、設置したgalleryproのskin内にアップロード
  2. gallerypro/lib/webliberty/App/Init.pmを開いて90行目あたりにある↓を
    rewrite_mode => 0,
    以下のように変更
    rewrite_mode => 1,
    更に、gallerypro/lib/webliberty/App/Init.pmの202行目あたりにある↓を
    #拡張設定
    %{$init->{rewrite}} = (
      '' => '',
      '' => '',
      '' => '',
      '' => '',
      '' => ''
    );
    以下のように変更
    #拡張設定
    %{$init->{rewrite}} = (
      '{query}{mode}={admin}' => '{skin_header}={admin_header.html}&{skin_footer}={admin_footer.html}',
      '' => '',
      '' => '',
      '' => '',
      '' => ''
    );
  3. 編集したgallerypro/lib/webliberty/App/Init.pmをアップロード

色を変更する場合は、引き続き『色変更』を行ってください。

<head></head>内にjsファイルやcssファイルを別途読み込むカスタマイズを行う場合は、【<head>~</head>内を編集】を参照してください。

色変更

  1. 【使い方】の手順通りにdefaultを導入する
  2. extra_colorフォルダを開き、使用したい色フォルダの中のwm_wgp_admin.cssを、設置したgalleryproのskin内にアップロード
    • 色一覧▽
      ■teal (※default) ■blue ■brown ■green ■purple

カスタマイズ

カスタマイズの前に

ファイルを編集する場合は、文字コードをUTF-8N(=UTF-8 BOM無し)に指定して保存してください。

日本語(等の2バイト文字)を含まないファイルは、エディタによってはShift-JISとして開く事がありますので、文字コードを指定しなおしてください。

異なる文字コードで保存すると、文字化けやエラーになったりします。
cssファイルが文字化けした場合は、文字化け付近の指定が適用されなくなる等の問題が発生します。

参考:
文字コード>UTF-8のBOMについて
EmEditorのインストール
EmEditorの設定

htmlのカスタマイズ

プラグイン管理へのリンクを左側メニューに追加

  1. skin/admin_work.htmlを開いて23行目あたりにある<!--SKIN_WORK_FOOT_START-->の直後の行に↓のように追加
    <h3>プラグイン</h3>
    <ul>
    	<li><a href="プラグイン管理ページへのリンク">プラグイン名</a></li>
    	<li><a href="プラグイン管理ページへのリンク">プラグイン名</a></li>
    </ul>
  2. 編集したskin/admin_work.htmlをアップロード

<head>~</head>内を編集

<head>~</head>への追記が必要な場合(追加のjsファイルやcssファイルを読み込むカスタマイズをする時等)は、skin/admin_header.htmlを編集してください。
管理画面以外(訪問者向けページ)でも使用するものを読み込む場合は、skin/header.htmlも一緒に編集してください。

cssのカスタマイズ

編集するファイルについて

  • skin/wm_wgp_admin.css (管理画面スキン用)

大まかな設定部分にジャンプ (基本文字サイズ等)

skin/wm_wgp_admin.cssを開いて、ファイル内をで検索すると、大まかな設定部分に飛ぶ事が出来ます。

ヘルプ

htmlファイルを編集したら文字化けした

ファイルを編集する場合は、文字コードをUTF-8N(=UTF-8 BOM無し)に指定して保存してください。
異なる文字コードで保存すると、文字化けやエラーになったりします。
cssファイルが文字化けした場合は、文字化け付近の指定が適用されなくなる等の問題が発生します。
※日本語(等の2バイト文字)を含まないファイルは、エディタによってはShift-JISとして開く事がありますので、文字コードを指定しなおしてください。

参考:
文字コード>UTF-8のBOMについて
EmEditorのインストール
EmEditorの設定

Web Gallery Professional 機能解説
http://www.web-liberty.net/download/gallerypro/function.html
スキンの基礎
http://www.web-liberty.net/improve/design/index.html
Web Gallery Professional のスキン情報
http://www.web-liberty.net/improve/design/gallerypro.html
初期設定の拡張設定機能
http://www.web-liberty.net/improve/system/rewrite.html

更新履歴

2011/06/02
配布開始

作者情報

Name
wmks
WebSite
witchmakers | http://www.usamimi.info/~witchmakers/
Profile
Google Profile

Thanks

Web Gallery Professional
Knight
http://www.web-liberty.net/