初めての Opera スキンカスタマイズ

準備

  • Reload Skin のボタン/ショートカットキーを作成
    • 適用中のスキンをリアルタイムで確認できる。
    • タブバーの縦幅など、一部再起動を必要とする個所もある。
  • 元となるスキンを準備
    • 好きなスキンでいいんだけど、極力古いスキンは避けた方がいい。
    • 初めて手をつけるなら standard_skin.zip が断然おすすめ。
  • スキンの zip ファイルを解凍し、opera:config#UserPrefs|ButtonSet で skin.ini を指定
    • [保存] を忘れずに。
    • ここで zip を指定することもできる。
  • opera:config#UserPrefs|DebugSkin を有効に
    • マウスオーバーした要素のスキン情報がツールチップで表示されるようになる。
    • 要素名に何も表示されなかったり、ツールチップの表示自体できない個所もある。
  • 透過 png に対応したペイントソフトを導入
    • 画像ファイルは全て png ( gif でも可。アイコンはアニメ gif にも対応してる）
    • Windows 標準のペイントでは透過が勝手に無効にされちゃうので使えない。
    • Paint.NET とか GIMP とか、まぁ好きなのを。

これで準備は完了！


まずは

  • 何をしたいのか、どういう風にしたいのかをイメージ
    • 全てのボタン/ツールバーの色/サイズ、アイコン、文字色など自由度が高いので、ある程度の指針を立てる。
    • パネルの文字色や文字サイズなどスキン側では変更できない個所もある。
  • ちょこっといじってみる
    • 画像とそのファイル名で、ある程度は何の画像か分かるはず。
    • とりあえず画像を編集してみて Reload Skin でリアルタイムに更新できてることを確認。
    • ボタンとかマウスオーバーしてスキン情報を見て skin.ini と照らし合わせてみる。
  • skin.ini まずは押さえときたい
    • Padding：拡げ幅　Margin：余白幅　Color/Text Color：WEB色見本 原色大辞典
    • Type = BoxStretch：領域内に自動で拡大縮小する。StretchBorder で拡大率？を調整。
    • Type = BoxTile：並べて表示。複数の画像を配置することも可能。

zip にする

  • Opera 側で表示されるスキン名となる skin.ini の [Info] Name を分かりやすいように記述。
  • 自分で使う分には、zipにせずに skin.ini のまま使っても問題はない。
  • zip にするときは skin.ini を含むファイル群をまとめて圧縮。（skin.ini が入ってるフォルダではない）

参照



気が向いたら追記する。