ေရာင္ျပန္ေလး(နည္းပညာ)သို႕ လာေရာက္လည္ပတ္ေသာသူအေပါင္းတို႔ ကိုယ္စိတ္ႏွလုံးရႊင္လန္းၾကပါေစလို႔ဆုမြန္ေကာင္းေတာင္းလၽွက္ပါ၊
ေရးသားသူ : Anonymous Thursday, October 13, 2016

မဂၤလာပါဗ်ာ

ကၽြန္ေတာ္ဒီေန႔ေျပာျပေပးမယ့္နည္းေလးကေတာ့မိမိဘေလာ့PostေတြမွာPost Views ေလးထည့္ပံုေလးပါ
မေန႔ကညီေလးတစ္ေယာက္က"အစ္ကိုေရာင္ျပန္ေလးေရ ဒီလိုမ်ိဳး Post Views ဘယ္လိုထည့္ရလဲ" ဆိုၿပီး
Linkတစ္ခုေပးပါတယ္။ကၽြန္ေတာ္၀င္ၾကည့္လိုက္ေတာ့wordpressႀကီးျဖစ္ေနတယ္။
ကၽြန္ေတာ္လည္းWordpressမွာေတာင္ရရင္ဘေလာ့မွာလဲရႏိုင္တယ္ဆိုၿပီးထံုးစံအတိုင္း
Youtubeမွာေမႊေႏွာက္လိုက္တာေတြ႔ပါေရာ။ပထမဦးဆံုးစလုပ္ၾကည့္တာဆိုေတာ့သူကEလိုေျပာ
ကိုယ္ကနားလည္သေလာက္လုပ္ၾကည့္တာေန႔တစ္ပိုင္းကုန္မွရတယ္ ခ္  ခ္။
စကားေတြေျပာေနတာအခ်ိန္ေတာင္ေတာ္ေတာ္ကုန္ျပီ ခ္  ခ္ ။နမူနာၾကည့္ဖို႔ေအာက္မွာDemo Linkေလး

Demo

ကိုႏွိပ္ျပီးသြားၾကည့္ဗ်ာ။
ကဲစမယ္ဗ်ာ ပထမဆံုး  ဒီမွာ Register အရင္သြားလုပ္ဗ်ာ။
အေရးႀကီးပါတယ္။
ေအာက္မွာ SS ေတြျပထားပါျပီေနာ္။
Google Account ေတာ့ရွိဖို႔လိုပါမယ္။(Bloggerေတြပဲရွိမွာပါ)
CREATE NEW PROJECT  ကိုႏွိပ္ပါမယ္။

My awesome project ေနရာမွာအဆင္ေျပတာေရးေပးပါ။(Only English Letter)
Country/region မွာ Myanmar ေရြးေပးပါ။
ျပီးရင္ CREATE PROJECT ကိုႏွိပ္ပါ။
ေအာက္ကစာမ်က္ႏွာေရာက္လာပါၿပီ။

Add Firebase to your web app   ကိုႏွိပ္လိုက္ပါ။ေအာက္ကစာမ်က္ႏွာက်လာပါလိမ့္မယ္။


အေပၚကစာမ်က္ႏွာေရာက္သြားရင္ကၽြန္ေတာ္၀ိုင္းျပထားတာေလးကိုNotepad မွာကူးယူမွတ္ထားလိုက္ပါ။
အေရးႀကီးပါတယ္။
ကဲဇာတ္လမ္းကအခုမွစမွာထံုးစံအတိုင္း
Blog>>>Templated>>>Edit Templated>>>

]]></b:skin>ကိုရွာပါ။
ျပီးရင္သူ႔ရဲ႔အေပၚကပ္ရပ္မွာေအာက္ကCodeကိုထည့္လိုက္ပါ။


/*-------- Post Views  ----------*/
#views-container {
width: 85px;
float: right;
}
.mbtloading {
background: url('http://4.bp.blogspot.com/-PZMStRDcchY/USOp3xFp4yI/AAAAAAAAJOo/rm5FSsaSKh0/s320/mbtloading.gif') no-repeat left center;
width: 16px;
height: 16px;
}
.viewscount {
float: right;
color: #EE5D06;
font: bold italic 14px arial;
}
.views-text {
float: left;
font: bold 12px arial;
color: #333;
}
.views-icon{
background: url('http://4.bp.blogspot.com/-_dXedKDHIws/USOp369zEPI/AAAAAAAAJOs/Cv3fTZUaBTU/s1600/postviews.png') no-repeat left;
border: 0px;
display: block;
width: 16px;
height: 16px;
float: left;
padding: 0px 2px;
}
ျပီးရင္</body>ကိုထပ္ရွာပါ။ေစာေစာကလိုပဲသူ႔အေပၚကပ္ရပ္မွာေအာက္ကCodeကိုထည့္ပါ။
Color ခ်ယ္ထားတဲ႔ေနရာမွာေစာေစာကNotepadမွာမွတ္ထားတာကိုအစားထိုးလိုက္ပါ။


<!-- Post Views Script by MBT --> 
<script type='text/javascript'> 
    window.setTimeout(function() { 
        document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;); 
      }, 10); 
  </script> 
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/> 
<script> 
$.each($(&#39;a[name]&#39;), function(i, e) { 
var elem = $(e).parent().find(&#39;#postviews&#39;).addClass(&#39;mbtloading&#39;); 
var blogStats = new Firebase(&quot;https://mybloggertricks.firebaseio.com/pages/id/&quot; + $(e).attr(&#39;name&#39;)); 
blogStats.once(&#39;value&#39;, function(snapshot) { 
var data = snapshot.val(); 
var isnew = false; 
if(data == null) { 
data= {}; 
data.value = 0; 
data.url = window.location.href; 
data.id = $(e).attr(&#39;name&#39;); 
isnew = true; 

elem.removeClass(&#39;mbtloading&#39;).text(data.value); 
data.value++; 
if(window.location.pathname!=&#39;/&#39;) 

if(isnew) 
blogStats.set(data); 
else 
blogStats.child(&#39;value&#39;).set(data.value); 

}); 
}); 
</script>

မၿပီးေသးဘူးကိုယ့္လူအခု<data:post.body/>ကိုရွာလိုက္ပါဦး။ေတြ႔ရင္သူ႔အေပၚကပ္ရပ္မွာ
<!-- Post Views Counter by MBT--> 
<div id='views-container'><span class='views-icon'/><div class='views-text'>Views:</div> <div class='mbtloading viewscount' id='postviews'/></div>
ေလးထည့္ေပးလိုက္ပါ။
ဒါကေတာ့ေနာက္ဆံုးအဆင့္<head> ကိုရွာပါ။ေတြ႔ရင္သူ႔ေအာက္ကပ္ရပ္မွာ
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
ထည့္ေပးလိုက္ပါ။ၿပီးရင္ Save Templated ႏွိပ္လိုက္ပါ။
ျပီးပါၿပီဗ်ာ။
အဆင္ေျပၾကပါေစ
ဒီေအာက္ကပ္ရပ္ကပံုေလးတစ္ခ်က္ေလာက္ကလစ္ခဲ႔ေပးပါလားဗ်ာ။

BlockAdz





Leave a Reply

အဆင္မေျပတာမ်ား ၊ လိုခ်င္တာမ်ားရွိရင္မွာခဲ႔ပါ။

ကၽြန္ေတာ္႔ရဲ႔ေရးေဖာ္ေရးဖက္မ်ား

Yaung Pyan Lay (ေရာင္ျပန္ေလး နည္းပညာ)
ဂ်ဴးကေလး(ေရာင္ျပန္ေလး စာေပ)
Mr Yaung Pyan (Golden Myanmar)
ကိုျမတ္ ( MICT Garden)
ေငြဇင္မိုး (ေငြဇင္မိုး မံုရြာ)
Aung Ko Latt (Aung Ko Latt စြယ္စံု)
Maung Pauk (ေမာင္ေပါက္နည္းပညာ)
CKKH(နည္းပညာ)

Subscribe to Posts | Subscribe to Comments

@Copy Right 2016 / Designe By ေရာင္ျပန္ေလး(နည္းပညာ) / Power By Yaung Pyan Lay

- Copyright © ​ေရာင္​ျပန္​​ေလး - Hatsune Miku - Powered by Blogger - Designed by Johanes Djogan -