افضل وأسهل طريقة لوضع عداد وترقيم للصفحات فى مدونات بلوجر بدون التعديل على القالب

سيظهر العداد اسفل المدونة بهذا الشكل :



نأتى للشرح :


فى البداية نذهب الى ادارة المدونة ثم تخطيط المدونة :






ثم إضافة أداة :



بعد ذلك إضافة HTML :




 ثم ننسخ هذا الكود بالكامل ونضعه بداخله ونضغط بعدها حفظ :

<!-- Stylish colored  Navigation Widget For Blogger By UinEgy @ http://www.uniegy.blogspot.com -->
<style type="text/css">
#blog-pager{padding:5px 0 !important;}
.showpageArea {font-weight: bold;margin:5px;}/* www.uniegy.blogspot.com */
.showpageArea a {text-decoration:underline;color: #fff;}/* www.uniegy.blogspot.com */
.showpageNum  a, .showpage a {color: #fff;text-decoration:none;border:1px  solid  #999;-webkit-border-radius:3px;-moz-border-radius:3px;margin:0   3px;padding:3px 5px; background: #2790d6; background:   -moz-linear-gradient(top, #3A8DD6 0%, #5389B8 50%, #91BDE3 51%, #215E94   100%); background: -webkit-gradient(linear, left top, left bottom,   color-stop(0%,#76B5ED), color-stop(50%,#90C9E8),   color-stop(51%,#5ca8db), color-stop(100%,#3786ba)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a',   endColorstr='#7cbc0a',GradientType=0 ); }/* www.uniegy.blogspot.com */
.showpageNum  a:hover, .showpage a:hover {border: 1px solid #ccc;  background:  #6db3f2; background: -moz-linear-gradient(top, #6db3f2 0%,  #54a3ee 50%,  #3690f0 51%, #1e69de 100%); background:  -webkit-gradient(linear, left  top, left bottom, color-stop(0%,#6db3f2),  color-stop(50%,#54a3ee),  color-stop(51%,#3690f0),  color-stop(100%,#1e69de)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2',   endColorstr='#1e69de',GradientType=0 ); } /* www.uniegy.blogspot.com */
.showpagePoint  {color: #aaaaaa;text-decoration:none;border:1px solid   #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0   3px;padding:3px 5px; background: #e2e2e2; background:   -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe   100%); background: -webkit-gradient(linear, left top, left bottom,   color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb),   color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',   endColorstr='#fefefe',GradientType=0 ); }/* www.uniegy.blogspot.com */
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}/* www.uniegy.blogspot.com */
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}/* www.uniegy.blogspot.com */
</style>

<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=9;
var upPageWord ='السابق';
var downPageWord ='التالي';
</script>
<script src='http://uinegy.googlecode.com/svn/wiki/uniegy_bloggerpagenavi.js' type='text/javascript'></script>
<!-- Stylish colored Numbered Page Navigation Widget For Blogger By UinEgy @ http://www.uniegy.blogspot.com -->

إذا لم يستجيب نسخ الكود معك حمله من ملف التكست هذا وانسخه اضغط هنا