ফেসবুক লাইক বাটন - মন্তব্য পপ আপ অক্ষম কিভাবে?


107

আমি কোনও মন্তব্য বাক্সটি অক্ষম করতে চাই যা কোনও ব্যবহারকারী যখন আমার সাইটে ফেসবুকে (এফবিএমএল) লাইক বোতামটি ক্লিক করেন তখন পপ আপ হয়। এটা কি সম্ভব? ডকুমেন্টেশনে আমি কোনও বিবরণ পাই না।


2
আপনার জন্য কোনও উত্তর খুঁজে পেল না। আপনি কি "লাইক বক্স "টিকে একটি কর্মচিকিত্সা হিসাবে বিবেচনা করেছেন? developers.facebook.com/docs/reference/plugins/like-box । আপনি "স্ট্রিম দেখান" এবং "শিরোনাম দেখান" বন্ধ করতে পারেন এবং "সংযোগগুলি" 0 তে সেট করতে পারেন এবং ফলস্বরূপ মার্কআপটি যুক্তিসঙ্গত আকার দেয়।
জুমব্যাট

আমি একটি উত্তর যুক্ত করেছি যা আমি কার্যকরী হিসাবে পেয়েছি।
BrynJ

উত্তর:


125

ফেসবুক লাইক (এক্সএফবিএমএল সংস্করণ যদি আইফ্রেমে এক নয়) এর পরে কমেন্ট বক্সটি আড়াল করার সহজ সমাধান দেওয়া হয়েছে:

.fb_edge_widget_with_comment span.fb_edge_comment_widget iframe.fb_ltr {
    display: none !important;
}

আপনার যেকোন সিএসএস ফাইলে সিএসএস স্টাইল রাখুন এবং যাদুটি দেখুন, এটি কাজ করে :)


ধন্যবাদ জোনাথন যদিও আমি সেরা নই :) আমি একই বিষয়ে লড়াই করেছি এবং অভিনব সমাধানের সন্ধানের চেয়ে CSS ব্যবহার করার সমাধান করার চেষ্টা করেছি এবং এটি 'মনোমুগ্ধকর মতো' কাজ করেছে :)
মোহাম্মদ আরিফ

8
কেউ কি মনে করেন না যে ব্রিনজে উত্তর সবচেয়ে ভাল হতে পারে? ফেসবুক যদি মার্কআপে তাদের ক্লাস পরিবর্তন করে তবে এই পদ্ধতিটি ভেঙে যাবে।
tybro0103

অবাক করার মতো এখনও কোনও বিকল্প নেই, যেখানে আপনি মন্তব্যটি পপ-আপকে অক্ষম করতে পারবেন। দুর্দান্ত কাজ করে।
২:26

@tybro, যদি ফেসবুকের শেষ প্রান্তে ক্লাসের নামগুলি কোনও সুযোগে পরিবর্তিত হয় তবে অবশ্যই সিএসএস থেকে সহজেই কেউ নিয়ম পরিবর্তন করতে পারে, এটির জন্য কোনও ধরণের কার্যকরী পরিবর্তন প্রয়োজন হয় না, মন্তব্য পপআপটি লুকানোর পক্ষে এটিই সহজতম সমাধান fix সময় এফবি এটিকে কনফিগারযোগ্য করে তোলে না।
মোহাম্মদ আরিফ

14
এই Kotzilla এর সমাধান ব্যবহার ছিল 12 ফেব্রুয়ারী 2013. আমার জন্য কাজ না করে
Bashevis

81

এই সমস্যার সমাধান করার জন্য ওভারফ্লো সেট করে যথাযথ আকারের ডিভের মধ্যে আইফ্রেমে রেখে দেওয়া - যদিও এটি কেবল সমস্যাটিকে গোপন করে।


5
আমার কাছে মজার বিষয় যে অন্য লোকটি সমস্ত ভোট পেয়েছিল। সম্ভবত তার পদ্ধতিটি তিন মিনিট সাশ্রয় করে তবে ফেসবুক যদি তাদের ক্লাস পরিবর্তন করে তবে তা ভেঙে যাবে।
tybro0103

@tybro আপনি ক্লাসে এফবি ট্যাগ যুক্ত করতে এবং এটি স্টাইল করতে পারেন, সুতরাং fb এর শ্রেণি পরিবর্তন করা আপনার কোডকে প্রভাবিত করবে না।
গাঙ্গেশ

1
@ গঙ্গেশ উম না, আপনি পারবেন না। মার্কআপ সরাসরি ফেসবুক থেকে আসে যা আপনার নিয়ন্ত্রণে নেই।
tybro0103

@ tybro0103, আমি একটি পদ্ধতি যুক্ত করেছি যা এফবি তাদের ক্লাস পরিবর্তন করলেও ভাঙবে না
জোড়ক্স

আপনাকে অনেক ধন্যবাদ @ ব্রিনজে
অভিষেক

69

আমি এটি আমার সিএসএসে ব্যবহার করি:

.fb-like{
    height: 20px;
    overflow: hidden;
}

এবং সাধারণ HTML5 কোড সহ ফেসবুক বোতামটি রেন্ডার করুন, এরকম কিছু:

<div class="fb-like" data-layout="button_count" data-show-faces="false"></div>

gr-


4
অন্যান্য সমাধানগুলি চেষ্টা করার পরে, এটি সর্বোত্তম কাজ করেছে। আইফ্রেম উপযুক্ত নয় কারণ আমার এজ ক্রাইট ইভেন্টটির সাবস্ক্রাইব করতে হবে। প্রান্ত। ক্রিয়েট ইভেন্ট হ্যান্ডলারে ডিভ ট্যাগটি পুনরায় রেন্ডারিং করে এতে কিছুটা পিছিয়ে পড়েছিল। ".Fb_edge_widget_with_comment span.fb_edge_comment_widget iframe.fb_ltr" ব্যবহার করে অন্যান্য সিএসএস সমাধান আমার পক্ষে কাজ করে নি।
কোডওয়ারিওর

এটিই আমার পক্ষে কাজ করেছে। আমি এম্বেড পদ্ধতির মতো নন iframe ব্যবহার করছি।
TK123

4
সত্যিই কাজ করে না (জানুয়ারী 2014) এটি কেবল এটি লুকিয়ে রাখে এমন মন্তব্য বাক্সটি অক্ষম করে না। আপনি যদি পছন্দ মতো বোতামটি টিপেন (আপনি যে লিঙ্কটি দিয়ে যাচ্ছেন সেটি অপছন্দ করার পরে আপনার পৃষ্ঠাটি রিফ্রেশ করার জন্য সতর্ক হন) এবং তারপরে টাইপ করা শুরু <div>করেন, একই আকার থাকে তবে পাঠ্য প্রবেশের বাক্সটি দেখায়, তারপরে ট্যাব টিপুন এবং ক্লোজ এবং পোস্ট বোতামগুলি দৃশ্যমান হয় । ভাল না. আমি ফায়ারফক্সের সাথে পরীক্ষা করছিলাম।
আনাবল

ইয়েয়াআহহ, এই সমাধান যা সত্যই কাজ করে, আপনাকে ধন্যবাদ !!
মাইকেল 20

14

আমি যা করেছি তা হ'ল "লাইক" বোতামটির জন্য একটি ডিগ্রি ক্রেট:

<div class="fb_like">
  <fb:like href="yourlink" send="false" layout="button_count" width="90" show_faces="false" font="arial"></fb:like>
</div>

এবং এটি সিএসএস:

.fb_like {  
  overflow: hidden;
  width: 90px;
}

4
এটি আসলে আমি খুঁজে পাওয়া সেরা কাজ। আপনি যদি বাক্সের গণনা বিন্যাসটি ব্যবহার করেন তবে নিম্নলিখিত সিএসএস ব্যবহার করুন: .fb-like {ওভারফ্লো: লুকানো; উচ্চতা: 61px; } আপনি ঠিক পছন্দ মতো বোতামের উপরে ছোট খাঁজ দেখতে পাবেন তবে আপনি আর এই বোকা পপআপ দ্বারা বিরক্ত হবেন না।
নিকোলাস বার্নিয়ার

ন্যূনতম থিমের জন্য, মোড়ক ডিভের এই ব্যবহার ওয়েব এবং মোবাইল উভয় ক্ষেত্রেই কাজ করেছে, যখন কেবল এফবি-জাতীয় শ্রেণীর উপর নজর রেখে সরাসরি মোবাইলে কাজ করা হয়নি (অতিরিক্ত মিডিয়া নির্দিষ্ট ক্লাস অন্তর্ভুক্ত হওয়ার কারণে)
gamozzii

9

আমি মোহাম্মদ আরিফের সমাধানটি পছন্দ করি এবং আমি এটি সেরা উত্তর হিসাবে বেছে নিয়েছি। তবে যদি এফবি ক্লাস পরিবর্তন করে, তবে নীচে সর্বদা কার্যকর হবে ..

FB.Event.subscribe('edge.create', function(response) {
   $('#like_button_holder').html('<div class="fb-like" data-href="http://www.your-url.com" data-send="false" data-layout="button_count" data-width="50" data-show-faces="false"></div>')
   FB.XFBML.parse();
});

যেখানে "লাইক_বটন_হোল্ডার" বোতাম কোডের মতো ফেসবুক ধারণ করে "আপনার" ডিভি আইডি


4
আমি এই সমাধানটি ব্যবহার করেছি কারণ সিএসএস শৈলীর সাহায্যে আমি কোনও আইফ্রেমের অভ্যন্তরে কোনও ডিভি লুকিয়ে রাখতে পারি না।
প্যানস

এটি সত্যিই স্মার্ট, তবে, মন্তব্য বাক্সটি খুব অল্প সময়ের জন্য দেখা যেতে পারে
গোলাপডন

1
আমি এটিকে "সত্যই স্মার্ট" ভাল সমাধান বলব না - এর মধ্যে লাইক বাটন মার্কআপটি সরিয়ে ফেলা (তবে কিছু ইভেন্ট হ্যান্ডলিং কোড অনাথ করা), ডিওএমে একটি নতুন সংযোজন করা, এক্সএফবিএমএল এর জন্য পুরো পৃষ্ঠার ডিওএম পুনর্বিবেচনা করা এবং একটি নতুন উত্স জড়িত রয়েছে নতুন লাইক বাটন, যার অর্থ আরও ইভেন্ট হ্যান্ডলার, একটি পুনরায় রঙ করা এবং রিফ্লো, কয়েকটি নতুন অনুরোধ ইত্যাদি I একটি নতুন কম্পিউটার কেনা।
অ্যান্ড্রুএফ

1
আরও ভাল ধারণা পেয়েছেন? এই গডম্যাম কমেন্ট বক্স অন্যথায় চলে যাবে না।
অমলগোভিনাস

@ এন্ড্রুফ - এর পরে আরও ভাল ধারণা?
জেরেমি হেইল

5

ক্লিনার সমাধান যে কাজ (হিসাবে মে 2014 ) -

  1. সব করতে প্রথম নিশ্চিত <div class="fb-like" হয়েছে ডেটা-বিন্যাস যেমন সম্পত্তি বোতাম -

    <div class="fb-like" data-layout="button"........></div>
    
  2. কেবল এই সিএসএস-

    .fb-like{
       overflow: hidden !important;
    }
    

এটাই!

ডেমো


4

এখানে ডেবি ডাউনার হওয়ার কথা নয়, তবে মন্তব্য বাক্সগুলি লুকিয়ে রাখা ফেসবুকের নীতি লঙ্ঘন করে না?

চতুর্থ। অ্যাপ্লিকেশন ইন্টিগ্রেশন পয়েন্ট d। আপনার অবশ্যই আমাদের সামাজিক প্লাগইনগুলির উপাদানগুলিকে অস্পষ্ট বা কভার করবেন না যেমন লাইক বোতাম বা লাইক বক্স প্লাগইন।

https://developers.facebook.com/policy/


1
এটি প্রশ্নের উত্তর দেয় না। একটি মন্তব্য হিসাবে অতিরিক্ত মন্তব্য করুন।
ত্রিনিমন

2
এটি বিদ্রূপাত্মক - এটি এফ * সিঙ্কিং কমেন্ট বক্স যা আমার লাইক বোতামটি লুকিয়ে রেখেছে !!
অমলগোভিনাস

3

display: noneবোতামটির এইচটিএমএল 5 সংস্করণ দিয়ে কাজ করার বিকল্পটি আমি পাইনি । পরিবর্তে আমি ডিভটিকে লক্ষ্য করেছিলাম যে লাইক বোতামের বোতামটি তৈরি হয়েছে এবং ওভারফ্লোটি গোপনে সেট করে।

আমার মূল সিএসএস ফাইলে নিম্নলিখিতটি ফেলে দেওয়া কৌশলটি করেছে:

#fb_button{
    overflow:hidden;
}

3

ব্রায়নজির সাথে সম্মত হোন, সেরা সমাধানটি হ'ল 20px উচ্চ ডিভ ধারকটিতে লাইক বোতামটি রেখে, ওভারফ্লোটি লুকিয়ে রাখা হয়েছে (আমি কোথাও পড়েছি যে মন্তব্যটি এফবি সম্প্রতি আইফ্রেমে স্থানান্তরিত করেছে, তাই সমাধানটি যা স্টাইলকে সংশোধন করে । fb_edge_widget_with_comment সম্ভবত আইফ্রেম ব্যবহারকারীদের জন্য আর কার্যকর হয় না)।

অ্যাডথিস ব্যবহার করছেন? এটা কর:

<div class="container" style="height: 20px; overflow: hidden;">
  <div class="addthis_toolbox addthis_default_style">
    <a class="addthis_button_facebook_like"></a>
  </div>
</div>

20px ডিভ কনটেইনার সলিউশনই কেবলমাত্র কাজ করে তা নিশ্চিত করতে পারে।
বাশেভিস

2

আপনি যদি "লাইক" ক্লিক করেন এবং মতামতটি পপ-আপকে আড়াল করার জন্য আপনার কাছে একটি ধারক ডিভ থাকে তবে লাইক বোতামটি যদি অদৃশ্য হয়ে যায় তবে নিম্নলিখিত সমাধানটি ব্যবহার করুন:

এফবি-এর মতো বোতামটি রাখার জন্য একটি ধারক ডিভ তৈরি করুন এবং এটি নীচের সিএসএস দিন:

.fb_like {
  overflow: hidden;
  width: 90px;
}

.fb_like iframe {
  left: 0 !important;
}

2

আমি পরিবর্তে আইএফআরএম সংস্করণটি প্রয়োগ করে ফেসবুকের মতো বোতামের মন্তব্য পপ-আপ ইস্যুটিকে রোধ করতে পেরেছি। আমি এটি করতে নিম্নলিখিত পদক্ষেপ নিয়েছি:

  1. Https://developers.facebook.com/docs/plugins/ Like- button/ দেখুন
  2. আপনার ফেসবুক পৃষ্ঠার ইউআরএলে 'পছন্দ করতে ইউআরএল' পরিবর্তন করুন
  3. পছন্দসই অন্য কোনও বিকল্প (লেআউট, ক্রিয়া প্রকার ইত্যাদি) নির্বাচন করুন
  4. 'কোড পান' বোতামটি টিপুন
  5. আইএফআরএম সংস্করণ নির্বাচন করুন
  6. নিশ্চিত হয়ে নিন যে আপনি যেখানে আপনার ফেসবুক অ্যাপ্লিকেশনটি বেছে নিয়েছে সেখানে বলা হয়েছে যে 'এই স্ক্রিপ্টটি আপনার অ্যাপের অ্যাপ্লিকেশন আইডি ব্যবহার করে'
  7. আপনার আবেদনে প্রদত্ত কোডটি কার্যকর করুন

আমি যা দেখতে পাচ্ছি তা থেকে, আইএফআরএএম বাস্তবায়ন সহ লাইক বোতামটি কোনও পপ-আপকে ট্রিগার করে না। এটি কেবল একটি লাইক বোতাম হিসাবে কাজ করে। এটি ছিল আমার কাঙ্ক্ষিত পরিণতি।

শুভকামনা।


আপনার যদি ইভেন্ট শ্রোতার প্রয়োজন না হয় তবে এটি সেরা অফিশিয়াল উত্তর। ধন্যবাদ মানুষ !!
ইয়াহেল

1

টুইটার এবং লিংকডিনের পাশাপাশি লাইক বাটনটিকে একটি স্ট্যান্ডার্ড বোতাম হিসাবে কাজ করার কোডটি এখানে। আশা করি এটা সাহায্য করবে.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>FB</title>


<style>
.social ul { overflow: hidden; margin:0; padding:0; list-style: none; } 
.social ul li { float: left; margin-right: 10px; }
</style>

</head>

<body>
<div id="fb-root"></div>

<div class="social">

    <ul>
        <li class="facebook">   
            <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.smh.com.au&amp;send=false&amp;layout=button_count&amp;width=45&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21&amp;appId=333450970117655" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:48px; height:21px;" allowTransparency="true"></iframe> 
        </li>
        <li class="twitter">
            <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.smh.com.au" data-count="none">Tweet</a>
        </li>
        <li class="linkedin">
            <script type="IN/Share" data-url="http://www.smh.com.au/"></script>
        </li>
    </ul>
</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&appId=333450970117655";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
</script>

<script src="//platform.linkedin.com/in.js" type="text/javascript">lang: en_US</script>

</body>
</html>

ভাল, আমি পৃষ্ঠা থেকে চেষ্টা করেছি এটিই সেরা সমাধান। ধন্যবাদ আবার রাফায়েল।
স্টুয়ার্ট

1

এটি চেষ্টা করে দেখুন:

FB.Event.subscribe('edge.create', function(response) {
    var $parent =  $('[href="'+response+'"]').parent();
    $parent.empty();
    $parent.html('<fb:like href="'+response+'" send="false" layout="button_count" width="120" show_faces="false" action="like"></fb:like>');
    FB.XFBML.parse();
 });

1

যেমনটি আমি ঠিক করেছি, মন্তব্য পপআপটি অক্ষম হবে যখন:

  1. মুখগুলি দেখান: -> এটি পরীক্ষা করুন
  2. কোড পান: -> আইফ্রেম বিকল্পটি নির্বাচন করুন

1

আপনি যদি নতুন এইচটিএমএল 5 বোতামটি ব্যবহার করেন এবং এটি আপনার সামঞ্জস্যপূর্ণ এবং ফেসবুকের পরামর্শ অনুসারে হওয়া উচিত তবে অন্যেরা যা বলেছে তা থেকে দূরে চলে যাওয়া সহজ:

.fb-like, .addthis_button_facebook_like
  height: 25px
  overflow: hidden

দ্বিতীয় শ্রেণি অ্যাডটিস প্লাগইন ব্যবহার করে তাদের জন্য একটি বোনাস।


0

উপরে উল্লিখিত ওভারফ্লো উচ্চতার বিকল্পগুলি কখন ব্যবহার করা উচিত নয় show-faces=true। অন্যথায়, এটি মুখগুলি লুকিয়ে রাখবে।


0

আমার ক্ষেত্রে (এক্সএফবিএমএল সংস্করণ সহ) আমি ট্যাগটিতে এটি যুক্ত করেছি:

width="90" height="20" style="overflow: hidden;"

সুতরাং শেষ ফলাফল:

<fb:like data-href="URL" send="false" layout="button_count" width="90" height="20" style="overflow: hidden;" show_faces="false" colorscheme="light" action="like"></fb:like>

এটি সঠিকভাবে মন্তব্য পপআপ লুকিয়ে আছে।


0

মন্তব্য বাক্সের কাজটি আড়াল করা হচ্ছে তবে মন্তব্য ফ্লাইটআউট বাক্সের পিছনে ক্লিকযোগ্য উপাদান থাকলে সমস্যা তৈরি করতে পারে।

আপনাকে এটি লুকিয়ে রাখতে হবে এবং এটি ডোম পোস্ট থেকে পছন্দ মতো মুছে ফেলতে হবে।

মন্তব্য বাক্সটি লুকানোর জন্য এখানে সিএসএস রয়েছে:

.fb_edge_widget_with_comment span.fb_edge_comment_widget iframe.fb_ltr {
    display: none !important;
}

এখানে ডিওএম উপাদানটি সরানোর JQuery উপায়:

 FB.Event.subscribe('edge.create', function (href, widget) {        
    $('.fb_edge_comment_widget.fb_iframe_widget').remove()       
});

কলব্যাক থেকে প্রদত্ত উইজেটটি ব্যবহার করে বিশুদ্ধ জাভাস্ক্রিপ্টের উপায়টি এখানে দেওয়া হয়েছে:

FB.Event.subscribe('edge.create', function (href, widget) {
    widget._commentWidgetNode.parentNode.removeChild(widget._commentWidgetNode);        
});

অন্য ডোমেনে আইফ্রেমেড কন্টেন্টের জন্য আমার কীভাবে সিএসএস বিধি তৈরি করার কথা? যাক এর পরের মাসে সিএসএসের ক্লাসগুলির নাম আলাদা হবে?
অমলগোভিনাস

0

আপনি যদি কেবল লাইক বোতামটি দেখাতে চান তবে আপনি এটির মতো কিছু চেষ্টা করতে পারেন

এইচটিএমএল:

<div class="fb_like">
    <div class="fb-like" data-href="http://google.com" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
    <div class="like_counter_hider"></div>
</div>

সিএসএস:

.fb_like {
    overflow: hidden;
    width: 80px;
    height: 20px;
}
.like_counter_hider {
    position: absolute;
    top: 0;
    left: 45px;
    width: 35px;
    height: 20px;
    background-color: #f3f3f3; /*you'll have to match background color*/
    z-index: 200;
}

0

ওভারফ্লো লুকানোতে সেট করা সাহায্য করতে পারে। আপনার মূল সিএসএস ফাইলে এটি করুন ..

#fb_button{
overflow:hidden;
}

0

কীভাবে ঠিক কীভাবে আইফ্রেমে তৈরি করা যায় যাতে লাইনের বোতামটি বোতামের সমান আকার থাকে:

.fb_iframe_widget_lift
{
    width: 49px !important;
    height: 20px !important;
}

এটাই.

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.