بامكان كل مدونات بلوجر ان تظهر رسم احصاء او لبيان عدد المشاهدات لموضوع او تدوينة فى بلوجر يمكننا الان انشاء احصاء لااظهار عدد ...
بامكان كل مدونات بلوجر ان تظهر رسم احصاء او لبيان عدد المشاهدات لموضوع او تدوينة فى بلوجر
يمكننا الان انشاء احصاء لااظهار عدد المشاهدات بدون القلق من وجود سيرفر او كود للسيرفر .
يمكنك الان انشاء مساحة مجانية لتلك المشاهدات ليتم حفظها من الضياع بدون القلق على انتهاء المساحة مع الوقت
يجب اولا ان يكون لديك حساب فى موقع Firebase Database
وهو الموقع الذى ستكون وظيفتة هى حفظ عدد المشاهدات بدلا من اى سيرفر
قم بتسجيل حساب لديك فى الموقع Firebase
لانشاء كود لسيرفر المشاهدات عبر اضافة كود الموقع المسجل منه المشاهدات
ليصبح الكود بهذا الشكل مثلا : livegy.firebaseI.com
الان يتبقى اضافة لدينا كود الاداة فى القالب
قم بالتوجة لموقع بلوجر > اختر قالب
اضغط على تعديل HTML
اختر توسيع القالب
قم بالبحث عن ]]></b:skin>
وفوق هذا الوسوم قم بلصق الكود التالى ..
/*-------- Post Views ----------*/ #views-container { width: 75px; float: right; } .mbtloading { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKRUk_LeQa4SPJ6mVPqsXz1XhK9zRA03ZTKUMdFvTVixg2jU2ucscM49Jv2vN1zTSt3eEtWImYE7psWflrogNMtjXGwV-cXyK01lRbx5FQMm1VNy8tengZ8SiJVZmdGZRiEV5hmKtvg_0E/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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw31zx2fXYZWeKYm30tyHz1J_iX5mntY7WDIONfCx2gxkiVmmo7pIYKYiyot4XeMdUWJMI9y0P9pCrZcLj_zW5cJa65enXB1o__52njGAFQtTSD1T18WOEPL6ZpXDOw5Rl6PoffHTm7WsO/h120/postviews.png') no-repeat left; border: 0px; display: block; width: 16px; height: 16px; float: left; padding: 0px 2px; }
- لتغيير لون خط عدد المشاهدات قم بتغيير هذا الكود EE5D06
- لتغيير مكان تواجد عدد المشاهدات اما اليمين او اليسار
الان قم بالبحث عن الوسوم التالى </body>
وفوق هذا الوسوم قم بلصق الكود التالى ..
<!-- Post Views Script by MBT --><script type='text/javascript'> window.setTimeout(function() { document.body.className = document.body.className.replace('loading', ''); }, 10); </script> <script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/> <script> $.each($('a[name]'), function(i, e) { var elem = $(e).parent().find('#postviews').addClass('mbtloading'); var blogStats = new Firebase("https://livegy.firebaseio.com/pages/id/" + $(e).attr('name')); blogStats.once('value', 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('name'); isnew = true; } elem.removeClass('mbtloading').text(data.value); data.value++; if(window.location.pathname!='/') { if(isnew) blogStats.set(data); else blogStats.child('value').set(data.value); } }); }); </script>
- تأكد من وضع رابط حسابك من موقع firebase
ابحث عن الكود التالى ..
</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>
- قم بتغيير هذه الكلمة للمشاهدات او الاحصائيات او views
الان مع اخر خطوة فى اضافتنا الممتعة جدا ;)
الان قم بلصق الكود التالى اسفل الوسوم <head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
اتمنى ان تكون هذه الاضافة الجديدة اعجبتكم ,, للحصول على كل جديد اشترك فى صفحة الفيسبوك LivEgy
التعليقات