إضافة ترقيم الصفحات رائعة بأشكال لقوالب بلوجر

مرحبا بكم متابعينا الأعزاء، أود أن أتطرق في هذه التدوينة إلى إضافة ترقيم الصفحات لقوالب بلوجر بشرح مبسط هناك بعض القوالب تتوفر على تنقل صفحات افتراضي أي "المشاركات التالية والسابقة" كالتي بقالب بداية نقطة وفي بعض الأحيان فهي قد لا تنفع الزائر إذ كان يريد التنقل بين الصفحات بشكل سريع مما يطرح السؤال هل هذا يجعل الزائر ترك موقعك؟ بالطبع لا فهناك طرق مغايرة للوصول إلى التدوينات... فلنتحدث عن مميزات هاته الإضافة وهي الأفضل والأمثل من كل إضافة ترقيم الصفحات بحيث لها منظر بسيط وفي نفس الوقت يلائم أي قالب ويمكن تغيير اللون بسهولة تامة كما أنها تذكر عدد الصفحات المتواجدة وخفيفة .

شرح طريقة التركيب :

1. إبحث عن </body> وضع الكود التالي فوقه

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<script type='text/javascript'>
/*<![CDATA[*/
var postperpage=8;var numshowpage=3;var upPageWord ='الصفحة السابقة';var downPageWord ='الصفحة التالية';var urlactivepage=location.href;var home_page="/";
/*]]>*/
</script>
<script src='https://googledrive.com/host/0B0LkZloPKBfWb2Vjbkk3LWxVVzQ' type='text/javascript'/>
</b:if>

* لتغيير عدد ظهور المواضيع في الصفحة غير المحدد بالبرتقاي "8" بما يناسبك

2.ابحث عن ]]></b:skin> وضع الكود التالي فوقه أو ضعه بين <style> </style> فوق </head>

/* Page Navigation Ar1web.com */
#blog-pager{clear:both;display:inline-block;overflow:visible;width:auto;background-color:#fff;margin:40px 0 20px 20px;border:1px solid #EAEAEA;padding:0;text-align:right;line-height:normal;font-size:13px;font-weight:400;;}
.showpageOf{display:inline-block;font-size:90%;padding:7px 12px;vertical-align:top;line-height:20px;}
.showpagePoint{background:#30a8e6;color:#fff;display:inline-block;vertical-align:top;line-height:20px;padding:7px 12px;margin:0;font-size:14px;text-align:center;border-right:1px solid #f0f0f0;box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);transition:initial}
.showpage a,.showpageNum a{display:inline-block;vertical-align:top;line-height:20px;padding:7px 12px;margin:0;font-size:14px;text-align:center;border-right:1px solid #f0f0f0;transition:color .3s}
.showpage a:hover,.showpageNum a:hover{background-color:#fefefe;color:#454545;box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);transition:color .3s}

* لتغيير اللون الأزرق فكوده محدد بالبرتقالي #30a8e6