اضافة فهرس رائع لمدونات البلوجر

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

من اهم صفحات التي يجب ان يضمها موقعك هي خريطة الموقع (الفهرس) لانها تسهل على الزائر تصفح بين التدوينات
براحة وفهرس اليوم يتميز عن اي فهرس اخر لانه
يحتوي على محرك بحث حسب الكلمات الدلالية ،
البحث حسب التسميات ، والبحث بين احدث المواضيع
و مواضيع جديدة ومن اهم ميزاته متجاوب مع جميع الشاشات.

من مميزات الفهرس :

1.متجاوب

2.محرك بحث

3.عرض مواضيع بشكل جميل

4.عرض مواضيع بالتسمية

شرح طريقة التركيب:

قم بالذهاب الى صفحة جديدة و التقل الى html و امسح الاكواد الموجدودة و ضع

هذه الالكواد و قم بالحفظ

<div dir="rtl" style="text-align: right;" trbidi="on">
<style>
/* libya-web.blogspot.com CSS Sitemap */
#table-outer table{width:100%;margin:0;padding:0}
#table-outer input,#table-outer select{padding:4px;font:inherit;border:2px solid #ecf0f1;width:170px;box-sizing:border-box}
#table-outer select{cursor:pointer;outline:none}
#table-outer input:focus{outline:none}
#resultDesc{margin-bottom:10px}
#feedContainer{overflow:hidden;margin-top:20px}
#feedContainer strong{font-size:10px}
#feedContainer,#feedContainer li{padding:0;margin:0;list-style:none}
#feedContainer li{float:right;width:50%;margin-bottom:10px;position:relative;z-index:0}
#feedContainer .inner{padding:8px;margin:0 5px;position:relative;background-color:#fff;border:1px solid #f9f9f9;height:133px}
#feedContainer img{float:right;margin:0 0 0 8px;max-width:100%;border:1px solid #f9f9f9;padding:2px}
#feedContainer .toc-title{max-height:33px;overflow:hidden}
#feedContainer .toc-title:hover{text-decoration:underline}
#feedContainer .news-text{font-size:11px}
#feedNav a,#feedNav span{display:block;text-align:center;color:#fff;text-decoration:none;background-color:#444;padding:5px;width:95%;margin:0 auto;transition:all 0.3s linear}
#feedNav a,#feedNav span:hover{background-color:#333;transition:all 0.3s linear}
#feedContainer .date{display:none;position:absolute;bottom:0;left:0;background-color:transparent;color:#fff;font-size:9px;padding:3px 2px;width:35px}
#feedContainer .date .dd{font-size:9px;line-height:5px;font-weight:bold}
#feedContainer .date span{display:inline-block;line-height:5px;text-align:center;margin-right:5px}
/* libya-web.blogspot.com */
</style>
<div id="table-outer">
<table><tbody>
<tr><td><label>ترتيب المشاركات حسب</label></td><td><select id="orderFeedBy"><option selected="" value="published">مواضيع جديدة</option><option value="updated">آخر تحديث</option></select></td></tr>
<tr><td><label>أقسام </label></td><td><span id="labelSorter"><select disabled=""><option selected="">إنتظر...</option></select></span></td></tr>
<tr><td><label>البحث بواسطة الكلمات الدلالية </label></td><td><form id="postSearcher">
<input type="text" /></form>
</td></tr>
</tbody></table>
</div>
<br />
<br />
<br />
<header id="resultDesc"></header>
<br />
<ul id="feedContainer"></ul>
<div id="feedNav">
إنتظر...</div>
<script src="https://rawgit.com/aseel90/libya-web/master/sitemap1.js" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>
</div>

و شكرا

تحرير المقال