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

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

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

لتركيب الإضافة فقط ابحث عن الكود التالي

<b:includable id='post' var='post'>

وأضف بعده مباشرة الكود التالي

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#cnmumasar {
  background-color: #ddd;
  display: block;
  font-size: 12px;
  margin: 10px 0;
  padding: 5px 0;
  width: 100%;
}
#cnmumasar .masarhome {
  background: url("https://lh3.googleusercontent.com/-CnMJ5rXyu10/VR7MIGHMNKI/AAAAAAAAAQE/V9TBcMTIoC8/s16/home.png") no-repeat scroll right center rgba(0, 0, 0, 0);
  color: #000;
  float: right;
  margin: 0 10px 0 5px;
  padding: 0 20px 0 0;
}
#cnmumasar .masarhome:hover {color:#555;}
#cnmumasar .post-labels {
  background: url("https://lh6.googleusercontent.com/-27rhGHNvBa4/VR7MIFVbJUI/AAAAAAAAAQQ/iX8Hq7rNk94/s16/attach_2.png") no-repeat scroll right center rgba(0, 0, 0, 0);
  padding-right: 20px;
}
#cnmumasar .post-labels a {
  background-color: #000;
  border-radius: 2px;
  color: #fff;
  display: inline-block;
  float: none;
  font-size: 10px;
  font-weight: bold;
  padding: 0 3px 2px;
}
#cnmumasar .post-labels a:hover {background-color:#555;}
#cnmumasar .masartitle {
  background: url("https://lh5.googleusercontent.com/-g9j2SOHg6sE/VR7MIPJOXbI/AAAAAAAAAQM/A3V1gTwxbtU/s16/text.png") no-repeat scroll right center rgba(0, 0, 0, 0);
  color: #555;
  padding-right: 20px;
}
</style>
<div id="cnmumasar">
<span><a class='masarhome' href='/'>الرئيسية</a></span>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:loop>
</b:if>
</span>
<span class='masartitle'><data:post.title/></span>
</div>
</b:if>

التنسيق

هذا #ddd هو لون الخلفية
هذا 12 هو حجم الخط
هذا #000 لون رابط الرئيسية
هذا #000 لون خلفية الأقسام
هذا 10 حجم خط روابط الأقسام
هذا #555 لون خلفية الأقسام عند تمرير الماوس
أما الثلاث روابط المعلمة باللون الوردي هي روابط الأيقونات غيرها بروابط أخرى مناسبة يفضل ان يكون حجمها 16x16
وبالتوفيق