كيفية اضافة كود اداة مواضيع ذات صله لمدونة بلوجر

كيفية اضافة كود اداة مواضيع ذات صله لمدونة بلوجر

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

اولا الشرح 

من لوحة التحكم الرئيسيه للمدونتك ادخلها من هــنــا

اختار قالب 

ثم تحرير HTML

ثم توسيع عناصر القالب

ابحث عن: </head>

ثم ضع فوقه الكود التالي:

<!--Related Posts with thumbnails Scripts and Styles Start-->

<!--  remove --><b:if cond='data:blog.pageType ==  &quot;item&quot;'>

<style type="text/css">

#related-posts  {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;

padding-left:5px;

}



#related-posts  h2{

font-size: 1.6em;

font-weight: bold;

color: black;

font-family:  Georgia, &#8220;Times New Roman&#8221;, Times, serif;

margin-bottom:  0.75em;

margin-top: 0em;

padding-top: 0em;

}

#related-posts  a{

color:black;

}

#related-posts a:hover{

color:black;

}



#related-posts   a:hover {

background-color:#d4eaf2;

}

</style>

<script  type='text/javascript'>

var  defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVoS79RgKVj3pV32OrKlxOoZcE73v-Bzl1rydNgpG6aQ5HBA_HtbCWwYMDehv96Qoq_EZRsHaklGFUNJMznR0UTpg16zOZJDFDog9j6kYmUOIEa31kunrl2EVok0gmHG-_vSOje91YmCQ/s400/noimage.png";

var  maxresults=5;

var splittercolor="#d4eaf2";

var  relatedpoststitle="مواضيع ذات صلة ";

</script>

<script    
src='http://egymodern.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js'
   type='text/javascript'/>

<!-- remove --></b:if>

<!--Related  Posts with thumbnails Scripts and Styles End--> 

ثم بعد ذالك قم بالبحث عن:  <div class='post-footer-line post-footer-line-1'>

ثم قم بوضع الكود التالي تحت الكود السابق:

  <!-- Related Posts with Thumbnails Code Start-->

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != &quot;true&quot;'>

</b:if>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + 
data:label.name + 
&quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;'
 type='text/javascript'/></b:loop>

<script type='text/javascript'>

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);

</script>

</div><div style='clear:both'/>

<!-- remove --></b:if> 

<!-- Related Posts with Thumbnails Code End-->

بالتوفيق ان شاء الله