إضافة مواضيع ذات صلة (إقرأ أيضا) مُتحركة مع صورة وعنوان الموضوع..

السلام عليكم ..
موضوع اليوم ظاهر من العنوان ..وهو خاصة بإضافة "مواضيع ذات صلة" أو "تابع أيضا" أو "إقرأ ايضا" أسفل كل موضوع ..

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

الإضافة موجودة في المدونة (راجع أسفل الموضوع..) ;)
وكأي إضافة ..نمر بـ المراحل التالية ..

> من لوحة التحكم الرئيسية للمدونة..
1 > أدخل إلى "قالب"

2 > إدخل إلى "نسخ احتياطي/استعادة"..

> قُم بتنزيل القالب (لإسترجاع القالب القديم ..أو ترقبا لأي خطأ) <

> ارجع إلى " تحرير HTML " ..

> إبحث عن الكود التالي ( لـ البحث إضغط على Cltrl+F من الكيبود داخل النمودج) :

</head>

> قم بـ إضافة الكود الآتي فوقه مباشرة :


<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 15px arial; margin-bottom:10px;font-weight:bold; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJiMGbuhYUAbgkePlUPUgcvsRXhBh9bk31o9EeGrK3-c_qsBT_0JA9rpxn8-ExFFRJJtegF9CLegjXbWTuY_43C-e3mV11Rej1qAN-rnBTzdlPstLySVXS3SGPRzPP0GrrVxcCITHt9NA/&quot;) no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://related-sources.googlecode.com/files/Related_posts_b.js' type='text/javascript'/>

> ثم إبحث عن الكود الآتي (Cltrl+F من الكيبود داخل النمودج ) :

<data:post.body/>

> قم بـ إضافة الكود الآتي تحته مباشرة (يعني اسفل مُحتوى الموضوع..):



<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>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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=7&quot;' type='text/javascript'/></b:if></b:loop>
<h3><b>◄ مواضيع ذات صلة..↙↙↙ ↘↘↘</b></h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=6;
var relatedpoststitle=&quot;&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
<div style='float:bottom-right'><a href=''/></div></div>
</b:if>

يمكنك تغيير جملة "◄ مواضيع ذات صلة..↙↙↙ ↘↘↘" بـ أي عبارة تريد كـ "إقرأ ايضا.." "مواضيع تهمك.." ..

> في الأخير "حفظ القالب/النمودج "..
ومبروك عليك إضافة مواضيع ذات صلة أو إقرأ أيضا إلى مدونتك بشكيل جميل وجذاب ..
لا تنسوا إبداء رأيكم في الموضوع ..