اخر مواضيع عبدالصمد

عبدالصمد المازغي

شخص متواضع، مؤسس مدونة نجمة، مصمم مواقع و لديه نظرة عامة على أغلب لغات البرمجة، أقول لك مرحبا بك في نجمة صديقي

أفضل طريقة لإضافة ترقيم الصفحات إلى قوالب بلوجر

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

الطريقة تعمل بكفائة و بدون مشاكل على عكس البعض الاخر من الإضافات. فقط تابع معي الشرح.

◉ 1. قم بالتوجه إلى قالب ثم تحرير HTML ليفتح لك بعد ذالك الكود الخاص بالقالب الخاص بمدونتك.

◉ 2. ثم قم بالبحث عن الكود التالي و ذالك بالضغط على CTRL+F من لوحة المفاتيح.

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


◉ 3. بعد أن تجده قم بنسخ الكود التالي ثم وضعه بعده (أسفله) مباشرة.

<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>


◉ 4. كخطوة رابعة قم بالبحث عن الكود التالي : 

<b:include name='nextprev'/>



◉ 5. بعد أن تجد الكود السابق قم باستبداله بالكود التالي :

<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>



◉ 6. و كخطوة أخيرة، عليك أن تضيف الستايل : 

#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;
}
/*==== www.najmacode.com====*/
#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;
}


/*==== www.najmacode.com====*/
.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);

}


ملاحظة : طبعا يمكنك التحكم في الستايل و تعديله كما يحلو لك.

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

ليست هناك تعليقات:

إرسال تعليق

تخفيضات

قناة نجمة الرسمية

صفحة نجمة الرسمية

الأكثر تصفحا

جميع الدورات

{"type":"footer-slider","label":"جميع الدورات","posts_number":"12"}

نجمة :

أحيانًا، عليكَ أن تلقِ نظرة على ماضيك، وتبتسم برضا على ما وصلت إليه