انشاء فهرس لمدونات بلوجر بشكل احترافي

السلام عليكم ورحمة الله وبركاته اليوم حبيت اقدم لكم موضوع مهم لكل المدونات والموضوع هوة انشاء فهرس للمدونة بشكل احترافي طبعاً الشكل الذي راح اقدمه شكل احترافي بكل معنى الكلمة . أرشيف مدونتك يعتبر من أهم نقاط بناء مدونة ناجحة بحيث يتم تسجيل موضوعاتك حسب التاريخ ويوضح مدي انتاجيتك خلال الشهر وكذلك يرتب الموضوعات بطريقة تليق بتصفحها وتسهل على الزائر الحصول على المعلومة التى يبحث عنها. طريقة انشاء الفهرس سهل جداً تابع معي
مشاهدة الشكل طريقة انشاء فهرس لمدونتك
1- نذهب الى لوحة تحكم المدونة >> الصفحات >> انشاء صفحة جديدة
2- نضع الصفحة الجديدة من وضع التأليف الى 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://yemen-technology.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://yemen-technology.blogspot.com/ الى رابط مدونتك