إضافه وبرمجه - الترقيم الصفحات Trekam
البحث عن ]]></b:skin> فوقه ازرق باسود مستطيل .Label a{ background: rgb(0,100,180); background: -moz-linear-gradient(top, rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%); background: -webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(0,100,180,1)),color-stop(100%,rgba(20,60,100,1))); background: -webkit-linear-gradient(top, rgba(0,100,180,1)0%,rgba(20,60,100,1) 100%); background: -o-linear-gradient(top, rgba(0,100,180,1)0%,rgba(20,60,100,1) 100%); background: -ms-linear-gradient(top, rgba(0,100,180,1)0%,rgba(20,60,100,1) 100%); background: linear-gradient(top, rgba(0,100,180,1)0%,rgba(20,60,100,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0064b4', endColorstr='#123d60',GradientType=0 ); display:inline-block;border: 1px solid #005ca6;padding:0 8px;color:#fff!important; height:28px; line-height:28px;text-transform:capitalize;text-decoration:none;float:left;margin-top:5px;font-size:14px;-webkit-transition:all .4sease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all.4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all.4s ease-in-out;text-shadow: 0 -1px -1px rgba(0, 0, 0, 0.2); } .Label a:hover{color:#000 !important; background:#123d60;} او ازرق ورصاصي #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;} .blog-pager {background: none;} .displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;} .displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#359BED;text-decoration:none;color: #fff;} #blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#359BED;} .showpageOf{display:none!important} #blog-pager .pages{border:none;} البحث عن </body> فوقه <b:if cond='data:blog.pageType != "item"'> <b:if cond='data:blog.pageType != "static_page"'> <script type='text/javascript'> /*<![CDATA[*/ var perPage=9; var numPages=6; var firstText ='اولا'; var lastText ='الاخير'; var prevText ='« سابق'; var nextText ='التالي »'; var urlactivepage=location.href; var home_page="/"; if(typeof firstText=="undefined")firstText="First";if(typeoflastText=="undefined")lastText="Last";var noPage;var currentPage;varcurrentPageNo;var postLabel;pagecurrentg();functionlooppagecurrentg(pageInfo){var html='';pageNumber=parseInt(numPages/ 2);if(pageNumber==numPages-pageNumber){numPages=pageNumber*2+1} pageStart=currentPageNo-pageNumber;if(pageStart<1)pageStart=1;lastPageNo=parseInt(pageInfo/ perPage)+1;if(lastPageNo-1==pageInfo /perPage)lastPageNo=lastPageNo-1;pageEnd=pageStart+numPages-1;if(pageEnd>lastPageNo)pageEnd=lastPageNo;html+="<spanclass='showpageOf'>Page "+currentPageNo+' of'+lastPageNo+"</span>";varprevNumber=parseInt(currentPageNo)-1;if(currentPageNo>1){if(currentPage=="page"){html+='<spanclass="showpage firstpage"><ahref="'+home_page+'">'+firstText+'</a></span>'}else{html+='<spanclass="displaypageNum firstpage"><ahref="/search/label/'+postLabel+'?&max-results='+perPage+'">'+firstText+'</a></span>'}} if(currentPageNo>2){if(currentPageNo==3){if(currentPage=="page"){html+='<spanclass="showpage"><ahref="'+home_page+'">'+prevText+'</a></span>'}else{html+='<spanclass="displaypageNum"><ahref="/search/label/'+postLabel+'?&max-results='+perPage+'">'+prevText+'</a></span>'}}else{if(currentPage=="page"){html+='<spanclass="displaypageNum"><a href="#"onclick="redirectpage('+prevNumber+');returnfalse">'+prevText+'</a></span>'}else{html+='<spanclass="displaypageNum"><a href="#"onclick="redirectlabel('+prevNumber+');returnfalse">'+prevText+'</a></span>'}}} if(pageStart>1){if(currentPage=="page"){html+='<spanclass="displaypageNum"><ahref="'+home_page+'">1</a></span>'}else{html+='<spanclass="displaypageNum"><ahref="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}} if(pageStart>2){html+=' ... '} for(varjj=pageStart;jj<=pageEnd;jj++){if(currentPageNo==jj){html+='<spanclass="pagecurrent">'+jj+'</span>'}elseif(jj==1){if(currentPage=="page"){html+='<spanclass="displaypageNum"><ahref="'+home_page+'">1</a></span>'}else{html+='<spanclass="displaypageNum"><ahref="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}}else{if(currentPage=="page"){html+='<spanclass="displaypageNum"><a href="#"onclick="redirectpage('+jj+');returnfalse">'+jj+'</a></span>'}else{html+='<spanclass="displaypageNum"><a href="#"onclick="redirectlabel('+jj+');return false">'+jj+'</a></span>'}}} if(pageEnd<lastPageNo-1){html+='...'} if(pageEnd<lastPageNo){if(currentPage=="page"){html+='<spanclass="displaypageNum"><a href="#"onclick="redirectpage('+lastPageNo+');returnfalse">'+lastPageNo+'</a></span>'}else{html+='<spanclass="displaypageNum"><a href="#"onclick="redirectlabel('+lastPageNo+');returnfalse">'+lastPageNo+'</a></span>'}} varnextnumber=parseInt(currentPageNo)+1;if(currentPageNo<(lastPageNo-1)){if(currentPage=="page"){html+='<spanclass="displaypageNum"><a href="#"onclick="redirectpage('+nextnumber+');returnfalse">'+nextText+'</a></span>'}else{html+='<spanclass="displaypageNum"><a href="#"onclick="redirectlabel('+nextnumber+');returnfalse">'+nextText+'</a></span>'}} if(currentPageNo<lastPageNo){if(currentPage=="page"){html+='<spanclass="displaypageNum lastpage"><a href="#"onclick="redirectpage('+lastPageNo+');returnfalse">'+lastText+'</a></span>'}else{html+='<spanclass="displaypageNum lastpage"><a href="#"onclick="redirectlabel('+lastPageNo+');returnfalse">'+lastText+'</a></span>'}} var pageArea=document.getElementsByName("pageArea");varblogPager=document.getElementById("blog-pager");for(varp=0;p<pageArea.length;p++){pageArea[p].innerHTML=html} if(pageArea&&pageArea.length>0){html=''} if(blogPager){blogPager.innerHTML=html}} function totalcountdata(root){var feed=root.feed;vartotaldata=parseInt(feed.openSearch$totalResults.$t,10);looppagecurrentg(totaldata)} function pagecurrentg(){varthisUrl=urlactivepage;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}} if(thisUrl.indexOf("?q=")==-1&&thisUrl.indexOf(".html")==-1){if(thisUrl.indexOf("/search/label/")==-1){currentPage="page";if(urlactivepage.indexOf("#PageNo=")!=-1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1} document.write("<scriptsrc=\""+home_page+"feeds/posts/summary?max-results=1&alt=json-in-script&callback=totalcountdata\"><\/script>")}else{currentPage="label";if(thisUrl.indexOf("&max-results=")==-1){perPage=20} if(urlactivepage.indexOf("#PageNo=")!=-1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1} document.write('<scriptsrc="'+home_page+'feeds/posts/summary/-/'+postLabel+'?alt=json-in-script&callback=totalcountdata&max-results=1"><\/script>')}}} functionredirectpage(numberpage){jsonstart=(numberpage-1)*perPage;noPage=numberpage;varnameBody=document.getElementsByTagName('head')[0];varnewInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)} functionredirectlabel(numberpage){jsonstart=(numberpage-1)*perPage;noPage=numberpage;varnameBody=document.getElementsByTagName('head')[0];varnewInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary/-/"+postLabel+"?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)} function finddatepost(root){post=root.feed.entry[0];vartimestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);vartimestamp=encodeURIComponent(timestamp1);if(currentPage=="page"){varpAddress="/search?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage}else{varpAddress="/search/label/"+postLabel+"?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage} location.href=pAddress} /*]]>*/ </script> </b:if> </b:if> |
صوره وكود |
blog-pagerlone1 + blog-pagerlone1 / blog-pagerlone2 +blog-pagerlone2 / blog-pagerlone3 + blog-pagerlone3 / blog-pagerlone4 + blog-pagerlone4 / blog-pagerlone5 + blog-pagerlone5 |
blog-pagerlone6 + blog-pagerlone6 / blog-pagerlone7 + blog-pagerlone7 / blog-pagerlone8 + blog-pagerlone8 |
تطبيق اخر |
البحث div#blog-pager{display:none} ما يهم هههه البحث عن ]]></b:skin> اضافه هذا فوقه #blog-pager, .blog-pager{display:block;padding:5px 0;} .showpage a,.pagenumber a,.totalpages{ position:relative;display: inline-block;padding:5px 10px;margin:0 2px;background:#eeeded;color:#170017; border:1px solid#eaeaea;font-size:14px;border-radius:2px;transition:all .3s; } .current{background-color:#9E267D;padding:5px 10px;color:white;margin:0 2px;border:1px solid #eaeaea;font-size:14px;border-radius:2px;} .showpage a:hover,.pagenumber a:hover{background:#2b5a97;color:#fff;text-decoration:none;} والبحث عن </body> فوقه <b:if cond='data:blog.pageType == "index"'> <script type='text/javascript'> //<![CDATA[// var postperpage=3; var numshowpage=4; var prevpage ='السابق'; var nextpage ='التالي'; var urlactivepage=location.href; var home_page="/"; //]]> </script> <script src='https://cdn.rawgit.com/xomisse/ac8ccfa4b8fb2c26d5cf76270db92201/raw/f957494b1691cce3d5a8cb92e5b4ed57cded9729/pagination.js'/> </b:if> |
تطبيق اخر |
البحث </body> فوقه <script src='https://cdn.jsdelivr.net/gh/codatey/cdt-pagination@1.2.2/dist/cdt-pagination.min.js'/> البحث </head> فوقه اختر احدهم ]]></b:skin> شرح تخصيص الإضافة هذا الجزء من الشرح يحتاج القليل من الخبرة في الجافاسكربت. يمكنك تخصيص مكونات الإضافة بإستعمال المتغير paginationConfig حيث يتم وضعه قبل سكربت أداة الترقيم، هذا المتغير يحتوي على الإعدادات التي سيتم تطبيقها على أداة الترقيم، كمثال : var paginationConfig = { perPage: 10, showNav: true, text_next: "الصفحة التاليه", }; في هذا المثال قمنا بتحديد 3 إعدادات هي perPage و showNav و text_next، كل إعداد والوظيفة التي يقوم بها. ستجد كل الإعدادات وشرحها في الأسفل blog-pagerl css blog-pagerl js |
blog-pagerl1 + blog-pagerl1 / blog-pagerl2 + blog-pagerl2 / blog-pagerl3 + blog-pagerl3 |