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

بسم الله الرحمن الرحيم , السلام عليكم ورحمة الله وبركاته , في هذه التدوينة سنشرح كيفية اضافة أداة "مواضيع ذات صلة" وهي مهمة وأساسية جدا في أي مدونة ناجحة لأنها تجعل الزائر يبقى في المدونة أكبر وقت ممكن , لأن الزائر عندما ينتهي من قراءة التدوينة فانه سيرى أمامه 3 أو 4 تدوينات في الموضوع نفسه الذي فيه التدوينة التي قرأها وبالتالي سيضغط على أحد هذه التدوينات ويقرأها وعندئذ يبقى الزائر في المدونة وقتا أكبر.
وأما عن كيفية إضافتها فلدينا الكثير من الطرق سنشرح واحدة منها والتي أرى أنها الأنسب :
1- قم بالدخول الى لوحة التحكم الخاصة بمدونتك ثم اضغط على "قالب" وقم بأخذ نسخة احتياطية للقالب ثم اضغط على "تحرير HTML"
2- قم بالضغط على "تنسيق النموذج"
3- قم بالضغط على  Ctrl + F 
4- قم بالبحث عن الكود التالي :

</head>

5- قم باضافة الكود التالي فوق الكود السابق مباشرة

 <!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove -->
<style type='text/css'>
#related-posts {
float:right;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial Narrow;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
border-right: 1px dotted #DDDDDD;
color:#5D5D5D;
}
#related-posts a:hover{
color:black;
background-color:#EDEDEF;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSHFnvPnmTdiHXVqnGswY_9CrosbIUPA8hZBS2e_pBwvzHvduvOfOwUgzhzRR-EOM5CUO49nyPyJog5h2hWeIlz9bjAOKBxlEDwHSyxfweRTi9tNIsMk2F4_WFZMDEDOX_r0e4_dYqVO7r/s1600/no_image.jpg&quot;;
var maxresults=5;
var splittercolor=&quot;#DDDDDD&quot;;
var relatedpoststitle=&quot;مواضيع ذات صلةs&quot;;
</script>
<script src='http://helplogger.googlecode.com/svn/trunk/related-posts-with-big-thumbnails.js' type='text/javascript'/>
<!-- remove -->
<!--Related Posts with thumbnails Scripts and Styles End-->

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

 <data:post.body/>

ملاحظة : إذا عثرت على أكثر من نتيجة فستكون النتيجة المطلوبة هي الثانية
وقم بلصق الكود التالي بعد الكود السابق

 <!-- Related Posts with Thumbnails Code Start-->
<!-- remove -->
<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:right'/>
<!-- remove -->
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://anas-eds.blogspot.com'><img alt='Blogger Tricks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibRyQwoKTAb62w0x2T9o9MKp8gy6WWYXpfuquipi-dWByfbELYycELYfyweIkbApm9GK5uMLUVy0rRAUV44xOwhwzqiZllCwWB8lgBiwEKyB2Hvr04iUcUcxROa2Mwn_YRWVuGBsDJYZfL/s1600/best+blogger+tips.png'/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

تحديث :  
اذا اردت ان تظهر الأداة في صفحات التدوينات (المواضيع) فقط فعليك ان تقوم باضافة الكود التالي بدلا عن الكود السابق :

 <!-- Related Posts with Thumbnails Code Start-->
<!-- remove -->
<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:right'/>
<!-- remove -->
<b:if cond='data:blog.pageType == "item"'><b:if cond='data:post.isFirstPost'>
<a href='http://anas-eds.blogspot.com'><img alt='Blogger Tricks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibRyQwoKTAb62w0x2T9o9MKp8gy6WWYXpfuquipi-dWByfbELYycELYfyweIkbApm9GK5uMLUVy0rRAUV44xOwhwzqiZllCwWB8lgBiwEKyB2Hvr04iUcUcxROa2Mwn_YRWVuGBsDJYZfL/s1600/best+blogger+tips.png'/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

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

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

هل اعجبك الموضوع ؟ شاركه مع اصحابك