ブログの写真に枠をつける方法（フレーム加工）

 

ここでは、ブログの写真に枠をつける方法（フレーム加工）を紹介する。

 

画像加工ツール（PhotoScape）で加工

 

まずブログの写真に枠をつける方法としては、３つの手法がある（たぶん）。

 

で、一つ目は「画像加工」という、ツールで加工する方法。

私は、「PhotoScape」というツールを使用して加工した。

では作業に入る。

PhotoScapeに移動しよう。

 

ダウンロードはこちらからどうぞ。

PhotoScape

 

 

PhotoScapeに移動したら、「画像編集」を選んで、加工したい写真を選択する。

◆ファイルを選択（ここでは、ヒッキーラボ２）

◆写真を選択

 

 

そうしたら、加工画面が表示される。

選択した写真画像が大きい場合には、加工がしにくいので、「縮小」のアイコンを数回クリックしよう。

 

 

するとこんな感じで加工しやすくなる。

 

 

次は、下部にある「オブジェクト」を選択する。

 

 

オブジェクトでは、「四角のアイコン」を選択し、色は「黒」、線は「直線（普通）」、厚さは「３」、を選択する。

 

 

そうしたら、写真の四隅に合わせて、四角い枠を取り付ける。

左クリックして、そのままスライドさせれば簡単に枠をつけることができるのである。

 

 

加工が終わったら、こんな感じになる。

あとは「保存」をするだけである。

 

テンプレートのタグで加工

 

二つ目は、Wordpressのテンプレート（カエテンWP）のタグ機能を使って加工する方法。

ちなみに、テンプレートによっては装備されていない場合がある。

そうした場合には、他の２つの方法を推薦する。

 

では、新規投稿画面に移動しよう。

 

 

投稿ページに移動したら、まず「メディアを追加」で写真のファイルをアップロードして、投稿画面に挿入する。

終わったら、「テキスト画面」に切り替える。

 

 

テキスト画面では、写真の画像コード（＜img～～）を全て選択して、上記にある「ボックス３」をクリックしよう。

 

 

無事に「ボックス３」のコードが追加されると、写真に枠がついた形になる。

 

 

「プレビュー画面」で確認するとこんな感じになる。

 

 

ちなみに、画像を大きくするとそれに合わせて枠も大きくなるのである。

 

imgタグの編集（コードを追加）

 

三つ目は、imgタグを編集する方法。

 

では、新規投稿画面に移動しよう。

 

 

投稿ページに移動したら、「メディアを追加」をクリックして、写真ファイルをアップロード後、画像を投稿ページに挿入する。

挿入後は、「テキスト画面」に切り替える。

 

 

テキスト画面では、「imgタグ」を編集する。

「ここにコードを追加」という部分に下記のコードを追加する。

ちなみに、枠自体を加工したいという場合には、下記のサイトに詳しく書いてあるぞ。

チルの工房

http://chillslab.blog52.fc2.com/blog-entry-93.html

 

 

コードを追加したらこんな感じになる。

どこに追加したのかが分かりにくい、見にくいという場合には下記を参照である。

これで、「imgタグ」の編集は完了である。

 

 

「プレビュー画面」で確認するとこんな感じになる。

 

以上で、ブログの写真に枠をつける方法（フレーム加工）についての解説は終了する。