ဒီေန႔အခ်ိန္ေတြရလုိ႔ ဘေလာ့မွာFacebook Posts Recommendations Bar ထည့္နည္းေလးကုိ မသိေသးတဲ့ မိတ္ေဆြေတြအတြက္ ေ၀မွ်ေပးလုိက္ပါတယ္။ How To Add Facebook Recommendations Bar To Blogger ပုိ႔(စ္)မွာလည္း တင္ေပးၿပီးပါၿပီး။ ဒါေပမယ့္ ထည့္နည္းနဲ႕ Cond ေတြကလည္း မတူတာေၾကာင့္ထပ္တင္ေပးလုိက္တာပါ။ ႀကဳိက္ၾကမယ္လုိ႔လည္းေမွ်ာ္လင့္ပါတယ္။ က်ေနာ္ကုိယ္တုိင္လည္း ဤဘေလာ့မွာ သုံးေနပါတယ္။ ေအာက္မွာ ထည့္နည္းနွင့္ လုပ္နည့္ကုိ အဆင့္လုိက္ျပေပးထားပါတယ္။ အဆင္မေျပတာေလးေတြရွိခဲ့ရင္ Comment နွင့္ Chat Box ေတြမွာ ျပန္ေမးနုိင္ပါတယ္။ ဒီ Site မွာ တင္ထားသမွ် Facebook နဲ႔ဆုိင္တဲ့ ဘေလာ့နည္းပညာေလးေတြကုိ ဒီေနရာေလးမွာ ထပ္ေလ့လာနုိင္ပါတယ္။ Facebook Posts Recommendation Bar ေလးကုိ မိမိကုိတုိင္း ယူးသုံးခ်င္ရင္ေတာ့ Originals(မူရင္း) ဒီေနရာမွာ ယူးနုိင္ပါတယ္။

demo ပုံေလးပါ။



 အဆင့္ ၁။ Create a Facebook Application

ပထမဆုံး Facebook App ထဲတြင္၀င္လုိက္ပါ။
ဒုတိယ အေပၚ လက္ယာဘက္ တြင္ေတြ႔ရတဲ့ Create New App ထဲကုိ၀င္ပါ။

Create New App ထဲကုိ၀င္ၿပီး ေအာက္ပုံအတုိင္းျမင္ရပါတယ္။ အဆင့္လုိက္လုပ္ေဆာင္ပါ။

အေပၚပုံအတုိင္းထြက္လာရင္ ေမးတာေလးေတြေျဖေပးလုိက္ပါ။ ၿပီးရင္ App ID အသစ္ရလာပါမယ္။ ရလာၿပီးဆုိရင္ Edit Setting ထဲကုိ၀င္ၿပီး Website with Facebook Login ထဲတြင္ မိမိ၏ website လင့္(ခ္)/URl ကုိထည့္ေပးလုိက္ပါ။ ထည့္ၿပီးရင္ Save Changes ကုိနုိပ္လုိက္ပါ။ ေအာက္ပုံကုိ ၾကည့္ပါ။

အေပၚက အဆင့္ၿပီးသြားရင္ မိမိရထားတဲ့ App ID/API Key ကုိ ေသးခ်ာမွတ္ထားပါ။ ေအာက္ပုံကုိၾကည့္ပါ။

အဆင့္ ၂။ Add "Recommendations Bar" To Your Blog

၁။Sign In Blogger

၂။ Template
Cond ေပါင္းထည့္ရမွာ စိတ္မခ်ပါက Backup/Restore အရင္လုပ္ေပးသင့္ပါတယ္။
၃။ Edit HTMl

၄။ Proceed
Expand Widget Templates ကုိအမွန္ျခစ္ေပးလုိက္ပါ

၅။ ေအာက္က Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။

<html

၆။ ေတြ႕ၿပီးဆုိရင္ <html ေနရာကုိ ေအာက္က Cond နဲ႔ လဲေပးပါ။ (Replace it with this code)

<html xmlns:fb='http://ogp.me/ns/fb#'

၇။ ေအာက္က Cond ကုိထပ္ရွာပါ။

</body>

၈။ ေတြ႔ၿပီးဆုိရင္ </body> ရဲ႕ အေပၚ/ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။

<div id='fb-root'/>

<script>

//Facebook Recommendation bar tutorial by www.mrthangming.blogspot.com

//<![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&appId=Your-App-ID";

  fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));

//]]>

</script>


မွတ္ခ်က္။   ။Your-App-ID ေနရာမွာ မိမိ၏ Facebook App ID ၁၅ လုံးကုိထည့္ေပး ဖုိ႔မေမ့ပါနဲ႔?????

၉။ ေအာက္က Cond ကုိ ထပ္ရွာပါ။

</head>

၁၀။ ေတြ႔ၿပီးဆုိရင္ </head> ရဲ႕ အေပၚ/ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။
<b:if cond='data:blog.pageType == &quot;item&quot;'>

<meta content='article' property='og:type'/>

<meta expr:content='data:blog.title' property='og:site_name'/>

<meta expr:content='data:blog.pageName' property='og:title'/>

<b:if cond='data:blog.postImageThumbnailUrl'>

<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>

</b:if>

<b:else/>

<meta expr:content='data:blog.title' property='og:title'/>

<meta content='website' property='og:type'/>

</b:if>

<meta expr:content='&quot;en_US&quot;' property='og:locale'/>

<meta expr:content='data:blog.canonicalUrl' property='og:url'/>

၁၁။ ေအာက္က Cond ကုိ ထပ္ရွာပါ။

<data:post.body/>

၁၂။ ေတြ႔ၿပီးဆုိရင္ <data:post.body/> ရဲ႕ အေပၚ/ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။

 <b:if cond='data:blog.pageType == &quot;item&quot;'><b:if cond='data:blog.pageType != &quot;static_page&quot;'><div style='z-index:999999; position:absolute;'>
<fb:recommendations-bar action='like' max_age='0' num_recommendations='3' read_time='10' side='right' site='http://www.mrthangming.blogspot.com' trigger='40%'/></div>
</b:if></b:if>


၁၃။ ထည့္ၿပီးရင္ Save Template ကုိ နုိပ္ေပးလုိက္ပါ။

မွတ္ခ်က္။  ။ mrthangming.blogspot. ေနရာမွာ မိမိ၏ Site နဲ႔ လဲေပးပါ။ recommendations='3' , time='10' ႏွင့္ trigger='40% ေနရာေတြ မွာ မိမိစိတ္ႀကဳိက္ျပင္နုိင္ပါတယ္။

Post a Comment Blogger

အခုစာဖတ္သူၾကည့္ေနတဲ့ ပုိ့(စ္) ေလးမွာ ဘယ္လုိထင္ျမင္ခ်က္ရွိလဲ? စာဖတ္သူရဲ့ထင္ျမင္ခ်က္ကုိ ဤေနရာေလးမွာ ေရးခ်ၾကည့္ပါလား။..~!!!

 
Top