はてなブログ開発ブログ

はてなブログからの公式のお知らせを発信します。

ブログに写真や動画を貼り付ける「リンク挿入」機能を使いやすくしました URLをペーストするだけでコンテンツを埋め込めます

はてなブログでは、写真や動画、音楽などさまざまなコンテンツを貼り付けできる リンク挿入 機能を、より簡単に使えるようにしました。編集画面にURLをペーストするだけで「リンクを挿入」ウィンドウが開き、いろいろなコンテンツを埋め込むことができます。

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

「リンクを挿入」ウィンドウでSoundCloudから音楽を埋め込む

「リンクを挿入」ウィンドウでは、クリップボードから貼り付けたURLの種類によって、次のようなフォーマットでコンテンツをプレビューできます。

  • 普通のWebページ …… タイトルを取得します
  • 写真やイラストなどへの直リンク …… 画像として展開します
  • 動画や音楽などリッチコンテンツを提供するサイト…… 各サイトの埋め込み形式を取得します(YouTube、SoundCloud、SlideShare、Twitterなど)

プレビューから貼り付けたいフォーマットを選択して、「選択した形式でリンクを挿入」をクリックしてください。この機能を利用しないときは、「キャンセル」をクリックするとペーストしたURLをそのまま貼り付けます。

よりリッチなフォーマットでコンテンツを紹介することで、ブログがより見栄えよく、読みやくなります。どうぞご利用ください。

写真や動画、音楽などを埋め込める機能について

「リンクを挿入」ウィンドウは、コンテンツを簡単に埋め込める機能として、2013年10月から提供しています*1。リンク挿入機能の仕組みと詳細は次の記事を参照してください。

YouTube、Twitter、Instagram、ニコニコ動画、SoundCloud、pixivなど、さまざまなサイトを手軽に貼り付けられるリンク挿入機能を強化しました

今回の改善により、入力補助ツールバーを利用しなくても、URLをペーストするだけでこの機能を利用できます。これまで同様に編集したい場合には、ウィンドウ内の「URLを貼り付けたときにこのウィンドウを開く」というチェックを外してください。次回から、URLを貼り付けても「リンクを挿入」ウィンドウを表示しなくなります。

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

いろいろなサイトを埋め込むことができます

いろいろなサイトのURLを「リンクを挿入」ウィンドウに貼り付けたときの例を以下に示します。

Flickr の写真を貼り付ける

Flickr

Twitter のツイートを貼り付ける

Twitter

YouTube の動画を貼り付ける

YouTube

このほかにも SlideShare や上記の SoundCloud のほか、リンク挿入では oEmbed をサポートしたサイトなどを埋め込むことができます。対応しているサイトはたくさんありますので、ぜひいろいろと試してみてください。

*1:動画や音楽の埋め込み自体は、はてな記法のembedオプションとしてそれ以前からサポートしています。「リンクを挿入」ウィンドウは、これをテキストエリア上部の入力補助ツールバーにある「リンク」ボタンから簡単に利用できるようにしたものです。