記事本文を飾り付けてみよう「（その１４）Wiki超入門４」

今回は画像を貼り付ける方法をご紹介します。
画像を文の一番上に表示させるだけならば、アップロードするだけでいいのですがここでは文中に貼り付ける方法をご紹介します。
それでは、早速やってみましょう。

※Wikiを使用する場合は、記事本文を記入する欄の右上にある「Wiki文法使用」をチェックしておいてください。

基本的な文法としては

[[img(画像のアドレス,横の大きさ,縦の大きさ,説明文)]]

（※注　それぞれの間は","(半角カンマ)で区切っています。）
です。

画像のアップロードの仕方は、
Yahoo!blogをはじめてみましょう「（その４）画像を投稿してみよう前編」
画像のアドレス調べ方は、
Yahoo!blogをはじめてみましょう「（その５）画像を投稿してみよう後編」
を参考にしてください。

■画像を貼り付ける（簡易的なやり方）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546)]]

結果）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■画像を貼り付ける（画像の横の大きさで指定する）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546,300)]]
（※ここでは横の大きさ300ピクセルで指定。540ピクセルを限度にした方が良いようです。）

結果）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■画像を貼り付ける（画像の縦の大きさで指定する）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546, ,100)]]
（※ここでは縦の大きさ100ピクセルで指定。）
（※注　横の大きさの部分に" "(半角スペース)が入っています。）}

結果）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■画像を貼り付ける（画像の縦横の大きさを指定する）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546,300,100)]]
（※ここでは横の大きさ300ピクセル、縦の大きさ100ピクセルで指定。意図的に変形させたい場合などは、このように縦横共に指定します。）

結果）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■画像を貼り付ける（画像に説明文を入れる）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546, , ,これは花畑の画像です。)]]
（※注　横の大きさ・縦の大きさの部分に" "(半角スペース)が入っています。）}

結果）

（※カーソルを画像に合わせ少し待つと、説明文が現れます）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■画像を貼り付ける（すべてを指定する）

文法）
[[img(http://img.blogs.yahoo.co.jp/ybi/1/58/7d/i_8jo/folder/79519/img_79519_217712_0?1109361546,300,100,これは花畑の画像です。)]]

結果）

（※カーソルを画像に合わせ少し待つと、説明文が現れます）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

如何でしたか？文中に画像を貼り付けられると表現も豊かになると思います。
いろいろと試してみてくださいね。

余談ですが、説明文を入れておくとYahoo!JAPANやgoogleの画像検索などにおいて、そのキーワードで検索対象となります。また、目が見えない方がネットをする時に、音声にて何の画像なのかを知る事ができます。
ちょっと面倒ですけど、入れておくといろんな方に優しいページになるということですね。

[感謝]
この記事は「きろくぶろぐ」さんの記事を参考にさせていただきました。
もしも、参考になりましたら「きろくぶろぐ」さんのページにて、ボタンをお願いします。
「きろくぶろぐ」さんの研究の成果に感謝！！

[☆歓迎☆]
コメント・トラックバック大歓迎！
転載をご希望の方は右下のを押してください。

[-]

なるほどー。よくわかりました。すばらしいブログですね！！ところで、 [[attached(1)これは花畑の画像です]]とかでは 説明文は出来ないのかしら？この方が簡単なのになぁ。

しょうママさん、attachedだと、説明文は難しいようです。私の知る限りでは入れられそうにありません。いろいろと用途に応じて使い分けて見てくださいね。

わかりやすいです！ アリガトウございます。

上手く伝わったようでしたら、良かったです。いろいろ試してみて下さいね。こちらこそ、有り難うございました。

[ばんぞ]

はじめまして〜。早速画像アップしました＾＾どうもありがとうです！それとお気にに入れさせて貰います〜

[zer*2*14]

こんにちは。できましたぁ！でも、まだまだこちらのブログで勉強しないとダメみたいです。がんばります。

[-]

ありがとうございます。参考になりました。これをHTMLではできないんですね・・

[tin**ako4*25]

いつも参考にしてるのでとても助かってます！！ ところで、画像の大きさを変えて且つ、文字の回り込みうするにはどうしたらよいのでしょうか…？

[kitamama]

すっごくよく分かりました。有り難うございました。お気に入りにも登録させてください。

転記させていただきました。あとでじっくりよみます

転載させていただきました。ありがとうございます

[gurunny]

おかげさまで何とか絵文字までたどりつきました。ありがとうございましたぁ

やっとたどり着きました！！ホントに参考になります！ありがとうございました！

[けん]

転載させて頂きます。傑作ポチッ！

[けん]

転載させて頂きます。傑作ポチッ！

はじめまして！ 超ブログ初心者です。
わからないことだらけで四苦八苦なので、大変助かります。
ありがとうございます。 今後とも宜しくお願いします。

こんにちは、画像アップできず、困っていました。
転載させてくださいね。
宜しくお願いいたします。

[honobono]

初心者の私にとてもためになる記事です。
参考になりました。傑作ポチっ

助かりました。ありがとうございます。
ﾌｧﾝﾎﾟﾁさせて頂きます!!

はじめまして。参考にさせていただきました。
ありがとうございます。