TOP> 記事一覧> JavascriptでFacebookに投稿する
ゲームの記録をFacebookに投稿する事ができるようになりました!
色々と厄介だったので、似たような事をやりたい人のために実装方法を残しておきます。
2017/7/19以降この方法だけでは動的に変えられなくなりました。
以下の記事にて本記事の実装を前提とした対応方法を解説しております。
こんな感じでフィード投稿できます。厳密にはページのタイトルを上書きするような仕様となります。
シェアや集客狙いならユーザーの入力欄はコメント欄扱いとしても良いのかなとは思います。
※情報は2017/04/05時点での物となります。FacebookのAPIはすぐ仕様が変わるのでご了承のほどよろしくお願いいたします。
※文中の【】内は各々の情報に適宜書き替えて下さい。
ココで作成出来ます。
作成自体は必要情報を入力していくだけなので説明は省きます(メールアドレスなど)
Facebookアプリ上で動作しなくてもアプリIDが必要なので必須です
なお、Facebookアプリ自体を公開しないと投稿機能は管理者などしか確認できません。
→厳密には別タブで開いたタブがFB側のエラーページに飛びます。
投稿時の各種情報をページ側に設定します。
head内に以下のコードを追加します。
title内にあるサイト名については、前述の通り上書きされます。
何らかの理由で上書きしない場合はページのタイトルを入れておくのが望ましいです。
表示するhtmlファイルのbodyタグの開始直後にsdkを読み込むコードを挿入します。
以下のコードをそのままで良いかとは思います。
上記コード17行目は「ja_JP」に修正済みですが、
Facebook開発者向けページでのコードはen_USとなっています。
日本語でシェアする場合はja_JPで良いと思います。
一応ココに使える言語の一覧が乗ってます
やっとjavascriptを触ります。
以下のメソッドをhtmlなりjsなりに記載します
当サイトではよく使うメソッドをまとめたjsを読み込んでるので、
そこに記載してる感じになります。
function openFacebook(text,shareurl) { FB.init({ appId : '【紐付けるアプリID】', status : true, xfbml : true, version : 'v2.8' }); //Feed Dialogによる投稿 FB.ui({ method: 'feed', link: '' + shareurl, title: '' + text, }, function(res){ //返答をログに出力 console.log(res); }); }
なお、title:をdescription:にすれば上書き先を概要欄の方に変更可能です。
→概要欄は文字が灰色なので主張がイマイチに思えますが、、、
以下のように引数を指定して呼び出せばOKです。
openFacebook("【タイトル部に表示するテキスト】","【ページのURL】");
上記「うなかぞえ」のフィード投稿の場合は最終的なスコアをscoreとして、 以下のようなコードで呼び出しています。
openFacebook("うな重を"+score+"人前かぞえたよ!|うなかぞえ","https://santmove.com/games/play.php?gid=8");
こんな感じでゲームや診断など、動的に内容が変わるフィード投稿が出来るようになります!
2017/7/19以降この方法だけでは動的に変えられなくなりました。
以下の記事にて本記事の実装を前提とした対応方法を解説しております。
クイックスタート: JavaScript用Facebook SDK
各ページにFacebookの「いいね!」ボタンを用意しました。
「TOPページ」「ゲーム一覧ページ」「記事ページ毎」にいいねボタンが用意されてます!
いいね!ボタンはココからあっさり作れます。
が、Twitterなどのボタンと並べると縦にズレることがあります。
spanタグにvertical-align:bottomが設定されているからのようです。
以下のサイト様が非常にわかりやすく解説してくださっております。(修正方法も書いてあります)
【CSS】Facebookの「いいねボタン」の位置がズレる時の対処法
リップルコインの値動きが最近半端じゃないのでビクビクしながらXRP/YENのチャートを見てます。
このニュースが出てからのようですね。
0.6円くらいだったのが一時8円になって、今は3~5円前後をうろちょろのようです。
億万長者になった人が本当にいるのではないかと思いますが、あまりにも怖すぎるので、
素人のsantmove.は余剰資金で現物取引を楽しむのが一番かと思ってます(笑)
感想・リクエストなどは公式Twitterアカウント(@santmove_com)まで是非ご連絡よろしくお願いいたします!
また、ゲームの感想なども励みとなりますのでよろしくお願いいたします!
ではまた!
santmove.
当サイトはブラウザで遊べるゲームサイトです。
最新のゲームです!春夏秋冬のパネルを1列に揃えて連鎖を狙おう!
ペンギンだって暖を取りたい!氷を避けて登って、アツアツ料理を食べよう!
よかったら遊んでいって頂けると幸いです!面白かったら是非シェアしてください!
また以下のリンクよりお買い物頂けるとサイト運営の助けとなりますので、もしよろしければ是非よろしくお願いいたします!
楽天市場
amazon
この記事にはまだコメントがありません。
はじめてコメントしてみませんか?
ログインするとコメント出来ます!
ログイン
無料アカウント作成