5-2.変更したデザインに合うヘッダを作成する(写真のサイズ変更)

選んだテーマの中には、自分でヘッダの画像を変更をできるものがあります。
ですが、デジカメでとったままの写真は、トップページの写真のサイズや表示場所に合わないものもあります。
その為に、写真を予め切り抜いたりして表示するサイズに合わせるのです。

手順は以下の通りです。

(1)テーマにあった表紙にする画像を選ぶ。
(2)画像のサイズを確認する。異なる場合、画像(写真等)のどの部分を表示したいか考えておく。
(3)画像の加工を行う。新たに表紙用にサイズを変更した画像を保存。
(4)”農園基本情報”で作った画像を設定する。
2-2.農園基本情報を入力する
ここでは、(1)~(3)の流れを説明します。

現在変更が可能なのは以下の3テーマです。(2012.4末現在 テーマ一覧はこちら

1.CryBook
2.2010Weaver(幅:940、高さ:198)
3.Kitten in Pink(幅:936、高さ:175)
4.Nightlife(幅:860、高さ:180)
5.Pixiv Custom(幅:980、高さ:200)

画像の作成には加工ソフトが必要です。

パソコンに初期導入されている”ペイント”でも作成は可能ですが、OSによって操作が異なる為、今回はフリーソフト(無償配布)のJTrimを使って操作説明を行います。

1.JTrimのインストール

最初に加工ソフトのダウンロードを行います。

ホームページアドレス:http://www.woodybells.com/jtrim.html
インストールマニュアル:5-3.画像加工ソフトのインストール(JTrim版)

2.テーマとサイズを確認

では、実際に進めます。今回は、5.Nightlifeというテーマに合った画像を作成します。
最初に必ず作成する画像のサイズを確認してください。

テーマ毎の仕様情報はダイレクトを参照します。
4.Nightlifeのヘッダ画像のサイズは、幅:860ピクセル × 高さ:180ピクセルです。
初期導入時からお客様側でデザインを変更した際には、表紙の1枚目の写真が左寄せされた状態になっています。
そこで、このデザインにあったヘッダ画像に入れ替えます。

サンプルデザイン

3.加工する写真を開く

JTrimを起動します。すると、下記の画面が表示されます。
サンプルデザインを元に、自分がどんなヘッダ画像を作るかイメージしてください。

その上で対象となる写真をまずは開きます。今回は、1枚の写真のみ使用します。

ファイルを開く

以下のように、大きなサイズの画像が開かれます。

画像(大)

4.画像サイズ変更

次に、画像のサイズを変更します。

作りたいヘッダは横長の画像で、もとの写真と縦横の比率が異なります。
まずは、横のサイズを固定して、次に必要な部分だけ切り取る事とします。

メニューの[イメージ]→[リサイズ] を選択します。

リサイズ

縦横比率は保持したままで、横のサイズだけ指定します。[OK]ボタンを押します。

サイズの入力

横幅が小さくなり、画面内に画像がおさまったのが分かると思います。

サイズ変更後

5.切り抜き

横幅はヘッダのサイズと一致しましたが、高さは高すぎます。
写真の中で好きな場所を決め、切り抜きます。

メニュー [イメージ]→[座標指定切り抜き]を選択

切り抜き

まずは座標のスタート点を左上、x:0   y:0 にします。
その上で、右下の点を x:860   y:180にします。

最終的に切り取るサイズの枠線が表示されます。(薄いグレーの線です)
この枠を上下に動かして、切り取りたい場所にもっていきます。

切り抜きたい場所へ移動

上のサンプルでは、分かり易いように白枠にしています。白い握る形の手が出たら、任意の場所へドラッグしてください。
場所を決めたら、[OK]ボタンを押します。

ボタンを押す前に、座標2のxが860のままか、座標1と2のyの差が、180か、再度確認してください。
万が一、枠のサイズを変えてしまった場合には、切り抜きの最初からやり直してください。

6.保存

画像がヘッダと同じサイズに切り抜けました。
最後に画像ファイルを保存します。
画像ファイルの種類は用途により複数ありますが、今回はJPEGファイルとします。

メニュー [ファイル]→[名前を付けて保存]

保存

保存場所は、後で分かるような簡単な場所へ保存してください。
ファイルの種類がJPEGになっている事も確認してください。

保存

なお、ここでメッセージが出る場合があります。

メッセージ

その時には、保存オプション(保存画面では”設定”ボタン)で、Exitデータを保存する。のチェックをはずしてください。
次回以降も反映されるように、この設定を保存するボタンにチェックが入っている事も確認してください。

保存オプション

ここまでで、画像の準備作業が完了しました。
では早速、ホームページに作った画像をアップしてみましょう。
画像のアップは、宅配管理プレミアムの”ミライ産直”で行います。
2-2.農園基本情報を入力する