アメブロ記事などを書いている際、特定の箇所にリンクを追加したい場合があると思いますが、先日もある方より、アメブロのリンクが上手く貼れないという相談をいただきましたので、
アメブロ記事にリンクを貼る方法や、上手く貼れない時の確認方法について紹介します。
アメブロ記事にリンクを貼る方法
すでにご存じの方も多いと思いますが、アメブロの記事にリンクを貼る方法はとても簡単です。編集画面に書いたテキストの中から、お使いのマウスで、リンクを貼りたい部分を範囲選択し、画面左上のリンクボタン（リンクの作成）をクリックすると、入力画面が表示されます。
ポップアップ画面「URL」という項目に、リンクを貼りたいアドレス（http://～）を入力し、必要に応じて、リンク先を別ウィンドウで開くのか選択し、決定ボタンをクリックするだけ。
アドレスを手作業で入力するのは面倒ですから、あらかじめ、コピーしておきましょう。
投稿画面の種類（最新版エディタやタグ編集エディタ）に関わらず、基本的な方法は同じです。より詳しいリンクの貼り方の方法についても、アメブロスタッフブログで紹介されていますし、具体的な手順が分かるよう、解説動画も掲載されているので、参考にしてみてください。
リンクが上手く貼れないケースは
一般的にアメブロ記事など、テキストにリンクが正常に貼られていると文章の色が変わります。見た目上、これが基本となりますし、実際に記事を公開し、クリックできるか確認しましょう。その際、文章の色が変わらなかったり、クリックできない時は上手く貼られていません。
いろいろな原因が考えられますが、まずは、リンクを設定したHTMLソースを確認しましょう。
アメブロの標準エディタを使用中なら、投稿画面の左下にある「HTML表示」タブをクリック。実際にリンクを設定したテキスト部分に対し、対象のHTMLソースをチェックします。
リンクが正しく貼られている場合、必ずテキストの前後が「Aタグ」によって囲まれています。Aタグとは、アンカー（Anchor）の略称で、リンクの始まりから終わりまでを指定するタグ。
そのため、リンクが上手く貼れない時は、ソースを確認すると原因が分かると思います。
<a href=”URLアドレス”>ブログの使い方（リンクなど）</a>
基本的なリンク構造はとても簡単
アメブロ記事にリンクを貼る方法として、投稿画面の専用ボタンを利用するのが一般的ですが、IE・Chromeなど、ブラウザによっては、ボタンを押しても上手く反応しない場合もあるため、あらかじめ、HTMLタグの確認方法を知っておくと、いざという時に困らないでしょう。
例えば、お客様よりいただいたご相談の中で、実際に当管理人が対応した不具合のケースだと、「Aタグ」に余計なタグが混じっていたり、ダブルクォーテーション（””）が抜けていたり…、アメブロの投稿画面では、使用が禁止の「iframe」「script」タグが含まれていたなど。
<a href=”URL”>テキスト</a>という、リンクを貼る際の基本的な構文さえ理解しておけば、具体的に間違っている箇所も確認できますし、慣れれば直接、HTMLを修正できると思います。タグの編集というと、苦手な方もいると思いますが、仕組み自体はとても簡単ですから。
基本的な構造……<a href=”URL”>テキスト</a>
別ウィンドウ……<a href=”URL” target=”_blank”>テキスト</a>
画像にリンクを貼りたい時も同じ
なお、アメブロの投稿画面でリンクを貼る際、「リンクを別ウィンドウで開く」を選択すると、基本的な「Aタグ」の中に、上記、リンクの表示先を指定する「target」属性が追加されます。主な使い分けとしては、リンク先アドレスが、他の方のブログなどの場合に使用します。
また、アメブロの場合、投稿画面に画像を挿入すると、自動的にリンクがついてしまいますが、貼り付けた画像のリンクを削除したい場合、「Aタグ」の基本的な構造を理解していると簡単。
「HTML編集タブ」をクリックし、下記のように修正すると、削除することができます。
念のため、少しご説明しますと、<P>タグは文章の段落を意味し、<img>タグは画像のこと。アメブロ記事などを書く際、よく使用するのが<P>タグで、改行を意味する<br>タグも含め、リンクを貼りたいテキストや画像の前後を、専用のタグで囲むという仕組みは同じです。
リンクなし……<p><img src=”画像URL”…></p>
リンクあり……<p><a href=”URL”><img src=”画像URL”…></a></p>
