
アメブロのサイドバーに画像リンクを付けるやり方
アメブロの機能キチンと使ってますか?
ブログサイトを眺めていると、アメブロの利用者を多く見かけます、一般の方も商売をされている方も多いですね、
他の無料ブログサービスに比べてアメブロは商売で利用されている方の割合が高い気がします、それだけのメリットがあるのでしょう、
しかし商売で利用されている方のブログの中でも以外とアメブロの機能を使えている方は少ないようで、使える機能はちゃんと利用した方が良いのになぁ・・・
と見ていて思います、
使い方が分からない人は結構いると思います
機能はついてるけど使い方が分からないって人が一定数いるようですので、簡単ではありますが、誰でも楽にサイドバーに画像リンクをつけられるやり方を紹介したいと思います。
読んだらわかる画像リンクの設置方法
文字にリンクを貼るのはアメブロのエディターの機能にあるので、簡単に出来ますよね、しかしエディターを使わないでリンクを貼る時にはhtmlタグが必要になります、けれども安心して下さい。
任意の場所にリンクをコピーするだけで、簡単に画像リンクをつけられるように、分かりやすく説明していきます。
目次
リンク用の画像を用意する
まずは画像を用意しましょう、サイズは横300px縦は結構自由ですが見栄えが良いサイズで作って下さい。
無料で画像を使えるサイトは当サイトで紹介していますので、写真素材はここ、イラスト素材はここ、ボタンなどのweb素材はコチラで探してみて下さい。
画像編集ようのソフトとその使い方はここから探して下さいが役にたつはずです。
画像をアメブロにアップロードしよう
画像の用意は出来ましたか?画像が出来たら、自分のアメブロにアップロードしましょう。
今回はこの少しオシャレな画像を使ってリンクを貼ってみます。
まずはアメブロに画像をアップロードします。
新しくブログを書くを開きます
新しく開いたら、使いたい画像をアップロードします。
アップロードをしたらエディターに貼り付けます
貼り付けられましたか?ここから少しだけ面倒になりますが、ゆっくり確実に進んで下さい、
次にエディターのタブをhtmlに切り替えます
そうすると、画面には下図のようなソースが現れます、
現れましたか?ここに載っているのが画像を表示するタグで、今回必要になるのはこのタグの中のこの選択されている部分です、これは、画像が置いてある場所へのリンクです。
<a href="から先のhttp〜画像の拡張子(この画像はjpgですが画像によっては、gif・pngなどあります)までをコピーしてメモ帳等に貼り付けておいて下さい。
次に、貼り付けるサイドバーの設定を行います、ブログ管理画面から「設定・管理」を開いて下さい
設定管理が開いたら下の段の「配置設定」を押して下さい。
配置画面は開きましたか?ここで下図のように「使用しない機能」の欄に「フリースペース」というのがあると思います。
このフリースペースを右の使用する機能へドラッグします、配置場所は任意で決めて下さい、今回は右の一番上に設定します。
配置が決まったら保存します、保存したら設定管理の画面に戻り次は「フリースペースの編集」を押します
さてここまできたら先ほどコピーしたリンクを使います、この下のタグに先ほどのアップした画像のリンクと、リンクさせたいサイトのアドレス(url)を貼り付けます
<a href="飛ばしたいサイトのアドレス"><img src="先ほどコピーした画像のアドレス"></a>
上の図のように作ったタグを貼り付けて下さい、貼り付けたらプレビューを押します
プレビューを押してこのように画像が表示されたら成功です、慣れると10分もかからずに出来ますので、試して見てください。
リンクですので、設置後にキチンとリンクが機能しているか自分でリンクを押して確認をして下さい。
あとがき
キチンと画像リンクを貼ることは出来たでしょうか?簡単なコピペだけでサイドバーに画像リンクを貼ることが出来るんですよ、htmlの知識がなくてもcssの知識がなくても以外となんとかなるものです、アメブロは少し不親切なところもありますけど、そこはアイデアでカバー出来る範囲ですので、どんどんいじって楽しみましょう。