Facebook に保存するボタンをサクッと設置する

桜もすっかり散ってしまいましたね。カメラ初心者の僕は、意気揚々と EOS 70D を持って桜の撮影に出かけたのですが、全く上手く撮れず、来年こそは上手く撮りたいと思っています。

さて、Facebook が「保存ボタン」を外部に開放したよということなので、早速試してみました。既にいいね!ボタンの設置やシェアボタン、Facebook ページのプラグインなどを設置している場合は、Facebook の JavaScript SDK を導入済だと思うので、本当にサクッと終わります。どういう機能なのかは、Facebookが「保存ボタン」を外部に開放、日本では楽天とメルカリがファーストパートナーにを読んでみてください。

Facebook に保存するボタンの設置

設置方法は簡単です。いいね!ボタンと手順は同じです。

  1. アプリケーション ID の取得
  2. JavaScript SDK の設置
  3. Facebook に保存ボタン書き出し用 HTML の設置

手順はこれだけです。ほとんどの方が、JavaScript SDK の設置までは終わっているでしょう。最後の Facebook に保存ボタン書き出し用 HTML の設置については、以下の HTML をボタンを表示したい箇所に書き込んでください。

<div class="fb-save" data-uri="https://example.com" data-size="large"></div>

data-uri 属性はボタン設置ページの URL、data-size はボタンのサイズ(small or large)です。その他の詳しい説明は、保存ボタン – ソーシャルプラグイン 開発者向けドキュメンテーションを読んでみてください。ちなみに、WordPress に設置する場合は、こんな感じで大丈夫だと思います。

<?php
/**
* single.php などに記述
*/
printf( '<div class="fb-save" data-uri="%s" data-size="large"></div>', esc_url( get_the_permalink() ) );

最後に

くっくるはここ最近、はてブや Pocket とは離れていて、殆ど Fcebook の保存機能を使っていました。なので、Facebook に保存するボタンは個人的に感激しています。ただ、保存し過ぎていて、過去に保存してものを探すのが大変です。Facebook さん、早めに検索機能を付けてください(笑)

それでは、本日はここまで。

[amazonjs asin=”4822248372″ locale=”JP” title=”フェイスブック 若き天才の野望 (5億人をつなぐソーシャルネットワークはこう生まれた)”]

この記事が気に入ったら
いいね ! しよう

Twitter で

Written by くっくる

WordPressを使ったウェブサイトの構築・HTMLコーディングの受託案件を中心に埼玉県にて活動中。バイラルメディア風にFacebook pageのいいね!ボタンを設置できるVA Social Buzzをはじめ、複数のWordPressプラグインを公開している。共著書として「エンジニアのためのWordPress開発入門」がある。

View all author posts →

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください