اضافه ترقيم الصفحى جميل جدا 2013

 في هذه التدوينه سوف نقوم باضافه ترقيم لصفحات مدونتك والمشاركات باسلوب انيق جدا

لذلك سوف اتطرق للتفاصيل بسرعه وبدون اي مقدمات في هذا التدوينه القصيره جدا 

نبدء الشرح 

1- قم بنسخ الكود الذي في الاسفل

2- قم بالذهاب الى لوحت تحكم مدونتك 

3- اختر قالب ومن ثم انسخ نسخه احتياطيه من قالبك لتفادي الخطا ان وقع واضغط على تحرير HTML

4- اضغط على زر تنسيق النموذج وابحث عن الكود التالي باستخدام ctrl + f قم بالبحث عن </body> 

واضف هذا الكود قبلها

<style type="text/css">
    .showpageArea{padding:10px;color : #003366;text-align : left;width : 100%;}
    .showpage a {float:left;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPrD-HePVs1bF0jrD0PSHroDYSHa4lSMoQ8DcZBFEMX4HyYc0tSnC3uWQ7opKpwaVnVhTfMcjzAib60uEESR4V7GqSpLy-gSstzNFCwgBoxiiS7I0eFxbW5SOzdcvYK3AYY5ATh22GjTOk/) no-repeat 0 0;text-align : center;width : 127px;height : 42px;text-align : center;display : block;margin : 0 5px;color : #333;padding-top : 6px;}
    .showpage a:hover {color : #333;margin : 0 5px;padding-top : 6px;}
    .showpageOf{float:left;padding-top : 6px;}
    .showpageNum a {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidlHrORnFYBKRD3QYpCn0Bv77Z-gawddnVJwrXM_1QWelyXw5EM6WZ7xx6TQ0kT3dRUhiFbr-4iaL66Dgcrj7-ZD3_MCUnNKXAqpsnMLgChelZIj6kNVbC314tGevjGH3ecOjLzNltCgaC/) no-repeat 0 0;width : 37px;height : 42px;display : block;text-align : center;float : left;margin : 0 5px;padding-top : 6px;text-decoration : none;color : #333;}
    .showpageNum a:hover {background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidlHrORnFYBKRD3QYpCn0Bv77Z-gawddnVJwrXM_1QWelyXw5EM6WZ7xx6TQ0kT3dRUhiFbr-4iaL66Dgcrj7-ZD3_MCUnNKXAqpsnMLgChelZIj6kNVbC314tGevjGH3ecOjLzNltCgaC/) no-repeat 0 100%;color : #fff;}
    .showpagePoint {background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidlHrORnFYBKRD3QYpCn0Bv77Z-gawddnVJwrXM_1QWelyXw5EM6WZ7xx6TQ0kT3dRUhiFbr-4iaL66Dgcrj7-ZD3_MCUnNKXAqpsnMLgChelZIj6kNVbC314tGevjGH3ecOjLzNltCgaC/) no-repeat 0 100%;width : 37px;height : 42px;display : block;float : left;text-align : center;margin : 0 5px;padding-top : 6px;font-weight : bold;color : #fff;}
    .showpageNum a:link, .showpage a:link {text-decoration : none;color : #cc0000;}
</style>
<script style='text/javascript'>
var pageCount=5;
var displayPageNum=1;
var upPageWord="السابق";
var downPageWord="التالي";
</script>
<script type='text/javascript' src="http://widgets.way2blogging.org/blogger-widgets/w2b-beautiful-pagenavi.js"/>

ملاحظه : اذا ارتم تغيير كلمه التالي او السابق فحسب رغبتكم 



اتمنى ان يكون الموضوع مفيد واي استفسار او اضافه مطلوبه يمكنكم طلبها