फेसबुक लॉगिन बटन कस्टम टेक्स्ट

उम्मीद है कि आप इस मुद्दे के साथ मेरी मदद कर सकते हैं।फेसबुक लॉगिन बटन कस्टम टेक्स्ट

मैं अमेरिकन प्लान डेवलपर्स साइट से बुनियादी प्रवेश बटन कोड को पकड़ा है और मैं यह लिख रहा हूँ बाहर है:

<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_GB/all.js#xfbml=1&appId=345451695525893"; 
fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script> 



<div class="fb-login-button" data-show-faces="false" data-width="200" data-max- rows="1">Test text</div>

केवल अनुकूलन मैं कर रहा हूँ डिफ़ॉल्ट अधिभावी है "में प्रवेश करें" अपने स्वयं के पाठ के साथ पाठ (इस मामले में "परीक्षण पाठ")। जब मैं फेसबुक से लॉग आउट होता हूं तो यह ठीक काम करता है, लेकिन दिलचस्प बात यह है कि जब मैं फेसबुक में लॉग इन करता हूं (किसी अन्य टैब पर फेसबुक साइट के माध्यम से), और फिर मेरे पेज पर जाने के लिए वापस आते हैं, तो कस्टम टेक्स्ट चमकता है, फिर बटन प्रदान किया जाता है डिफ़ॉल्ट "लॉग इन" टेक्स्ट के साथ दूसरी बार।

कोई विचार, या यह फेसबुक से डिज़ाइन द्वारा एक सुविधा है?

स्रोत

2012-07-09 Graeme Leggate

AFAIK - जैसा कि आप फेसबुक से एक सामाजिक प्लगइन का उपयोग कर रहे हैं, आप उनकी कार्यक्षमता तक सीमित हैं। जेएस कोड शैलियों को ऊपर और स्पष्ट रूप से - div तत्व को फिर से लिखता है ताकि जहां भी उपयोग किया जा सके एफबी लाइक बटन लगातार दिखाई देता है (और स्थानीयकरण को भी ध्यान में रखता है)। आपके पास बटन के लिए उपयोग करने के लिए क्रिया का विकल्प है - "पसंद" या "अनुशंसा" - लेकिन यह afaik है। – Snouto

ग्रीम ... मैंने देखा कि मेरी साइट पर एक ही चीज हो रही है, जो वर्षों से कस्टम लॉगिन टेक्स्ट सही तरीके से प्रदर्शित कर रहा है। ऐसा लगता है कि फेसबुक ने एफबी-लॉगिन-बटन तत्व में कुछ अनचाहे (या खोजने में बहुत मुश्किल) बदलाव किए हैं। – byron

मुझे आशा है कि फेसबुक यहां गलती है। मैंने आज तक इस सवाल को तब तक डिबगिंग करने में घंटों बिताए हैं। –

एफबी-लॉगिन-बटन घटक में हालिया परिवर्तनों को देखते हुए (जो एक हफ्ते या उससे पहले के रूप में हमेशा "लॉग इन" में कस्टम टेक्स्ट को फिर से लिखना प्रतीत होता है), आपकी सबसे अच्छी शर्त एक कस्टम सीएसएस क्लास बनाने के लिए है फेसबुक बटन और जावास्क्रिप्ट के माध्यम से FB.Login ट्रिगर करें। मैंने यही किया और यह अच्छी तरह से काम कर रहा है। एक जे एस

a.fb-button { 
    color: #FFF; 
    display: inline-block; 
    text-decoration: none; 
} 

.fb-button { 
    background: #5F78AB; 
    background-image: url('http://static.ak.fbcdn.net/rsrc.php/v2/yf/r/S-DbSHszr4D.png'); /*COPY TO YOUR OWN IMAGE STORE*/ 
    background-repeat: no-repeat; 
    background-position: -1px -81px; 
    border-top: 1px solid #29447E; 
    border-right: 1px solid #29447E; 
    border-bottom: 1px solid #1A356E; 
    border-left: 1px solid #29447E; 
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8A9CC2; 
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2; 
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8A9CC2; 
    cursor: pointer; 
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; 
    font-size: 13px; 
    font-weight: bold; 
    height: 23px; 
    line-height: 23px; 
    padding: 0px 5px 0px 30px; 
    text-align: left; 
}

अपने पृष्ठ पर तत्व

<a class="fb-button" onClick="fblogin();">Custom Text</a>

होगा और फिर:

यहाँ है कि मानक फेसबुक बटन की तरह वास्तव में लग रहा है और आसानी से कस्टम पाठ का समर्थन करता है एक फेसबुक बटन के लिए कुछ सीएसएस है फ़ंक्शन जैसे

var fblogin = function() { 
    FB.login(function(response) { 
     if (response) { 
      if (response.authResponse) { 
       //successful auth 
       //do things like create account, redirect etc. 
      } else { 
       //unsuccessful auth 
       //do things like notify user etc. 
      } 
     },{scope:'email,publish_stream'}); //whatever perms your app needs 
};

बेशक आपको एफबी रूट शामिल करना होगा अपने पृष्ठ पर div और और इससे पहले कि यह

फेसबुक जे एस एसडीके init यह इस प्रकार से दिखाई देता है:

Facebook button with custom text

सीएसएस बारे में अच्छी बात यह है कि आप पर अन्य फेसबुक बटन बनाने के लिए इसका उपयोग कर सकते हैं अपने ऐसी चीजों के लिए साइट जो एक परिचित दिखने और महसूस के साथ समर्थित नहीं हैं (जैसे शेयर)। विभिन्न आकार बटनों की अनुमति देने के लिए आप कुछ अतिरिक्त सीएसएस भी बना सकते हैं। तुम बस, संपत्ति login_text पाठ सेट करने के लिए प्रदान की जाती है

स्रोत

2012-07-15 19:29:41 byron

हे, ऐसा लगता है कि फेसबुक ने इस मुद्दे को ठीक कर दिया है और एफबीएमएल कनेक्ट बटन अब कस्टम टेक्स्ट प्रदर्शित कर रहे हैं जैसे वे करते थे। लगे रहो। – byron

.... और फिर दो दिन पहले उन्होंने बंद कर दिया ..... और फिर आज उन्होंने इसे फिर से तय कर दिया .... मैं दृढ़ता से उपर्युक्त विधि के साथ जाने और एफबी मूर्खता से दूर रहने की सिफारिश करता हूं! –

उपयोग अपने कस्टम पाठ का उपयोग करने

<div class="fb-login-button" data-show-faces="false" data-width="200" data-onlogin="afterLoginCallback()" login_text="Your Text" ></div>

सूचना निम्नलिखित पृष्ठभूमि छवि और विभिन्न फ़ॉन्ट आकार, ऊंचाई आदि के लिए अलग पृष्ठभूमि पदों की आवश्यकता होगी लॉगिन बटन पर। यदि आप इसे सेट नहीं करते हैं, तो यह आपके टेक्स्ट को डिफ़ॉल्ट रूप से ओवरराइट करेगा जो फेसबुक द्वारा प्रदान किया गया है।

स्रोत

2012-11-01 07:28:10 Roshni

ग्रेट उत्तर। अधिक मूल्यांकन किया जाना चाहिए। लोग अजीब कस्टम समाधान का उपयोग कर रहे हैं जहां समाधान सरल है। –

ऐसा लगता है कि login_text कहीं भी दस्तावेज नहीं किया जा रहा है, लेकिन यह काम करता है, अच्छा लगता है! – DrLightman

एक और अधिक सरल और कुशल जवाब! धन्यवाद! –

या फिर आप इस्तेमाल कर सकते हैं:

<div class="fb-login-button" data-login_text="Connect with FaceBook"></div>

या

<fb:login-button show-faces="true" width="200" max-rows="1" login_text="Connect with FaceBook"></fb:login-button>

आसान के रूप में 1,2,3 :)

स्रोत

2013-11-21 13:51:55

इस प्रयास करें, इस तरह डेटा: -प्रवेश-पाठ जोड़ें।

<div class="fb-login-button" 
    data-login-text="Sign in with Facebook" 
    data-max-rows="1" 
    onlogin="window.location.reload()" 
    data-size="large" 
    data-show-faces="false" 
    data-auto-logout-link="false"> 
</div>

स्रोत

2017-01-16 09:32:05 cbesabella

बस ठीक काम करता है। –

उत्तर

संबंधित मुद्दे