मेरी वेबसाइट पर फेसबुक शेयर बटन कैसे जोड़ें?

Question

मेरे पास यह कोड है जो काम करने के लिए लगता है, लेकिन काम नहीं करता है। अगर यह आपको किसी भी तरह से मदद करता है तो यह बहुत अच्छा होगा।

<script src='http://connect.facebook.net/en_US/all.js'></script>
    <p><a onclick='postToFeed(); return false;'><img src="images/fb.png" /></a></p>
    <p id='msg'></p>

    <script> 
      FB.init({appId: "338334836292077", status: true, cookie: 

true});

      function postToFeed() {

        // calling the API ...
        var obj = {
          method: 'feed',
          redirect_uri:'https://www.facebook.com/cryswashington?fref=ts',
          link:'https://developers.facebook.com/docs/reference/dialogs/',
          picture: 'http://fbrell.com/f8.jpg',
          name: 'Facebook Dialogs',
          caption: 'Reference Documentation',
          description: 'Using Dialogs to interact with users.'
        };

        function callback(response) {

        document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
        }

        FB.ui(obj, callback);
      }

    </script>

मैं अपनी वेबसाइट पर facebook शेयर बटन जोड़ना चाहता हूं, जो मेरी वेबसाइट की सामग्री को दीवार पर पोस्ट करना चाहिए। जो इसे साझा करना चाहते हैं।

मैंने बहुत खोजबीन की लेकिन कुछ नहीं मिला। दलीलें इसमें मेरी मदद करती हैं।

अग्रिम में धन्यवाद।

Comments

sharelinkgenerator.com

— रॉनी

Answer 1

आपको उस कोड की आवश्यकता नहीं है। आपको केवल निम्नलिखित पंक्तियों की आवश्यकता है:

<a href="https://www.facebook.com/sharer/sharer.php?u=example.org" target="_blank">
  Share on Facebook
</a>

प्रलेखन https://developers.facebook.com/docs/reference/plugins/share-links/ पर पाया जा सकता है

Comments

वास्तव में इस विकल्प को पसंद न करें ... काश एक स्टाइल लिंक होता, तरह तरह के ट्वीट बटन

— सर्ज सगुन

फिर आप लिंक को स्टाइल क्यों नहीं करते? मैं निश्चित रूप से इस विकल्प को पसंद करता हूं। मुझे नियंत्रित करना पसंद है कि मेरे डिजाइन कैसे दिखते हैं।

— शेरिफेरेरेक

इसके अलावा, इस तरह से फेसबुक जंक कोड नहीं जोड़ा जाता है, जो आपके पृष्ठ को धीमा कर देगा। Sharrre.com jquery प्लगइन देखें, इससे लुक को कस्टमाइज़ करना और कई सामाजिक "जैसे" बटन को एक में बंडल करना आसान हो जाता है।

— पिक्सलाइन

हां, आप अभी भी साधारण शेयर लिंक का उपयोग कर सकते हैं। इसके अलावा, अपने सभी लोकप्रिय सोशल मीडिया साइटों के लिए सरल लिंक बनाने में मदद के लिए इस सरल पृष्ठ को देखें: sharelinkgenerator.com

— पिस्तौल-पीट

महत्वपूर्ण नोट: मोबाइल पर यह विचार फेसबुक वेबसाइट (एफबीबी ऐप नहीं) खोलता है। छोटा (या बड़ा) चोर।

— एज्रा सीटन

Answer 2

आप फेसबुक द्वारा प्रदान किए गए अतुल्यकालिक जावास्क्रिप्ट एसडीके का उपयोग करके ऐसा कर सकते हैं

निम्नलिखित कोड पर एक नजर है

एफबी जावास्क्रिप्ट एसडीके आरंभीकरण

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'YOUR APP ID', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

नोट: अपने एपीपी आईडी को अपने Facebook AppId से बदलना याद रखें। यदि आपके पास facebook AppId नहीं है और आप यह नहीं जानते हैं कि कृपया इसे कैसे जांचें

JQuery लाइब्रेरी जोड़ें, मैं Google लाइब्रेरी को प्राथमिकता दूंगा

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

शेयर संवाद बॉक्स जोड़ें (आप पैरामीटर सेट करके इस संवाद बॉक्स को अनुकूलित कर सकते हैं

<script type="text/javascript">
$(document).ready(function(){
$('#share_button').click(function(e){
e.preventDefault();
FB.ui(
{
method: 'feed',
name: 'This is the content of the "name" field.',
link: 'http://www.groupstudy.in/articlePost.php?id=A_111213073144',
picture: 'http://www.groupstudy.in/img/logo3.jpeg',
caption: 'Top 3 reasons why you should care about your finance',
description: "What happens when you don't take care of your finances? Just look at our country -- you spend irresponsibly, get in debt up to your eyeballs, and stress about how you're going to make ends meet. The difference is that you don't have a glut of taxpayers…",
message: ""
});
});
});
</script>

अब अंत में इमेज बटन जोड़ें

<img src = "share_button.png" id = "share_button">

अधिक विस्तृत प्रकार की जानकारी के लिए। कृपया यहाँ क्लिक करें

Comments

... इसकी तुलना ट्विटर के इनिशियलाइजेशन के समकक्ष करें। नट।

— माइकल

आपके दृष्टिकोण के लिए ऐप आईडी की आवश्यकता होती है, यह एक कठिन दर्द है।

— अश्वारोही १०'१५

यह अभी भी एक आकर्षण की तरह काम कर रहा है! उत्कृष्ट कृति!

— कोडिंग फ्रीक

अच्छा !! समझने में आसान। लेकिन हमें कैसे पता चलेगा, अगर उपयोगकर्ता ने वास्तव में हमारी सामग्री साझा की है? पुनश्च: response.error_message केवल तभी दिखाई देगा जब आपके ऐप का उपयोग करने वाले किसी व्यक्ति ने आपके ऐप को प्रमाणित किया हो

— पर्ल

Answer 3

आप फेसबुक डेवलपर्स वेबसाइट पर शेयर बटन के बारे में अधिक पढ़ सकते हैं

वर्किंग JSFIDDLE

कस्टम फेसबुक शेयर बटन JSFIDDLE पर एक नज़र डालें

उद्घाटन <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/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

और जहां भी आप फेसबुक शेयर बटन दिखाना चाहते हैं, वहां नीचे कोड रखें

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

काम कर रहे JSFIDDLE की जाँच करें

Comments

क्या यह संभव है कि यह कोड अब काम न करे?

— Jsfiddle

हाँ, यह काम करने में खुद को गंभीर परेशानी हो रही है ... मैं अभी एक रिक्त div के साथ समाप्त होता हूं।

— माइकल

@erdomester फ़िडल क्रोम या फ़ायरफ़ॉक्स में दिखाई नहीं देगा। यह ब्राउज़र सुरक्षा के कारण सैंडबॉक्स वाले iframes को रोकना है। सफारी में jsfiddle को खोलकर दिखाना चाहिए और एक बार jsfiddle के बाहर लागू करने के बाद इसे अन्य ब्राउज़रों में दिखाना चाहिए।

— JisuKim82

Answer 4

एपीआई के बिना एक छवि के साथ फेसबुक शेयर के लिए और एक उप पृष्ठ में गहरी लिंक का उपयोग करके , चाल को छवि को साझा करना था जैसा कि चर होगा#picture=

mainUrlhttp://yoururl.com/

var d1 = $('.targ .t1').text();
var d2 = $('.targ .t2').text();
var d3 = $('.targ .t3').text();
var d4 = $('.targ .t4').text();
var descript_ = d1 + ' ' + d2 + ' ' + d3 + ' ' + d4;
var descript = encodeURIComponent(descript_);

var imgUrl_ = 'path/to/mypic_'+id+'.jpg';
var imgUrl = mainUrl + encodeURIComponent(imgUrl_);

var shareLink = mainUrl + encodeURIComponent('mypage.html#' + id);

var fbShareLink = shareLink + '&picture=' + imgUrl + '&description=' + descript;
var twShareLink = 'text=' + descript + '&url=' + shareLink;

// facebook
$(".my-btn .facebook").off("tap click").on("tap click",function(){
  var fbpopup = window.open("https://www.facebook.com/sharer/sharer.php?u=" + fbShareLink, "pop", "width=600, height=400, scrollbars=no");
  return false;
});

// twitter
$(".my-btn .twitter").off("tap click").on("tap click",function(){
  var twpopup = window.open("http://twitter.com/intent/tweet?" + twShareLink , "pop", "width=600, height=400, scrollbars=no");
  return false;
});

Answer 5

फेसबुक लॉगिन की आवश्यकता के बिना डायलॉग साझा करें

आप लिंक साझा करने के लिए शेयर विधि पैरामीटर के साथ FB.ui फ़ंक्शन का उपयोग करके एक साझा संवाद ट्रिगर कर सकते हैं। यह संवाद फेसबुक एसडीके में जावास्क्रिप्ट, आईओएस और एंड्रॉइड के लिए एक यूआरएल पर पूर्ण रीडायरेक्ट करके उपलब्ध है।

आप इस कॉल को ट्रिगर कर सकते हैं:

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/', // Link to share
}, function(response){});

फेसबुक पर साझा की गई कहानी को अनुकूलित करने के लिए आप इस URL पर पृष्ठ पर खुले ग्राफ़ मेटा टैग भी शामिल कर सकते हैं।

ध्यान दें कि response.error_message केवल तभी दिखाई देगा जब आपके ऐप का उपयोग करने वाले किसी व्यक्ति ने आपके ऐप को Facebook लॉगिन से प्रमाणित किया हो।

इसके अलावा आप जावास्क्रिप्ट फेसबुक एसडीके होने पर कॉल के साथ सीधे लिंक साझा कर सकते हैं।

https://www.facebook.com/dialog/share&app_id=145634995501895&display=popup&href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F&redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

https://www.facebook.com/dialog/share&app_id={APP_ID}&display=popup&href={LINK_TO_SHARE}&redirect_uri={REDIRECT_AFTER_SHARE}

• app_id => आपके ऐप का विशिष्ट पहचानकर्ता। (आवश्यक है।)

• redirect_uri => किसी व्यक्ति द्वारा संवाद पर एक बटन क्लिक करने के बाद URL पुनर्निर्देशित होता है। URL पुनर्निर्देशन का उपयोग करते समय आवश्यक है।

• प्रदर्शन => निर्धारित करता है कि संवाद कैसे प्रस्तुत किया गया है।

यदि आप URL रीडायरेक्ट डायलॉग कार्यान्वयन का उपयोग कर रहे हैं, तो यह एक पूर्ण पृष्ठ प्रदर्शन होगा, जिसे Facebook.com के भीतर दिखाया गया है। इस प्रदर्शन प्रकार को पेज कहा जाता है। यदि आप संवाद को लागू करने के लिए हमारे iOS या Android एसडीके में से एक का उपयोग कर रहे हैं, तो यह स्वचालित रूप से निर्दिष्ट है और डिवाइस के लिए एक उपयुक्त प्रदर्शन प्रकार चुनता है। यदि आप जावास्क्रिप्ट के लिए फेसबुक एसडीके का उपयोग कर रहे हैं, तो यह फेसबुक डॉट कॉम पर एक गेम के भीतर उपयोग करने वाले लोगों के लिए एक मोडल आइफ्रेम प्रकार के लिए डिफ़ॉल्ट होगा, और बाकी सभी के लिए एक पॉपअप विंडो। यदि आवश्यक हो तो आप जावास्क्रिप्ट के लिए फेसबुक एसडीके का उपयोग करते समय पॉपअप या पृष्ठ प्रकारों को भी बाध्य कर सकते हैं। मोबाइल वेब एप्लिकेशन हमेशा टच डिस्प्ले प्रकार के लिए डिफ़ॉल्ट होंगे। शेयर पैरामीटर

• href => इस पोस्ट से जुड़ी लिंक। विधि का उपयोग करते समय आवश्यक है। साझा की गई कहानी को अनुकूलित करने के लिए इस URL पर पृष्ठ में खुले ग्राफ़ मेटा टैग शामिल करें।

Answer 6

अपने स्वयं के विशिष्ट सर्वर या विभिन्न पृष्ठों और छवि बटन के लिए आप कुछ इस तरह से उपयोग कर सकते हैं (केवल PHP)

<a href="http://www.facebook.com/sharer/sharer.php?u=http://'.$_SERVER['SERVER_NAME'].'" target="_blank"><img src="http://i.stack.imgur.com/rffGp.png" /></a>

मैं इसके साथ स्निपेट साझा नहीं कर सकता लेकिन आपको यह विचार मिलेगा ...