Amebaブログのサイドバーに画像リンクを表示する

これもパソコン相談所のお客様から実際にご質問をいただいた内容。「ブックマーク」のように文字でリストアップはできるけれど、バナー画像のようなものを表示して、クリックするとリンク先へ飛ぶようにするには、どうすればイイの？というご相談。

やりたいことは右図のような事。

サイドバーに画像を表示させて、この画像をクリックすると、指定したリンク先へ移動できるようにする、というのが目標です。この設定は、すべてAmebaブログの管理画面上で行うことが出来ます。

以下、Amebaブログの管理画面での作業方法の説明です。

まずは、管理画面へ入ります。

「ブログ」→「サイドバーの設定」 →「プラグインの追加」と進みます。

「フリープラグイン」を選んで、 ソースコードを記述します。（右図参照）

記述したら、「追加」ボタンをクリックすると、右図のように画面が切り替わります。（サイドバーの配置を設定する画面です）

画面左側「使用しない機能」の部分に「フリープラグイン」という項目が表示されているはずですので、 これをドラッグ＆ドロップして右側の「使用する機能」の部分へ移動します。最後に「保存」をクリックして、これで完了。

なお、フリープラグインは、いくらでもHTMLソースコードが記述できるので、画像ひとつだけでなく、複数の画像を用意して、それぞれ別のサイトへリンクさせる、というようなことも出来ます。Amebloの場合、ここを大いに利用して、サイドバーをかなり自由にカスタマイズする事ができそうですね。