アメブロのサイドバーに画像を掲載する方法

サイドバーに画像を掲載する方法。

サイドバーに画像を掲載するには、予めサイドバーの「使用する機能」に【フリースペース】を入れておく必要があります。

サイドバーのコンテンツ変更方法はこちら

自分の作成した画像を掲載する場合は、事前に画像をアップロードしておく必要があります。

画像のアップロード方法はこちら

サイドバーに画像を掲載する手順

1. マイページにログインしたら、緑タブメニューの【ブログを書く】をクリックし、記事投稿画面を開く。
2. 緑タブメニュー【プロフィール】の下辺りにある「サイドバーの設定」をクリック。
3. サイドバーの基本設定画面が表示されるので、フリースペース横の【編集】をクリック。(もしくは画面上部メニューにある【フリースペースの編集】をクリック。)
4. フリースペースの編集画面が表示されるので、記入欄にimgタグ注1を記入して画像を指定する。
   画像アドレスを知る方法はこちら
5. 右側のプレビューに画像が表示されたら下部にある【保存】をクリック。
6. これでフリースペースの位置に画像が表示されます。

• 【注1】imgタグは以下の形で記入します。
  <img src="" width="" height="" alt="" />

imgタグの説明

【src】

画像のアドレスを記入します。
src="ここに画像のアドレスを記述"
画像アドレスを知る方法はこちら

【width】

画像の横のサイズ
width="ここに画像の横サイズを記述"
【例】width="200"

【height】

画像の縦のサイズ
height="ここに画像の縦サイズを記述"
【例】height="200"

上記をまとめると以下のようになります。

<img src="画像のアドレス" width="画像の横サイズ" height="画像の縦サイズ" />

これをフリースペース記入欄に記述すると画像が表示されます。

フリースペースの画像にリンクを張る場合

フリースペースの画像にリンクを張る場合は、フリースペース記入欄上部にリンク先アドレス(http://)を記入し、【URL】をクリックします。

【URL】をクリックすると「<a href="記入したアドレス" target="_blank"></a>」が記入欄に表示されるので、「<a></a>」の間にimgタグを記入します。

<a><img /></a>

このように記述すると、画像をクリックした時に指定ページが表示されるようになります。