السلام عليكم و رحمة الله و بركاته اليوم ان شاء الله ساقوم بشرح اضافة مهمة للمدونين الا و هي اضافة ترقيم الصفحات لمنصة البلوجر و هده الاضافة تساعدالزائر للوصول للمواضيع القديمة في المدونة

اسهل طريقة لتركيب الاضافة اتبع الخطوات التالية
اذهب الى المدونة
ثم الى تبويب تخطيط
html /javascript ثم اداة
و تضع الكود التالي داخل الاداة
و تضع الكود التالي داخل الاداة
<!--Page Navigation Starts By th3casablog.blogspot.com-->
<style> /*Pagination Style*/ .pagination { display:block; text-align: center !important; padding-left: 0px; overflow: hidden; margin-bottom: 20px; float:right; clear:right; } .pagination a, .pagination a:link, .pagination a:visited { background: url(../images/pages-num-bg.png); text-decoration: none; color:#666 !important; display: block; text-align: center; background: rgb(249,249,249); background: -moz-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -webkit-gradient(linear, right top, right bottom, color-stop(0%, rgba(249, 249, 249, 1)), color-stop(100%, rgba(234, 234, 234, 1))); background: -webkit-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -o-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -ms-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eaeaea', GradientType=0 ); background: linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); border: 1px solid #d6d6d6; text-shadow: 0px 0px 0px #fed4a8; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; display: block; float: right; padding: 7px 15px; margin-left: 7px; } .pagination a:hover { color: #666; background: #fff; } .pagination span.pages { display:none; } .pagination span.current { text-decoration: none; color:#fff !important; display: block; text-align: center; margin-left: 7px; background: rgb(223,115,9); background: -moz-linear-gradient(top, rgba(223, 115, 9, 1) 0%, rgba(207, 78, 7, 1) 100%); background: -webkit-gradient(linear, right top, right bottom, color-stop(0%, rgba(223, 115, 9, 1)), color-stop(100%, rgba(207, 78, 7, 1))); background: -webkit-linear-gradient(top, rgba(223, 115, 9, 1) 0%, rgba(207, 78, 7, 1) 100%); background: -o-linear-gradient(top, rgba(223, 115, 9, 1) 0%, rgba(207, 78, 7, 1) 100%); background: -ms-linear-gradient(top, rgba(223, 115, 9, 1) 0%, rgba(207, 78, 7, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#df7309', endColorstr='#eaeaea', GradientType=0 ); background: linear-gradient(top, rgba(223, 115, 9, 1) 0%, rgba(207, 78, 7, 1) 100%); border: 1px solid #a43900; text-shadow: 1px 1px 1px #823604; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; display: block; padding: 7px 15px; float: right; } .pagination span.extend { text-decoration: none; color:#666 !important; display: block; text-align: center; margin-left: 4px; background: rgb(249,249,249); background: -moz-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -webkit-gradient(linear, right top, right bottom, color-stop(0%, rgba(249, 249, 249, 1)), color-stop(100%, rgba(234, 234, 234, 1))); background: -webkit-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -o-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); background: -ms-linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eaeaea', GradientType=0 ); background: linear-gradient(top, rgba(249, 249, 249, 1) 0%, rgba(234, 234, 234, 1) 100%); border: 1px solid #d6d6d6; text-shadow: 0px 0px 0px #fed4a8; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; display: block; padding: 7px 15px; float: right; } </style> <div class='pagination'> <script type='text/javascript'> var pageNaviConf = { perPage: 8, numPages: 8, firstText: "الصفحة الأولى", lastText: "الصفحة الأخيرة", nextText: "»", prevText: "«" } //<![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] + '" class="inactive">' + pageNaviConf.prevText + "</a>" } for(i = c; i <= endPage; ++i) { if(i == e) { b += '<span class="current">' + i + "</span>" } else { b += '<a href="' + f[i] + '" class="inactive">' + i + "</a>" } } if(e < a) { b += '<a href="' + f[e + 1] + '">' + pageNaviConf.nextText + "</a>" } if(endPage < a) { b += '<a href="' + f[a] + '" class="inactive">' + 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> <!--Page Navigation Ends By th3casablog.blogspot.com--> |
و تحفظ الاضافة بدون عنوان
ثم تسحب الاضافة وتضعها اسفل صندوق التعليقات كما هو مبين في الصورة اسفله