-->

تقنية ، إنترنت ، برامج ، إسلامية ، إقتصادية ، إجتماعية ، تعليمية ، رياضية

سُبْحَانَ اللَّهِ وَبِحَمْدِهِ ... سُبْحَانَ اللَّهِ العَظَيم

السبت، 1 فبراير 2014

كيفية ترقيم صفحات مدونة بلوجر(1)

كيفية ترقيم صفحات مدونة بلوجر(1)



لكي نضيف أداة ترقيم الصفحات تعمل بشكل تلقائى فور اضافتها ، وتتناسب مع جميع تصميمات وقوالب بلوجر يتم إتباع الخطوات التالية ، مع ضرورة أخذ نسخة إحتياطية من القالب قبل عمل أي تغير :
1- إذهب إلى لوحة التحكم .
2- نضغط على كلمة تخطيط من القائمة الجانبية .
3- يتم الضغط على إضافة أداء جديدة  ثم نختار  الأداة HTML/Java Script
وذلك كما هو موضح بالصورة التالية :




4- بعد أن نختار  الأداة  HTML/Java Script   نضع بداخلها  هذا الكود :
<style type="text/css">
#blog-pager{padding:5px 0 !important;}
.showpageArea {font-weight: bold;margin:5px;}/* www.tebaaa.blogspot.com */
.showpageArea a {text-decoration:underline;color: #fff;}/* www.tebaaa.blogspot.com */
.showpageNum  a, .showpage a {color: #fff;text-decoration:none;border:1px  solid  #999;-webkit-border-radius:3px;-moz-border-radius:3px;margin:0   3px;padding:3px 5px; background: #EFA347; background:   -moz-linear-gradient(top, #EFA347 0%, #F49520 50%, #E07F08 51%, #eb6105   100%); background: -webkit-gradient(linear, left top, left bottom,   color-stop(0%,#EFA347), color-stop(50%,#F49520),   color-stop(51%,#E07F08), color-stop(100%,#eb6105)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFA347',   endColorstr='#eb6105',GradientType=0 ); }/* www.tebaaa.blogspot.com*/
.showpageNum  a:hover, .showpage a:hover {border: 1px solid #ccc;  background:  #6db3f2; background: -moz-linear-gradient(top, #6db3f2 0%,  #54a3ee 50%,  #3690f0 51%, #1e69de 100%); background:  -webkit-gradient(linear, left  top, left bottom, color-stop(0%,#6db3f2),  color-stop(50%,#54a3ee),  color-stop(51%,#3690f0),  color-stop(100%,#1e69de)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2',   endColorstr='#1e69de',GradientType=0 ); } /* www.tebaaa.blogspot.com */
.showpagePoint  {color: #aaaaaa;text-decoration:none;border:1px solid   #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0   3px;padding:3px 5px; background: #e2e2e2; background:   -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe   100%); background: -webkit-gradient(linear, left top, left bottom,   color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb),   color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); filter:   progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',   endColorstr='#fefefe',GradientType=0 ); }/* www.tebaaa.blogspot.com */
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}/* www.tebaaa.blogspot.com*/
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}/* www.tebaaa.blogspot.com */
</style>
<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=3;
var numshowpage=6;
var upPageWord ='التالي';
var downPageWord ='السابق';
</script>
<script src='http://uinegy.googlecode.com/svn/wiki/uniegy_bloggerpagenavi.js' type='text/javascript'></script>

5- نضغط على زر حفظ  الموجود أسفل الأداة  HTML/Java Script   .

وبذلك تظهر هذه القائمة في المكان الذي أنت إخترته .

مع ملاحظة أن الكود السابق به التخصيصات الآتية  :

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

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

إرسال تعليق