facebookのCommentをPukiWikiに追加


投稿日:2011年9月18日
  • 2
  • 0



追加したかったけど、できないw

いいねボタンのようにJavaScriptで現在のページを取得する方法で別々のページごとにコメントできるようにしようとテストするがどうしてもできない。

具体的には下記のように変更した。

echo <<<fbroot
</br>
<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/ja_JP/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<script type="text/javascript">
var url = document.URL;
document.write('<div class="fb-comments" data-href="'+encodeURIComponent(url)+'" data-num-posts="2" data-width="250"></div>');
</script>
fbroot;

いいねボタンでは「+encodeURIComponent(url)+」でURLを取得できたが、コメント欄の追加の場合はトップページのみ表示されるが、個別のページでは表示されない…。
source」「escape()」「encodeURI()」などをつかったり、「location.href」を入れてみたり試行錯誤するも頓挫。

しょうがないからphpで書き換えてみる。

http://$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']

を使って、urlを取得。ソースを見ると…。ちゃんと出来てる…w
調べるとエラーが出てる。

Uncaught URIError: URI malformed

調べると上記エラーが出た。どうやらEUC-JPでエンコードされたURLに対応してないようだ。
試しにエンコードされたURLをはじめから直打ちしてテストすると同じように動作しない。ということは…解決法ないじゃんw

解決法をご存知のかた教えてw

解決しました。かなり豪快な解決法ですがw


現在のページを共有する



現在のページに関連する記事

公式TweetボタンでURLが化ける 公式TweetボタンでURLが化ける
「つぶやき」に「via」を付けよう 「つぶやき」に「via」を付けよう
facebookのCommentをPukiWikiに追加 5段階評価を付けることができるjQuery Ratyプラグインの使い方
facebookのCommentをPukiWikiに追加 WordPressのショートコードを利用してSNSのVertical Balloonを設置する方法
facebookのCommentをPukiWikiに追加 「最新版」WordPressに各種ソーシャルメディアボタンを追加する方法
facebookのCommentをPukiWikiに追加 もう覚えなくても大丈夫!?WordPressの条件分岐タグの使い方まとめ
PukiwikiでGoogle Analyticsを使う PukiwikiでGoogle Analyticsを使う

おすすめの記事

使うであろう文字だけの、HTML・XHTMLエンティティシート

使うであろう文字だけの、HTML・XHTMLエンティティシート

lazysizesの使い方を通して学ぶ、画像の遅延読み込みとレスポンシブイメージの基本

lazysizesの使い方を通して学ぶ、画像の遅延読み込みとレスポン…

コピペから脱出!iptablesの仕組みを理解して環境に合わせた設定をしよう

コピペから脱出!iptablesの仕組みを理解して環境に合わせた設…

作業効率を飛躍的に向上させる!実務で使うIllustratorのショートカット一覧

作業効率を飛躍的に向上させる!実務で使うIllustratorのショー…

Windows 10でpsd形式のファイルをサムネイル表示する方法

Windows 10でpsd形式のファイルをサムネイル表示する方法

プロ根性のあるデザイナーやブロガーにお勧めする4つの画像編集ソフト

プロ根性のあるデザイナーやブロガーにお勧めする4つの画像編集…

エンティティとデコード用プラグイン「Entity Decode Button」を作成しました

エンティティとデコード用プラグイン「Entity Decode Button」…

開発の最前線でクリエイター・エンジニアに必要なプログラミング言語

開発の最前線でクリエイター・エンジニアに必要なプログラミン…


コメントを残す

コメントは認証制のため、すぐには反映されません。

プログラミングに関する質問は「日本語でプログラミングの悩みを解決するQ&Aサイト sukegra」をご利用ください。