N E K O M A T A Y A

## りまぴん取扱説明書
(Page Index)

概要とインストール
チュートリアル
メニュー(AIR版のみ)
ウインドウの説明１
ウインドウの説明２
入力操作リファレンス
ユーティリティーメニュー
タイミングマクロリファレンス
環境のカスタマイズ
デザインのカスタマイズ
ユーザ設定ファイル
スタイルシート
りまぴん配布場所
AE エクスプレッション
レンダー乙女とか
りまぴん取扱説明書

ねこまたや
お道具箱
開発室掲示板

Nekomataya/2010

# りまぴん取扱説明書09 - デザインをカスタマイズ

## 目次

- 「りまぴん」のデザインをカスタマイズしましょう。

- タイムシートの色みを変更します。

- カンタンな変更
- 独自の色に変更する

- スタイルシートの書き換え

- テンプレートの書き換えをする際の注意

デザインをカスタマイズ

目次 | ページトップ | 前のページ | 次のページ

## 「りまぴん」のデザインをカスタマイズしましょう。

設定ファイルを編集するとカンタンなカラー変更やロゴの変更ができます。 お仕事で使う場合、自分の会社のロゴや作品ロゴがシートに付いていると、ちょっとしたシアワセが…

また「りまぴん」は、HTMLドキュメントなのでウェブページを書く要領でデザインの変更ができます。

「りまぴん」は、template フォルダにあるremaping.cssファイルを参照してシートの色とデザインを読み込んでいます。 このファイルを変更して全体の色調 や 線の太さ 文字の種類などの変更が可能です。

編集には、HTMLの編集知識が必要ですが、かなり突っ込んだカスタマイズなども可能でしょう。

がんばってください。

### タイムシートの色みを変更します。

#### カンタンな変更

設定ファイルを編集することでタイムシートのカラーを変更できます。

りまぴんフォルダの設定ファイルconfig.jsをテキストエディタで開き 以下の部分を探し、自分の使用するcss該当する行の冒頭の'//'を取り払います。

そのほかの行は//でコメントアウトします。

    //タイムシート背景色(どれか選択または「お好きな値」に)
    //	SheetBaseColor	="#efffef"	;//わかくさ
    //	SheetBaseColor	="#ffffef"	;//びわ
    	SheetBaseColor	="#efefef"	;//銀鼠
    //	SheetBaseColor	="#fff2f2"	;//さくら

上の例では銀鼠色を使うことになります。

#### 独自の色に変更する

スタイルシートを直接書き換えて独自の色みに変更しても良いでしょう。

connfig.js ファイル内の上で示した部分で 変数 SheetBaseColor にお好きな色を設定してください。

もともとのデザインでは淡い色を背景に使用することを考えておりますので、コントラストを反転させたい場合などは、 スタイルシートの編集も必要な場合があります。

### スタイルシートの書き換え

Webページの編集経験のある方は、スタイルシートやテンプレートフォルダ内のテンプレートファイルを直接書き換えてデザインを変更しても良いと思います。

#### テンプレートの書き換えをする際の注意

- 各要素のidは、プログラムの動作に関わりますので　変更/削除　しないようにしてください。
- 属性がhide（非表示の）要素がありますが、これはプログラムが読み出すデータです。変更/削除　しないようにしてください。

変更したデザインのファイルの再配布に関しては、オリジナルでない点を表記していただければ、他の制限はありません。

面白いデザインができたら私にも教えてください。

目次 | ページトップ | 前のページ | 次のページ