ライブドアブログにて画像アップロードについて

ライブドアブログを最近始めました。
全くの素人で、記事を書いたり単純に画像をアップロードすることは可能です。
今回、アドバイス頂きたいことですが、一つの記事に画像を複数アップロードしたいのですが、記事に全ての画像が表示されてしまいます。
そこで、1枚目のみ記事に表示されて、その画像や記事タイトルをクリックする事で全ての画像が見れるような感じにしたいのですが全くの分からず困っています。
ヘルプで記事に見出し画像を表示するというものを読みましたがイマイチ分からず、設定しても全ての画像が表示されてしまいます。
専門用語が分からず、質問内容も分かりにくいかとは思いますが、ホームページ作成などに詳しい方いらっしゃいましたらご教授ください。
よろしくお願い致します。

質問者からの補足コメント

• ありがとうございます。
  全くの初心者なので、HTMLは使用せずにライブドアブログの機能のみを使用しています。
  説明の内容に関しては大丈夫です。

  No.1の回答に寄せられた補足コメントです。 補足日時：2016/11/23 14:44

• ありがとうございます。
  わかりやすく例も記載して頂きありがとうございます。
  これは全て手入力する必要があるのでしょうか？
  それとも、HTML作成ソフトやサイトで作成することは可能でしょうか？

  No.2の回答に寄せられた補足コメントです。 補足日時：2016/11/23 15:08

• 丁寧にありがとうございます。
  画像はどこに保存すればいいのでしょうか？
  普通にアップロードすればいいのでしょうか？

  No.3の回答に寄せられた補足コメントです。 補足日時：2016/11/23 16:46

No.1 ベストアンサー 回答者： t_fumiaki 回答日時： 2016/11/23 14:38

記事をhtmlで書けば出来ます。

画像はimgタグで表示させますし、文の改行は<br />で行いますが、
今そうなっているのなら簡単です。

そうなっていないなら、先ずはimgタグで画像表示をして、改行は<br />を使って下さい。

ここまでokなら、補足頂ければ続きを回答します。

No.4 回答者： t_fumiaki 回答日時： 2016/11/23 16:58

>>普通にアップロードすればいいのでしょうか？

普通にアップロードして記事内には、これも普通通りに、投稿画面の上の左端の画像挿入アイコンをクリックして画像を選択して記事内に入れてください。

画像のimgタグが全部記事内に入るので、そのタグをそのまま使います。
下の様にフルパスになっているので、そのまま使います。

<img src="http://livedoor.blogimg.jp/△△△/imgs/5/5/5551d661.gif" width="180" height="75" border="0" alt="○○○" hspace="5" class="pict" />

この回答へのお礼

ありがとうございます。
頑張って試してみます！

お礼日時：2016/11/23 22:23

No.3 回答者： t_fumiaki 回答日時： 2016/11/23 15:49

>>これは全て手入力する必要があるのでしょうか？

ブログなんですから、記事投稿画面に手入力します。
投稿画面で入力する前に「htmlタグ編集」ボタンを押してhtmlモードにしてから書きます。

画像が無い記事なら、htmlといっても改行の扱いダケなので、手入力で十分です。

こんにちは。
さようなら。
ではまた・・・。

と表示させたいなら

こんにちは。<br />
さようなら。<br />
ではまた・・・。<br />

と言う様に、改行させたい位置に<br />を入れるだけです。


こんにちは。の下に先の画像を入れるなら以下です。
<script>～</script>はどこでに有っても良いので最後に入れます。


こんにちは。<br />
<a href="#" onclick="hyoji1(0)"><img src="1.gif" /><br />
<br />
<div id="disp" style="display:none;">
<img src="2.gif" /><br />
<br />
<img src="3.gif" /><br />
<br />
<img src="4.gif" /><br />
<br />
</div>
さようなら。<br />
ではまた・・・。<br />
<script>
function hyoji1(num)
{
if (num == 0)
{
document.getElementById("disp").style.display="block";
}
else
{
document.getElementById("disp").style.display="none";
}
}
</script>

No.2 回答者： t_fumiaki 回答日時： 2016/11/23 14:55

No.1続き

htmlで大丈夫だと言う前提で書きます。
例として、画像は４枚、ファイル名は1.gif 2.gif 3.gif 4.gif として説明します。
画像は縦に並べています。
初期表示は１番上の画像だけが表示。
その画像をクリックすると、下に残り３枚が表示される例です。



<a href="#" onclick="hyoji1(0)"><img src="1.gif" /><br />
<br />
<div id="disp" style="display:none;">
<img src="2.gif" /><br />
<br />
<img src="3.gif" /><br />
<br />
<img src="4.gif" /><br />
<br />
</div>

<script>
function hyoji1(num)
{
if (num == 0)
{
document.getElementById("disp").style.display="block";
}
else
{
document.getElementById("disp").style.display="none";
}
}
</script>