• 車種別
  • パーツ
  • 整備手帳
  • ブログ
  • みんカラ+
ブログの挿入画像用に使用しております。 何か気になったら書き込んでいただいて結構ですよ。
僕のはこのタグを使っています。

<a href="/image.aspx?src=写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=220 align=left ></a>

このタグだと下に挿入したテキストが画像の右側に表示されます。
画像の縦の長さまでテキストが並びますので改行で調整します。

align=left これが表示位置です。align=rightこう変えると画像が右テキストが左になります。

この中のwidth=220 が表示画像の横幅で550までがプロフが下に行かない最大です。

ブログのいつもの一番左上の画像に同じ高さで右に並べるのは本文中の一番上に
<a href="/image.aspx?src=写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=220 align=right ></a>
これで入ります。

本文途中に並べるには
<a href="/image.aspx?src=写真アドレ①"Target="_blank"><img src="写真アドレス①" border="0"width=220 align=left ></a><a href="/image.aspx?src=写真アドレス②"Target="_blank"><img src="写真アドレス②" border="0"width=220 align=right ></a>

改行せずにタグを入れれば同じ高さになります。

続けてテキストを入れると画像と画像の間に入り込みますので、入れない場合はタグのあとに画像の高さ分改行してください。

ご存知だと思いますが、写真のアドレスはどこのサイトのも右クリックのプロパティで表示できるので、一度保存しなくてもOKです。

このタグはクリックで拡大します。拡大したときに「閉じる」と「コンテンツに戻る」が表示されて、コンテンツに戻るをクリックすると画像が置いてあるフォトギャラや掲示板に飛びます。

もう1ついつも使うタグですが
<a href="/image.aspx?src=写真アドレス"target="_blank"><img src="写真アドレス" alt="" width="220" style="border-width:0;" onerror="this.style.display='none';" /></a>
使い方は同じですが、これはテキストが横にまわり込まないパターンです。
通常の画像挿入だと画像が保存画像の大きさ(後ろにwidth="220入れると表示自体は変えれますが)ですが、このタグで「クリックで拡大」します。

すみませんしつこい説明になってしました。
僕はタグをメモ帳に置いて、コピペしながら使ってます。
下のタグをコピペして、「写真アドレス」部分を使いたい画像アドレスに
置き換えてください。


↓コピペ用

<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>

数字部分は本文中の表示サイズですので変更可能
左右どちらに置くかも好みで変えて下さい。
Re:ブログの1枚目のように横にコメントクリックで大きい画像が出るようにするまとめ [ はやたか ] 2007/06/13 07:14:24
↓コピペ用

<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>


↑これで1枚目と同じ大きさになります。
Re2:ブログの1枚目のように横にコメントクリックで大きい画像が出るようにするまとめ [ はやたか ] 2007/07/15 11:42:57
> ↓コピペ用
>
> <a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>
>
>
> ↑これで1枚目と同じ大きさになります。


<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=220 align=left ></a>


↑スミマセン220が同じ大きさでした。
Re3:ブログの1枚目のように横にコメントクリックで大きい画像が出るようにするまとめ [ はやたか ] 2007/09/18 22:18:49
さらに追加です。クリックした画像の下に、掲示板やフォトギャラのように「閉じる」と「コンテンツに戻る」を表示させる場合

コピペ用↓

<a href="/image.aspx?src=写真アドレス"target="_blank"><img src="写真アドレス" alt="" width="220" style="border-width:0;" onerror="this.style.display='none';" /></a>

これで写真の下に表示が出ます。正し、これらの画像から「コンテンツに戻る」をクリックした場合に、戻る先はブログではなく写真が保存してある掲示板やフォトギャラになりますので、ご注意下さい。
Re4:ブログの1枚目のように横にコメントクリックで大きい画像が出るようにするまとめ [ はやたか ] 2007/09/18 22:33:27
追記です。
先ほどのタグだと写真の下にしかコメができませんのでいつものように「右側にコメ」を入れる場合は

コピペ用↓

<a href="/image.aspx?src=写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=220 align=left ></a>

これでいけます。
1、使用する画像をスタイルシート/フォトギャラ/掲示板にアップします。
2、使う画像を表示させて右クリック→プロパティで画像のURLをコピー
3、ブログの本文中で左上のメニューから「画像」をクリック出てきたBOXに
  画像のURLをペーストします。

<img src="画像アドレス" border="0">こんな風になっているはずです。


4、確認または下書き保存にチェックを入れて登録すると表示されます。
5、このままでは画像が大きすぎてプロフが下の方に行ってしまうので
  画像の表示サイズを調整します。
6、ブログの編集画面に戻って画像の挿入タグの後ろの方に
  表示サイズ指定を追加します。

↓コピペして使ってください。

<img src="写真アドレス" border="0"width=500>

このwidth=500の数字部分が表示サイズです。500が本文の幅くらいです。

複数使用する場合は、この繰り返しです。

プレビューで確認してよかったらアップして下さい。
下書きにチェックした場合はチェックをはずさないと公開されませんので注意。
Re:ブログに大きい画像を追加する場合のまとめ [ はやたか ] 2007/08/28 11:24:09
<img src="写真アドレス" border="0"width=500>

このwidth=500の数字部分が表示サイズです。500が本文の幅くらいです。

      ↓
本分の幅は550でぴったんこでした。ここまでならプロフが下に行きません。

事前に画像加工で550にしてしまえば、ブログの「画像」ボタンで追加するだけです。
写真を右または左に寄せてコメントを入れるようにします。
 (ブログの出だし部分のような感じで使う)
数字部分で表示サイズは変更できます。

↓コピペ用(右)

<img src="写真アドレス" border="0"width=200 align=right >

↓コピペ用(左)


<img src="写真アドレス" border="0"width=200 align=left >


コピペ用
<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>

Re:ブログに追加した画像を小さくして横にコメントを入れるまとめ [ はやたか ] 2007/06/13 07:13:06
コピペ用
<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>

↑これで1枚目と同じ大きさになります。
Re2:ブログに追加した画像を小さくして横にコメントを入れるまとめ [ はやたか ] 2007/07/15 11:44:38
> コピペ用
> <a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>
>
> ↑これで1枚目と同じ大きさになります。

<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=220 align=left ></a>


↑スミマセン200だとちょっと小さいので220でいい感じになります。
- 画像タグ4 [ はやたか ] 2007/05/18 19:56:09
<a href="http://carview-img6.bmcdn.jp/carlife/images/bbsmsg/525971/p1.jpg"Target="_blank"><img src="http://carview-img6.bmcdn.jp/carlife/images/bbsmsg/525971/p1.jpg" border="0"width=200 align=left ></a>

コピペ用
<a href="写真アドレス"Target="_blank"><img src="写真アドレス" border="0"width=200 align=left ></a>
1 - 5 / 16 次へ >>
© LY Corporation