「Simple Web Button 1」は、シンプルなグラデーション・ボタンを生成するGIMPプラグイン。
このプラグインを使うには、GIMP用Pythonモジュールが必要である。
インストール
配布ページ:GIMP Plugin – Simple Web Button 1
「bp_simple_btn_01_v1.2.zip」をダウンロードし、解凍。
解凍して現れた「b&p_simple_btn_01_v1.2.py」ファイルを、plug-ins フォルダに入れる。
plug-insフォルダは、Windowsの場合、「C:\Users\ユーザー名\.gimp-2.8\plug-ins」である。
GIMPを再起動する。
「 画像の生成 ≫ Webページテーマ ≫ www.bytes-and-pixels.com 」内に、「 Simple Web Button 1 」が追加されていれば成功。
「Glossy Button 2」の使い方
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-300x103.png)
「 画像の生成 ≫ Webページテーマ ≫ www.bytes-and-pixels.com 」内の、「 Simple Web Button 1 」をクリックし、「python-fu-Simple_Button_01」ダイアログを呼び出す。
「python-fu-Glossy_Button_01」ダイアログ
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-dialog](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-dialog-300x523.png)
- Button Width
ボタンの幅。
- Button Height
ボタンの高さ。
- Corner Radius
角の丸みの半径を指定。
「0」を指定すると、丸めない。
- Color
ボタンの色を指定。
- Add Text
ボタンに、テキストを追加するか、しないかを選択。
- Text Size(px)
テキストのサイズを指定。
- Text
ボタン上に描くテキストを入力する。
- Font
ボタン上に描くテキストのフォントを指定。
- Text Color
テキストの色を指定。
- Flatten Image
テキストや影や反射などのレイヤーを結合するか、しないかを選択。
「Yes」を選択すると、1つのレイヤーに結合する。
「No」を選択すると、テキストや影や反射などを個別のレイヤーに出力する。
- Autocrop Result
ボタンを自動切り抜きするかどうか。
「Flatten Image」で「Yes」を選択する必要がある。
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-layer](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-layer.png)
「python-fu-Glossy_Button_01」ダイアログの「Flatten Image」を「しない」で適用すると、テキストや枠線などを個別のレイヤーに出力する。
「Glossy Button 2」による生成例
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--default](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-default.png)
初期設定値で適用。
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--buttonWidth-200](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-buttonWidth-200.png)
- Button Width: 200
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--buttonWidth-100](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-buttonWidth-100.png)
- Button Width: 100
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--buttonheight-100](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-buttonheight-100.png)
- Button Height: 100
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--buttonheight-25](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-buttonheight-25.png)
- Button Height: 25
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--cornerradius-0](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-cornerradius-0.png)
- Corner Radius: 0
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--cornerradius-3](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-cornerradius-3.png)
- Corner Radius: 3
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--cornerradius-6](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-cornerradius-6.png)
- Corner Radius: 6
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--cornerradius-10](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-cornerradius-10.png)
- Corner Radius: 10
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--Color-red](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-Color-red.png)
- Color: 赤色
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--addtext-no](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-addtext-no.png)
- Add Text: No
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--textsize-10](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-textsize-10.png)
- Text Size: 10
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--text-sample](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-text-sample.png)
- Text: サンプル
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--Font-ElephantItalic](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-Font-ElephantItalic.png)
- Font: ElephantItalic
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--textcolor-red](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-textcolor-red.png)
- Text Color: 赤色
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--flattenImage-yes](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-flattenImage-yes.png)
- Flatten Image: Yes
![File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex--flattenImage-yes--AutocropResult-Yes](http://alphasis.info/wp-content/uploads/2014/11/File-Create-WebPageThemes-wwwBytesAndPixelsCom-SimpleWebButton1-ex-flattenImage-yes-AutocropResult-Yes.png)
- Flatten Image: Yes
- Autocrop Result: Yes