「はてなブログ」における記事内でのリンクの貼り方のまとめ

どうも、たつとら(@tatsutora6) です。

webページを閲覧しているとよくリンク（クリックすると他のページなどにジャンプする機能）を見かける事も多いと思います。

また、ブログの記事内でもよくリンクが貼ってある事があります。

もちろんボクが利用している「はてなブログ」でもリンクが貼られているのを見たり、自分でもよく貼っています。

今回はその「はてなブログ」における幾つかの用途別のリンクの貼り方について説明しようと思います。

過去記事のリンク

自分の過去の記事を紹介する場合や、過去の記事に詳しく載っていて、そちらの記事を見てもらいたい場合に記事内に過去記事のリンクを貼る場合があります。

「はてなブログ」で過去記事を貼る場合は、記事の編集画面で赤丸の部分をクリックします。

すると「リンクを挿入」の画面が出てくるので、こちらのURLの部分に貼りたいページのURLを記入し「プレビューボタン」をクリックします。

「埋め込み」「タイトル」「URL」の3種類の挿入方法が出てくるので、自分が挿入したい方法で貼り付けます。

一番目立つのは「埋め込み」ですが、「埋め込み」は1つでも目立つので複数貼りたい場合やほんの紹介程度であれば「タイトル」や「URL」の方がいいかもしれません。

その他にも過去記事を貼り付ける方法はあります。

編集画面の右側にある編集の「+（追加）」ボタンをクリックして「編集サイドバー」にある「過去記事貼り付け」の項目を追加します。

追加後、「過去記事貼り付け」のアイコンをクリックすれば今まで投稿してきた過去記事が一覧として表示されるので、貼り付けたい場所に貼り付けたい記事をクリックしたら貼り付けられます。

また、キーワードでも検索できるので結構前に書いた記事でも検索したら出てくるし、一々URLを調べなくていいので最初に紹介した「リンクを挿入」よりも便利かもしれません。

ただ、「埋め込み」しかできないので記事タイトルやURLを貼り付けたい人は「リンクを挿入」で貼り付けましょう。

外部記事のリンク

外部の記事、自分のブログ記事以外の他のサイトのページやブログなどを載せたい時も、先ほどの過去記事と同じように、載せたい記事のURLを「リンクを挿入」画面に記入すれば貼ることができます。

ただ記事によっては、埋め込みなどが表示されない場合やタイトルも表示されない場合もあります。

スポンサーリンク

アンカーポイントリンク

アンカーポイントリンクは聞き慣れない人もいるかもしれないですが、リンクには他の記事にジャンプする以外にも同じ記事内のアンカーポイント（特定した場所）に移動するリンクがあります。

例えば、下の「腕時計」の文字のリンク先を同じ記事内の腕時計の画像に設定します。

腕時計

まず貼り付けた画像を「HTML編集」で確認します。

画像のコードは下記になりますが、このコードの<p>の部分を<p id=”アンカーポイント名”>に変更します。

<p><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20210401/20210401220922.jpg" alt="腕時計の画像" title="" class="hatena-fotolife" itemprop="image" /></p></div>

このアンカーポイント名のところは自分の入れたい文字（できれば分かりやすい文字）を入れましょう。

今回は下記のように（p id=”watch”）します。

<p id="watch"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20210401/20210401220922.jpg" alt="腕時計の画像" title="" class="hatena-fotolife" itemprop="image" /></p></div>

そしてリンクさせたい先ほどの文字「腕時計」を文字になぞってクリックして、過去記事の挿入の時みたいにリンクをクリックします。

ここにURLを書き込みますが、下記のように先ほど付けた「アンカーポイント名」の前に#を付けて書き込みます。

するとコード名は下記のようになりますが、

<p><a href="http://#watch">腕時計</a></p>

このままでは、ジャンプできないのでコードから「https://」の部分を削除します。

そうすれば、上のリンクの文字をクリックすれば、画像までジャンプします。

まとめ

以上、「はてなブログ」におけるリンクの貼り方を紹介しました。

リンク挿入は結構ブログでも使われているので、知っている人も多いかと思いますが、最近始めた人などは知らない人も多いので記事にしてみました。

やはり読者にとっては、リンクに詳しい情報やもっと知りたい情報があるとクリックしたくなるし、ブログの運営側もいろいろとブログ内を見てもらえたり、アクセス数のアップにも繋がります。

アフィリエイトを利用している人もリンクは必要になってくるので、是非リンクは活用しましょう。

▼「はてなブログ」についての人気記事はこちら

「はてなブログ」有料版にするなら