リンクの挿入とコンテンツの埋め込み

はてなブログでは、記事編集画面でURLを指定するだけで、Webページや画像、動画などさまざまなコンテンツを適した形式で貼り付ける リンク挿入機能 が利用できます。

「リンクを挿入」ウィンドウ

貼り付ける形式は、次のように 「リンクを挿入」ウィンドウ で指定します。

  1. 記事編集画面にURLをコピー＆ペーストすると「リンクを挿入」ウィンドウが開きます
  2. URLの種類によって「埋め込み」「画像」「タイトル」「URL」など、貼り付ける形式がいくつかプレビューできます（下記表参照）
  3. 貼り付けたい形式をクリックして選択します
  4. ウィンドウ下の「選択した形式でリンクを挿入」をクリックします
  5. 選択した形式で記事編集画面に挿入されます。
見たままモードではプレビュー通りに、それ以外の編集モードでは対応したオプションの「はてな記法」で貼り付けられます。

プレビューで選択できるリンクの形式

「リンクを挿入」ウィンドウでプレビューできるリンクの形式は、以下の通りです。実際に表示される形式は、ペーストしたURLの種類によって異なります。

形式 説明 はてな記法
URL URLをそのまま挿入します。 オプションなし
タイトル ページのタイトルを自動取得し、テキストリンクとして挿入します。 :title
選択範囲 記事編集画面のテキストを選択してURLをペーストすると、選択範囲にリンクを挿入できます。 :title=text
画像 画像そのもののURLをペーストした場合、画像（img要素）として貼り付けることができます。 :image
埋め込み 動画や音楽などのコンテンツを、サイトごとに最適化された形式で埋め込みます。一般的なWebページを貼り付けた場合は、ブログカードが利用できます。 :embed

入力補助ツールバーから「リンクを挿入」ウィンドウを開く

「リンクを挿入」ウィンドウは、編集画面の入力補助ツールバーにある リンクボタンをクリックしても、開くことができます。

貼り付けたいWebページを URL 欄に入力して プレビュー をクリックしてください。

「リンクを挿入」ウィンドウを自動で開かないようにする

URLをペーストするだけで「リンクを挿入」ウィンドウが開くのを止めたいときには、ウィンドウ内の「URLを貼り付けたときにこのウィンドウを開く」というチェックを外してください。次回から、URLを貼り付けても「リンクを挿入」ウィンドウを表示しなくなります。

いったん非表示にした後で、リンク挿入機能を利用したいときには、上記のように入力補助ツールバーの「リンク」ボタンから「リンクを挿入」ウィンドウを表示してください。この際、上記のチェックを入れ直すと、また自動で表示できます。

リンクを新しいタブで開く

「リンクを新しいタブで開く」のチェックボックスをオンにした状態で「選択した形式でリンクを挿入」ボタンを押すと、リンクのtarget属性に_blankが指定され、リンクが新しいタブで開くようになります。

補足情報
  • 編集モードについて
    • 「見たままモード」と「HTMLモード（有料プラン限定機能）」にて利用可能です
    • 「はてな記法モード」と「Markdownモード」では利用できません
  • リンクの形式について
    • 「タイトル」「URL」「選択範囲」「画像」にて利用可能です
    • 「埋め込み」はこれまでも新しいタブで開く仕様だったため、チェックボックスをオンにする必要はございません

はてな記法でコンテンツを貼り付ける

「リンクを挿入」ウィンドウを利用しないで、はてな記法を編集画面に直接記入してコンテンツやWebページを貼り付け・埋め込むこともできます。上記の表の右端に示したオプションを、http記法の最後に追加します。 例えば、次のように:embedオプションを指定すると、 
[https://www.youtube.com/watch?v=eOVq9pxjr6s:embed]
次のようにサイトに適した「埋め込み」形式でコンテンツを貼り付けることができます。 同様にそのほかのオプションで「タイトル」などの形式を指定したリンクを記述できます。
動画や画像、音楽などさまざまなコンテンツを「埋め込み」形式で貼り付けることができるのは、それぞれのサイトがoEmbedという仕様に対応しているためです。はてなブログでは、独自に対応したいくつかのサイトに加えて、oEmbedに対応したすべてのサイトを埋め込むことができます。

関連項目

関連記事（はてなブログ開発ブログ）