لحل الأمثل لإضافة ترقيم الصفحات وحل مشكلة عدم ضهورها في التسميات

لحل الأمثل لإضافة ترقيم الصفحات وحل مشكلة عدم ضهورها في التسميات 

 

 

السلام عليكم ورحمة الله وبركاته اخواني اخواتي إ زوار المدونة أتمنى ان تكونوا بألف خير في هذه التدوينة سأشرح لكم طريقة إضافة ترقيم الصفحات لقالب مدونتك وحل مشكلة عدم ظهور الترقيم داخل التسميات هذه الطريقة مضمونة ومجربة وقد جربتها أيضا ويمكنك معينتها أدخل لقسم من أقسام المدونة وسيظهر ترقيم الصفحات

حسنا ركز معايا قليلا قم بتحرير قالب مدونتك ثم إبحث عن الكود التالي

<b:includable id='mobile-index-post' var='post'>

ثم أسفله مباشرة ضع هذا الكود

<b:includable id='page-navi'>
<div class='pagenavi'>
<script type='text/javascript'>
var pageNaviConf = {
perPage: 7,
numPages: 5,
firstText: "First",
lastText: "Last",
nextText: "»",
prevText: "«"
}
</script>
<script src='http://awesome-navigation.googlecode.com/files/onlinetrick.js' type='text/javascript'/>
<div class='clear'/>
</div>
</b:includable>

ثم بعد ذالك ثم بالبحث عن الكود التالي

<b:include name='nextprev'/>

واستبدله بهذا الكود

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<b:include name='page-navi'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<b:include name='page-navi'/>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include name='nextprev'/>
</b:if>
</b:if>

وآخر خطوة هي تركيب الستايل وذالك بالبحث عن الوسم التالي

 ]]></b:skin>

ثم قبله ضع الكود التالي

#blog-pager, .pagenavi {
     clear: both;
     text-align: center;
     margin: 30px auto 10px;
}
#blog-pager a, .pagenavi span, .pagenavi a {
float:right;
text-decoration: none;
color: #333;
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
background-color: #F8F8F8;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fffcfcfc,EndColorStr=#fff8f8f8);
background-image: -moz-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%);
background-image: -ms-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%);
background-image: -o-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FCFCFC),color-stop(100%,#F8F8F8));
background-image: -webkit-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%);
background-image: linear-gradient(to bottom,#FCFCFC 0,#F8F8F8 100%);
padding: 5px 10px;
border: 1px solid lightGrey;
font-weight: bold;
font-size: 12px;font-family:&#39;tahoma&#39;
vertical-align: middle;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin: 2px 2px;
-webkit-transition: .0s ease-in!important;
-moz-transition: .0s ease-in!important;
-ms-transition: .0s ease-in!important;
-o-transition: .0s ease-in!important;
transition: .0s ease-in!important;
}
#blog-pager a:hover, .pagenavi a:hover {
border-color: #C6C6C6;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff8f8f8,EndColorStr=#ffeeeeee);
background-image: -moz-linear-gradient(top,#F8F8F8 0,#EEE 100%);
background-image: -ms-linear-gradient(top,#F8F8F8 0,#EEE 100%);
background-image: -o-linear-gradient(top,#F8F8F8 0,#EEE 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#F8F8F8),color-stop(100%,#EEE));
background-image: -webkit-linear-gradient(top,#F8F8F8 0,#EEE 100%);
background-image: linear-gradient(to bottom,#F8F8F8 0,#EEE 100%);
}
#blog-pager-older-link, #blog-pager-newer-link {
     float: none;
}
.pagenavi .current {
border-color: #C6C6C6;
background-color: #E9E9E9;
background-image: none;
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.20);
-ms-box-shadow: inset 0 1px 1px rgba(0,0,0,.20);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20);
}
.pagenavi a:active {
border-color: #C6C6C6;
background-color: #E9E9E9;
background-image: none;
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.20);
-ms-box-shadow: inset 0 1px 1px rgba(0,0,0,.20);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20);
}

وهكذا تكون قد إنتهيت من إضافة ترقيم الصفحات لمدونتك وأعلم ان الكثير يبحث عن هذه الطريقة وههي الآن متاحة

قد تواجه بعض العقبات في إيجاد الأكواد التي في الشرح وسيكون السبب قالبك لانه مبني بطريقة مختلفة

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

أتمنى ان يكون الشرح وافي وبسيط بالتوفيق للجميع

ودمتم في رعاية الله وحفظه

• فيسبوك
• تويرتر
• جوجل +
• لينكدين
واتساب

الكاتب : Unknown

مدون و مبرمج مغربي عمري 22 سنة أهتم بكل ما هو جديد في عالم التقنيات و الأنترنت طموحي مساعدة الأخرين في الوصول إلى المعلومة بأسهل طريقة ممكنة