web-dev-qa-db-ja.com

ダイナミックURLのFacebook共有ボタン

URLを書き換えた動的ページがあります。その中にFacebookの共有ボタンを追加したいです。ユーザーが共有ボタンをクリックすると、ページを共有できます。しかし、facebook共有開発者ページは特定のURLを要求しています。動的に生成されたURLを共有する方法がわからない。

ここで、URLをキャプチャするコードを見つけました。しかし、Facebookのコードにこれを含める方法は知りません。

jQuery(document).ready(function() {
    var href = jQuery(location).attr('href');
    var url = jQuery(this).attr('title');
    jQuery('#current_title').html(href);
    jQuery('#current_url').html(url);
});

Facebook共有ボタンのHTML部分

<div class="fb-share-button" data-href="http://developers.facebook.com/docs/plugins/" data-type="button"></div>

親切に助けて

どうもありがとう

18
Gops

これは私のために働いた:

<script language="javascript">
    function fbshareCurrentPage()
    {window.open("https://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(window.location.href)+"&t="+document.title, '', 
    'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
    return false; }
</script>

次に、リンクを使用してコードを呼び出します。

<a href="javascript:fbshareCurrentPage()" target="_blank" alt="Share on Facebook">Facebook</a>

ウィンドウで開くのではなく直接リンクにする場合は、関数でこれを使用します。

window.location.href="https://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(window.location.href)+"&t="+document.title;


可能なjqueryソリューション:

<a class="fbsharelink" data-shareurl="YOURLINK">Facebook</a>

$('.fbsharelink').click( function() 
{
    var shareurl = $(this).data('shareurl');
    window.open('https://www.facebook.com/sharer/sharer.php?u='+escape(shareurl)+'&t='+document.title, '', 
    'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
    return false;
});
25
wentz

「既存のリンクを削除する( https://developers.facebook.com/docs/plugins/ )」というURLには何も入力せず、通常どおりにページにコードを含めます。

「いいね」ボタンまたは「共有」ボタンは、現在のページのリンクを取得します

10
Ankush Dhiman

これを使用して、FacebookのAPIでページを再解析します

  FB.XFBML.parse();
5
Adam Greene

を使用してURLを取得できます

var href = window.location

を使用してページタイトルを取得できます

var title = document.title

これらの単純なタスクにjQueryを使用する必要はありません。

FB共有ボタンを動的にするには、そのデータ属性をリロードするか編集して、現在の値に一致させる必要があります。また、GB共有ボタンのドキュメントを簡単に確認した後、タイトルをHREFのみに設定するオプションはありません。ドキュメントは こちら にあります。

たとえば、URLを変更した後、次のコードも実行します。

jQuery(document).on('ready', function($){
    var url = window.location;  
    $('.fb-share-button').attr('data-href', url);
});
3
user916411

最も簡単な解決策はこれだと思います。そして、最も複雑なURLで機能します。これがあなたのURLだとしましょう

http://dramatainment.com/videos.php?v=000014

これは、Facebookの共有ボタンコードを変更する方法です。

<div class="fb-share-button" data-href="http://dramatainment.com/videos.php?v=<?php echo $v; ?>" data-layout="button" data-mobile-iframe="true"><a class="fb-xfbml-parse-ignore" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fdramatainment.com%2Fvideos.php&amp;src=sdkpreparse">Share</a></div>

このような動的URLを追加しました

data-href="http://dramatainment.com/videos.php?v=<?php echo $v; ?>"
1
Engr Atiq