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


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

أضافة أداة ترقيم الصفحات للمدونات

1-قم بنسخ الكود التالي وقم بلصقه فوق كود <body> او قد تجدة بهذه الشكل
<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

<b:section id="settings">
  <b:widget id='HTML850' locked='true' title='Number Of Posts' type='HTML'>
    <b:includable id='main'>
      <b:if cond='data:content == &quot;&quot;'>
        <script type='text/javascript'>
        //<![CDATA[
        var pageNaviConf = {
            perPage: 8,
            numPages: 5,
            firstText: 'الاولى',
            lastText: 'الاخيرة',
            nextText: 'التالي',
            prevText: 'السابق'
        }
        $(window).bind("load", function() {
        $('.Label a').each(function() {
          var labelPage = $(this).attr('href');
          $(this).attr('href',labelPage + '?max-results=8');
        });
        });
         //]]>
        </script>
        <b:else/>
        &lt;script type=&#39;text/javascript&#39;&gt;
        var pageNaviConf = {
            perPage: <data:content/>,
            numPages: 9,
            firstText: &#39;الاولى&#39;,
            lastText: &#39;الاخيرة&#39;,
            nextText: &#39;التالي&#39;,
            prevText: &#39;لسابق&#39;
        }
        $(window).bind(&quot;load&quot;, function() {
        $(&#39;.Label a&#39;).each(function() {
          var labelPage = $(this).attr(&#39;href&#39;);
          $(this).attr(&#39;href&#39;,labelPage + &#39;?max-results=<data:content/>&#39;);
        });
        });
        &lt;/script&gt;
      </b:if>
    </b:includable>
  </b:widget>
</b:section>
2-قم بنسخ ولصق الكود التالي فوق كود ]]></b:skin>
.pagenavi a, .pagenavi span {
    font-family: Droid Arabic Naskh, tahoma;
    background: #eee;
    padding: 0 17px;
    line-height: 40px;
    display: inline-block;
    margin-left: 5px;
    border-radius: 3px;
}
.pagenavi .current, .pagenavi a:hover {
    background: #3498DB;
    color: #fff;
}
3-قم بالبحث عن الأكواد أو الشفرات التالية
<b:includable id='page-navi'>
قم بمسح جميع الأكواد التي تبدأ من البداية حتى النهاية

4-قم بأستبدال الأكواد أو الشفرات اعلاه التي قمت بالبحث عنها ومسحها في خطوة رقم (3) وعلى حسب القالب الذي تستخدمة واستبدلها بالرموز التالية

  <b:includable id='page-navi'>
<div class='pagenavi'>
<script type='text/javascript'>
//<![CDATA[
function pageNavi(o){var m=location.href,l=m.indexOf("/search/label/")!=-1,a=l?m.substr(m.indexOf("/search/label/")+14,m.length):"";a=a.indexOf("?")!=-1?a.substr(0,a.indexOf("?")):a;var g=l?"/search/label/"+a+"?updated-max=":"/search?updated-max=",k=o.feed.entry.length,e=Math.ceil(k/pageNaviConf.perPage);if(e<=1){return}var n=1,h=[""];l?h.push("/search/label/"+a+"?max-results="+pageNaviConf.perPage):h.push("/?max-results="+pageNaviConf.perPage);for(var d=2;d<=e;d++){var c=(d-1)*pageNaviConf.perPage-1,b=o.feed.entry[c].published.$t,f=b.substring(0,19)+b.substring(23,29);f=encodeURIComponent(f);if(m.indexOf(f)!=-1){n=d}h.push(g+f+"&max-results="+pageNaviConf.perPage)}pageNavi.show(h,n,e)}pageNavi.show=function(f,e,a){var d=Math.floor((pageNaviConf.numPages-1)/2),g=pageNaviConf.numPages-1-d,c=e-d;if(c<=0){c=1}endPage=e+g;if((endPage-c)<pageNaviConf.numPages){endPage=c+pageNaviConf.numPages-1}if(endPage>a){endPage=a;c=a-pageNaviConf.numPages+1}if(c<=0){c=1}var b='<span class="pages">الصفحة '+e+' من '+a+"</span> ";if(c>1){b+='<a href="'+f[1]+'">'+pageNaviConf.firstText+"</a>"}if(e>1){b+='<a href="'+f[e-1]+'">'+pageNaviConf.prevText+"</a>"}for(i=c;i<=endPage;++i){if(i==e){b+='<span class="current">'+i+"</span>"}else{b+='<a href="'+f[i]+'">'+i+"</a>"}}if(e<a){b+='<a href="'+f[e+1]+'">'+pageNaviConf.nextText+"</a>"}if(endPage<a){b+='<a href="'+f[a]+'">'+pageNaviConf.lastText+"</a>"}document.write(b)};(function(){var b=location.href;if(b.indexOf("?q=")!=-1||b.indexOf(".html")!=-1){return}var d=b.indexOf("/search/label/")+14;if(d!=13){var c=b.indexOf("?"),a=(c==-1)?b.substring(d):b.substring(d,c);document.write('<script type="text/javascript" src="/feeds/posts/summary/-/'+a+'?alt=json-in-script&callback=pageNavi&max-results=99999"><\/script>')}else{document.write('<script type="text/javascript" src="/feeds/posts/summary?alt=json-in-script&callback=pageNavi&max-results=99999"><\/script>')}})();
//]]>
</script>

        <div class='clear'/>
    </div>

        </b:includable>
5-قم بالبحث عن الكود التالي <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>

6-قم بعملية حفظ القالب وشاهد النتيجة.

*وختاما هذه المقالة لكل الأشخاص الذين يرغبون بأضافة أداة ترقيم الصفحات لمدونات بلوجر وفي اخر الموضوع لاتنسى المشاركة والتعليق لكي تحفزنا اكثر على الأستمرار.

0 تعليق

إرسال تعليق