السبت، 6 أكتوبر 2012

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

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

هذا هو الكود الذي تم البحث عنه في المرة الاولي </body>
وضع قبله مباشرة هذا الكود      <!--  Start :  Page Navigation -->

<script type='text/javascript'>;
var home_page=&#39;/&#39;;
var urlactivepage=location.href;
var postperpage=1;
var numshowpage=6;
var upPageWord =&#39;السابق&#39;;
var downPageWord =&#39;التالي&#39;;
</script>;
<script src='http://sites.google.com/site/javacodehtml/Page-Navigation.js' type='text/javascript'/>

        <!--  End :  Page Navigation -->


وقم بالبحث مرة اخري عن هذا الكود  ]]></b:skin>

ومباشرة ضع قبله هذا الكود

 /* Start :  Page Navigation */
.blog-pager,#blog-pager{
  font-family:"Times New Roman", Times, serif;
  font-weight:normal;
  font-size:15px;
  width:500px;
  padding:10px;
}
.showpageNum a,.showpage a {
  background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitwSuIKlEerNOGuzNSI6mmJJG0c4FINq1ZhhsXcG4GXSqnW5VOE47kbpz9_-FyGRy8SSDjbVH1bLePj8ppmTsedNhcWO6aGk2ZHVi07G_ZghPoWBdDsRduICke2y0NqbDN5H68u_5MaYY/s1600/wp1.jpg') repeat-x -6px 0px;
  border:1px solid #97a7af;
  text-decoration:none;
  color:#ffffff;line-height:14px;cursor:pointer;white-space:nowrap;
  -webkit-border-radius:3px;-moz-border-radius:3px;font-weight:bold; margin-left:1px; margin-right:1px; margin-top:0px; margin-bottom:0; padding-left:8px; padding-right:8px; padding-top:3px; padding-bottom:3px
  }
.showpageNum a:hover,.showpage a:hover {
  background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitwSuIKlEerNOGuzNSI6mmJJG0c4FINq1ZhhsXcG4GXSqnW5VOE47kbpz9_-FyGRy8SSDjbVH1bLePj8ppmTsedNhcWO6aGk2ZHVi07G_ZghPoWBdDsRduICke2y0NqbDN5H68u_5MaYY/s1600/wp1.jpg') repeat-x -6px -36px;
  border:1px solid #97a7af;color:#ffffff;text-decoration:none
  }
.showpageOf{
  margin:0 8px 0 0;
  display: none;
  }
.showpagePoint {
  background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitwSuIKlEerNOGuzNSI6mmJJG0c4FINq1ZhhsXcG4GXSqnW5VOE47kbpz9_-FyGRy8SSDjbVH1bLePj8ppmTsedNhcWO6aGk2ZHVi07G_ZghPoWBdDsRduICke2y0NqbDN5H68u_5MaYY/s1600/wp1.jpg') repeat-x -6px -36px;
  margin:0 3px;line-height:14px;cursor:pointer;white-space:nowrap;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #97a7af;color:#ffffff;text-decoration:none;font-weight:bold; padding-left:8px; padding-right:8px; padding-top:3px; padding-bottom:3px
  }

        /* End :  Page Navigation */
ومبروك عليكم الاضافة .

0 التعليقات:

إرسال تعليق

اضافات بلوجر