اضافة شريط التسلسل Breadcrumb فى بلوجر

اذا كنت ترغب فى ان تكون مدون محترف فانك بالتأكيد تحتاج الى هذا الشريط الذى يظهر لك كم مدونتك جميلة من حيث الترتيب. مثل اغلب واكثر...

اذا كنت ترغب فى ان تكون مدون محترف فانك بالتأكيد تحتاج الى هذا الشريط الذى يظهر لك

كم مدونتك جميلة من حيث الترتيب. مثل اغلب واكثر المواقع شهرة ومدونات الوردبريس يمكنك الان

اضافة شريط التسلسل الى مدونتك بطريقة سهلة عن طريق اكواد CSS

مثال 

الرئيسية >> اسم القسم >> عنوان التدوينة

- كيفية اضافة شريط التسلسل او ما يسمى بBreadcrumb

 - قم بالتوجه الى بلوجر > القالب > تعديل القالب > توسيع القالب

- قم بالبحث عن الوسوم التالى:

<b:include data='top' name='status-message'/>

اسفل الوسوم قم بلصق هذا الكود

<b:include data='posts' name='breadcrumb'/>

قد تجد اكثر من وسوم تبحث عنه فى قالبك لذا يجب عليك لصق الكود 

اسفل الاخر

الان ابحث عن هذا الوسوم

<b:includable id='main' var='top'>

اعلى هذا الوسوم قم بلصق الكود التالى :

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

الان وقت اضافة كود CSS ويمكنك تغيير ما تود تغييرة 

فى هذا الكود (اذا كان لديك معرفة ب CSS)

 قم بالبحث عن الوسوم التالى

]]></b:skin>

اضف الكود التالى فوق الوسوم

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:90%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
font-weight:bold;
}

 الان قم بحفظ القالب ويكون قد تمت اضافة شريط التسلسل بنجاح فى مدونتك