アメブロのサイドバーにバナーを設置する方法 | ちょっとした「Webお役立ち情報」とかを主に書いてます。

ちょっとした「Webお役立ち情報」とかを主に書いてます。

ネットで調べて、「わかったこと」を備忘録の代わりのメモ帳のようにして使ってます。

サイドバーに画像リンクを貼り付けるには



すぐに忘れる脳みそのためにメモしておきたいと思います。ワンタンですww

こんな感じでサイドバーに画像リンク(バナー)を設置する方法です(↓)。

0.1

1.アメブロの画像フォルダーに画像をアップ

アメブロの画像フォルダーにバナーにしたい画像をアップして、「画像の設定」で「オリジナルで表示」にマークを付けて、「この画像を使う」をクリックして下さい。

0.2

2.HTMLタグコードに幅を指定するコードを追記


.「HTML表示」にすると、画像コードが「編集画面」に表示されますので、画像URLの後ろの「"」(ダブルコーション)のすぐ後ろに「width="300"」を記述して下さい。(※赤字の数字は、御自身のサイドバーの幅に合わせて下さい。)
注:ペイントソフト等で、画像をサイドバーの幅に合わせて縮小されてる場合は、この操作は不要です。

.緑字のアドレスを、リンク先(移動させたいページ)のアドレスに差し換えて下さい。

<a href="http://stat.ameba.jp/user_images/20150317/09/wantan-52/ce/a0/j/o0640042813247273578.jpg"target="_blank"><img src="http://stat.ameba.jp/user_images/20150317/09/wantan-52/ce/a0/j/o0640042813247273578.jpg"width="300" alt="バナー" border="0" /></a>



3.フリースペース編集に貼り付け

上で作成したコードを、フリースペース編集に貼り付けて下さい。
他のコードに割り込むような形にさえならなければ、位置は、どこでも構わないと思いますが、末尾に貼り付けたほうが無難だと思います。

0.3

※「保存」ボタンを押しても、この設定が反映されないようでしたら、キーボードの「F5」キーを押す等、キャッシュのクリアをしてみて下さい。


〇要約
アメブロの画像フォルダーに画像をアップ→画像URLの後ろの「"」(ダブルコーション)のすぐ後ろに「width="サイドバーの幅のピクセル値"」を記述、アドレスを、リンク先(移動させたいページ)のアドレスに差し換え→作成したコードを、フリースペース編集に貼り付け



〇思うこと
バナー (banner) って、ウェブページ上で他のウェブサイトを紹介する役割をもつ画像リンクのことだと思いますが、忘れたくないリンクを記憶させておくブックマークの役割も果たすのではないでしょうか^^;



☆ブィブィ  ('-^*)/


新しいステップを開発中!!