2006年03月18日

ブログプラグインに画像を貼ってみよ!

ライブドアブログの記事に写真を載せる方法は前に、「はじめてのブログ作り」→「7.管理画面の使い方 写真の投稿」っていう記事で紹介したことがあるんですが、 例えばプラグインに画像を貼ったり、背景の画像を変えたりするときは、もうすこしやり方が複雑になってきます。

今回は、記事以外のところに好きな画像を貼り付ける方法をご紹介です。

1.準備した画像を「ファイルのアップロード」でアップします。
  この時、サムネイルの作成のチェックを外しておきます。(縮小画像は使いませんからね)

2.アップしたファイルのリストを開いて、投稿するをクリックします。
  このときに下のようなタグ(画像を示すコード)が表示されるので、 これをコピーします。

<img src="http://image.blog.livedoor.jp/xxxx/imgs/8/e/xxxxxxxx.jpg" width="200" height="100" border="0" alt="nanohana-railway-spring" hspace="5" class="pict" align="left" /><br />

3.プラグインにこの画像を表示させたい場合はフリーエリアを作成して、貼り付けます。

4.<br />と、align="left"の部分を削除すれば完成!
 (改行設定は、「変換しない」を選んでおいてください) 

基本的にはこんな手順です。応用を利かせるといろんな場所に画像を貼り付けられますよ!

見た目にこだわる方や、タグの意味を知りたい方のために、タグについて少し解説しますね。


img
 イメージ画像を貼り付けるっていう意味です。

src="http://image.blog.livedoor.jp/xxxx/imgs/8/e/xxxxxxxx.jpg"
 これがネット上の画像のアドレスです。

width="200" height="100"
 幅と高さの指定です。

border="0"
 画像のまわりの枠の太さです。通常0です。

alt="test-image"
 画像のタイトルです。

hspace="5"
 画像の左右の余白です。

class="pict"
  スタイルの指定です。

align="left"
  画像の左寄せです。

<br />
  改行をするタグです。


こうやって見ると、いろんな設定内容が含まれていますが、hspace、class、alignの項目は別にいらないので、省いておいた方がいいかもしれません。省くと、こんなコードになります。
<img src="http://image.blog.livedoor.jp/xxxx/imgs/8/e/xxxxxxxx.jpg" width="200" height="100" border="0" alt="test-imgae" />

このテクニックを使うと、プラグインにランキング登録なんかのバナーを表示させたり、背景画像を変えたりする時にとっても役立ちますよ。

今日から私のサイトも春色にリニューアルしてみました。もし、タイトル画像を変えたいって方は、前に書いた記事「ブログのタイトル画像を変えたい」で、お手伝いできるかもしれません。


トラックバックURL

この記事へのコメント

1. Posted by 浩   2006年03月18日 23:06
こんばんは、いつもコメントありがとうございます!今度トップページの写真を変えたいと思ってるので、また相談にのってください。あっちのサイト、味のある写真ばかりですね〜雰囲気イイです。個人的には『大仏様』がお気に入りデス!また来ますね
2. Posted by wo   2006年03月19日 23:42
浩さん、ありがとうございます。
私も大仏様が大好きです。
トップページ写真変えるのちょっと大変ですが、お手伝いしますよ〜。

この記事にコメントする

名前:
URL:
  情報を記憶: 評価: 顔   
 
 
 
アクセスカウンタ

    ブログ内検索
    Google


    よりみちweb
    www