اضافة فهرس المدونه

السلام عليكم

اضافة فهرس المدونه

  اليوم اقدم اضافه فهرس المدونه يضم عناوين موضوعات ومشاركات المدونة فمن الضرورى إنشاء خريطة تنظم الأقسام وما تضمه من مواضيع لتمكن الزائر من الإطلاع على محتوى المدونة بالكامل بطريقة مرتبة. فهى تنظم الموضوعات بجانب تواريخ النشر مع التسميات فى جدول يحدث أوتوماتيكيا عند نشر المشاركات.

طريقة التركيب

نذهب الى لوحة تحكم المدونة ← صفحه جديدة← HTML
ونضع هذا الكود

<div dir="rtl" style="text-align: right;" trbidi="on">
<style scoped="" type="text/css">#toc-outer {  color:black;  font:normal 11px/15px Arial,Sans-Serif;  height:auto;  margin:0 auto;  overflow:hidden;  padding:0;  text-align:right;}
#loadingscript {  padding:0px 0px;  height:37px;  text-indent:-9999px;  color:transparent;  background:white url('data:image/gif;base64,R0lGODlhEAALALMMAOXp8a2503CHtOrt9L3G2+Dl7vL0+J6sy4yew1Jvp/T2+e/y9v///wAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCwAMACwAAAAAEAALAAAEK5DJSau91KxlpObepinKIi2kyaAlq7pnCq9p3NZ0aW/47H4dBjAEwhiPlAgAIfkECQsADAAsAAAAAAQACwAABA9QpCQRmhbflPnu4HdJVAQAIfkECQsADAAsAAAAABAACwAABDKQySlSEnOGc4JMCJJk0kEQxxeOpImqIsm4KQPG7VnfbEbDvcnPtpINebJNByiTVS6yCAAh+QQJCwAMACwAAAAAEAALAAAEPpDJSaVISVQWzglSgiAJUBSAdBDEEY5JMQyFyrqMSMq03b67WY2x+uVgvGERp4sJfUyYCQUFJjadj3WzuWQiACH5BAkLAAwALAAAAAAQAAsAAAQ9kMlJq73hnGDWMhJQFIB0EMSxKMoiFcNQmKjKugws0+navrEZ49S7AXfDmg+nExIPnU9oVEqmLpXMBouNAAAh+QQFCwAMACwAAAAAEAALAAAEM5DJSau91KxlpOYSUBTAoiiLZKJSMQzFmjJy+8bnXDMuvO89HIuWs8E+HQYyNAJgntBKBAAh+QQFFAAMACwMAAIABAAHAAAEDNCsJZWaFt+V+ZVUBAA7') no-repeat 50% 50%;}
.itemposts {    float: right;    height: auto;    overflow: hidden;    width: 47%;    box-shadow: 1px 1px 5px #C3C3C3;    background: none repeat scroll 0% 0% #F9F9F9;    border: 1px solid #FFF;    margin: 3px 5px 8px;    padding: 0px 3px;}
.itemposts h6 {    border-bottom: 1px solid #CCC;    color: #333;    height: 15px;    overflow: hidden;    text-transform: none;    margin: 0px 0px 5px;    padding: 2px 6px !important;    font:bold 13px GE SS two medium;
}
.itemposts h6 a:hover {  color:#38f;  text-decoration:none;}
.itemposts img {  background-color:#fff;  border:1px solid #ccc;  -moz-border-radius:3px;  -webkit-border-radius:3px;  border-radius:3px;  float:right;  height:65px;  margin:0 0 5px 7px;  padding:3px;  width:65px;  z-indent:99999px;}
.itemposts .iteminside {  font-family: GE SS two medium;}  
.itemposts .itemfoot {    border-top: 1px solid #CCC;    clear: both;    overflow: hidden;    padding: 4px 5px;    font:12px GE SS two medium;}
.itemposts .itemfoot a.itemrmore {  color:#333;  float:left;  font-weight:bold;  text-decoration:none;}
.itemposts .itemfoot a.itemrmore:hover {text-decoration:underline}
#itempager {  clear:both;  padding:10px 0;}
#pagination,
#totalposts {  color:#000;  display:block;  font:12px GE SS two medium;  margin-bottom:10px;  text-align:center;  padding:0;}
#pagination span, #pagination a {    color: #FFF;    display: inline;    margin: 0px 1px;    padding: 2px 5px;    text-indent: 0px;    background-color: #068BC9;    background-image: linear-gradient(#068BC9 0%, #3161C2 50%, #3059AB 51%);    border: 1px solid #3161C2;    text-decoration: none;    border-radius: 10px;}#pagination a:hover {background-color:#333}
#pagination span.actual {background-color:black}
#pagination span.hidden {display:none}</style><script>var showPostDate   = true,    showComments   = true,    idMode         = true,    sortByLabel    = false,    labelSorter    = "JQuery",    loadingText    = "Loading...",    totalPostLabel = "عدد المواضيع:",    jumpPageLabel  = "الصفحة",    commentsLabel  = "التعليقات",    rmoreText      = "الموضوع كامل &#9658;",    prevText       = "Sebelumnya",    nextText       = "Berikutnya",    siteUrl        = "http://tec1new.blogspot.com/",    postPerPage   = 10,    numChars       = 150,    imgBlank       = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC";</script><script src="http://yourjavascript.com/1183493241/rifan-pagination.js"></script></div>

وقم بتغيير http://tec1new.blogspot.com الي رابط مدونتك