إضافة فهرس على شكل خط زمني لمدونتك l مع طريقة التركيب والتعديل
السلام عليكم ، أهلا بكم ، اليوم في تدوينة جديد مع إضافة بلوجر إحترافية وهي فهرس مع خط زمني ولكل تسمية ، طريقة إضافتها سهلة ولا تتطلب وقت لتجعل من المقلات منضمة تابع معى

طريقة التركيب
- إذهب الى المظهر ثم اختر تعديل HTML
- إبحث عن </head>
- وضع الكود التالي فوقه
- إذهب الى الصفحات وأنشاء صفحة جديدة اختر نظام HTML
- وقم بمسح جميع الأكواد وضف هذا [sitemap]
<b:if cond='data:blog.pageType == "static_page"'> <style type='text/css'> *,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} .itheric-sitemap{position:relative;margin:30px auto;text-align:right;} .itheric-toc-wrap{display:inline-block;width:100%} .itheric-toc-wrap .itheric-cat{background:#fff;border-radius:2px;color:#333;font-size:15px;font-weight:700;padding:10px 20px;border:4px solid #333;text-transform:capitalize} .itheric-toc::before{background:#333;bottom:0;content:'';left:20%;margin-left:-10px;position:absolute;top:0;width:4px} .itheric-toc{margin:0;padding:30px 20px;position:relative} .itheric-sitemap ul.itheric-toc{margin:0;padding:30px 0;list-style-type:none} .itheric-toc li{list-style:none;margin:0;padding:0;position:relative} .itheric-toc > li .toc-date{color:#999;display:block;font-size:14px;font-weight:bold;position:absolute;text-transform:uppercase;top:25px;width:15%} .itheric-toc > li .itheric-icon{background:#fff;border-radius:50%;box-shadow:0 0 0 4px #333;color:#fff;font-size:1.4em;font-style:normal;font-variant:normal;font-weight:normal;height:10px;left:21.8%;line-height:10px;margin:0 0 0 -25px;position:absolute;text-align:center;text-transform:none;top:30px;width:10px} .itheric-toc > li .itheric-post::after{border-color:transparent #f5f5f5 transparent transparent;border-style:solid;border-width:10px;content:'';height:0;pointer-events:none;position:absolute;right:100%;top:auto;width:0} .itheric-toc > li .itheric-post{background:#f5f5f5;border-radius:5px;display:block;font-size:15px;margin:0 0 15px 23%;padding:25px 30px;position:relative} .itheric-toc > li .itheric-post a{color:#333;font-weight:700} .itheric-toc > li:last-child .itheric-post{margin:0 0 0 23%} .itheric-toc > li .itheric-post a:hover{color:#999} </style> <script type='text/javascript'> /*<![CDATA[*/ $(document).ready(function(){var static_page_text=$.trim($(".post-body").text());var text_month=[," / 1 / "," / 2 / "," / 3 / "," / 4 / "," / 5 / "," / 6 / "," / 7 / "," / 8 / "," / 9 / "," / 10 / "," / 11 / "," / 12 / "];if(static_page_text==="[sitemap]"){var postbody=$(".post-body");$.ajax({url:"/feeds/posts/default?alt=json-in-script",type:"get",dataType:"jsonp",success:function(e){var t=[];for(var n=0;n<e.feed.category.length;n++){t.push(e.feed.category[n].term)}var t=t.join("/");postbody.html('<div class="itheric-sitemap"></div>');$(".post-body .itheric-sitemap").text(t);var r=$(".itheric-sitemap").text().split("/");var i="";for(get=0;get<r.length;++get){i+="<span>"+r[get]+"</span>"}$(".itheric-sitemap").html(i);$(".itheric-sitemap span").each(function(){var e=$(this);var t=$(this).text();$.ajax({url:"/feeds/posts/default/-/"+t+"?alt=json-in-script",type:"get",dataType:"jsonp",success:function(n){var r="";var i='<ul class="itheric-toc">';for(var s=0;s<n.feed.entry.length;s++){for(var o=0;o<n.feed.entry[s].link.length;o++){if(n.feed.entry[s].link[o].rel=="alternate"){r=n.feed.entry[s].link[o].href;break}}var u=n.feed.entry[s].title.$t;var a=n.feed.entry[s].published.$t,f=a.substring(0,4),l=a.substring(5,7),c=a.substring(8,10),h='<span class="day">'+c.replace(/^0+/,"")+'</span><span class="month">'+text_month[parseInt(l,10)]+' </span><span class="year">'+f+"</span>";i+='<li><div class="toc-date">'+h+'</div><div class="itheric-icon"></div><span class="itheric-post"><a href="'+r+'">'+u+"</a></span></li>"}i+="</ul>";e.replaceWith('<div class="itheric-toc-wrap"><div class="itheric-cat">'+t+'</div>'+i+"</div>")}})})}})}}); /*]]>*/ </script> </b:if>
و مبروك عليك الإضافة
المصدر
المصدر
