2016.4.13

Facebookが文章を簡単にシェアできる機能を提供開始

quote_041316_022209_PM

Facebookの年次開発者会議「F8」でブログなどのサイトに追加できる「引用シェア(Quote Share)」の機能を発表しました。「Quote Plugin」として提供が開始されています。

文章や言葉を引用してのシェアを簡単に

ブログなどを見ていて何か印象的な言葉をシェアしたいなぁっと思った時、従来であれば自分でコピペする必要がありましたが、この機能を使うとテキストを選択するとポップアップメニューが現れ、そこから簡単に投稿ができるようになります。

このブログでも実装してあるので試せますが、動作の様子は下記のような感じです。ちなみに、モバイルでは動作しません。

テキストを選択するとポップアップが出てきます

テキストを選択するとポップアップが出てきます

シェアの画面では自分のコメントとは別に引用した文章が表示されます。

シェアの画面では自分のコメントとは別に引用した文章が表示されます。

タイムライン上でも自分のコメントとは区別して表示されます。

タイムライン上でも自分のコメントとは区別して表示されます。

こういうのってモバイルでも手軽にできるようになるといいのだけど、これから対応するのかな?

Mediumでは実装済みの機能

この選択した箇所をシェアするという機能、最近話題になっているMediumでは実装済みです。

スクリーンショット_041316_014720_PM

もとがTwitterから派生したというだけあって、シェアできるのはTwitterだけですが、選択してハイライトさせた個所にコメントを書けたりと機能は豊富です。facebookもこの方向に進むのかな?

WordPressでの実装方法

WordPressにこの機能を追加するのは簡単です。前提としてOpen Graphが設定してある必要がありますが、これは最近は大抵のサイトで設定済みだと思うので問題ないでしょう。

スクリプトを追加

下記のスクリプトを<body>直後、あるいは</body>直前に追加します。


<div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

すでに「いいね」ボタンなどを使っていて、facebookのスクリプトを設定済みの場合は、そのスクリプトに

&version=v2.6";

だけ追加すれば大丈夫なはずです。

あとは、</body>直前に下記のタグを追加します。

 <div class="fb-quote"></div>

これだけで設定は完了です。

同様の機能を追加するWordpress プラグインもある

Facebook純正のものはもちろんFacebookにしかシェアできませんが、同様の機能でFacebookだけでなくTwitterやGoogle+などにもシェアできるようにしたWordpressプラグインも存在します。ただ、私が試した範囲ではFacebookへちゃんとシェアできるものが見つけられませんでした。Twitterへはどれもうまくゆくんですけどね。

せっかくなので、幾つかのプラグインのリンクだけ貼っておきます。

Quoty

Selection Sharer by Hans van Gent

Inbound Rocket by Inbound Rocket

How to Add Medium-Like Select and Tweet to WordPress (Plus Free Plugin!)

タグ: , ,

back to top