اضافة خاصية مواضيع ذات صلة



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

 شرح تركيب الإضافة :
الرجاء قبل عمل اي تعديل في القالب اخذ نسخة احتياطية 
اذهب الى لوحة التحكم في بلوجر >> قالب >> تحرير HTML 
ونبحث عن الكود التالي :


</head>

فوقه مباشرة نقوم بوضع الكود التالي :
<!--Related Posts with thumbnails Scripts and Styles Start--> 
<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.3em
font-weight: bold; 
color: black; 
font-family: Tahoma, 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 src='http://sma-blogger.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/> 
</b:if> 
<!--Related Posts with thumbnails Scripts and Styles End-->

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

اذا لم تجده في قالبك ابحث عن :
<p class='post-footer-line post-footer-line-1'>

ثم أضف الكود التالي بعد الكود السابق مباشرة :
<!-- Related Posts with Thumbnails Code Start--> 
<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'> 
var currentposturl=&quot;<data:post.url/>&quot;; 
var maxresults=5; 
var relatedpoststitle="مواضيع ذات صلة"; 
removeRelatedDuplicates_thumbs(); 
printRelatedLabels_thumbs(); 
</script> 
</div><div style='clear:both'/> 
</b:if> 
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'> 
<a href='http://www.efada.net' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.efada.net' style='display:none;'>EfadaBlog</a> 
</b:if></b:if> 
<!-- Related Posts with Thumbnails Code End-->


تخصيص الإضافة لتتناسب مع مدونتك :
لتغيير عبارة مواضيع ذات صلة بأخرى من اختيارك 
var relatedpoststitle="مواضيع ذات صلة";

لتغيير عدد التدوينات التي ستظهر في الإضافة
var maxresults=5;

لتغيير لون الخلفية التي تظهر عند التأشير بالفأرة
background-color:#d4eaf2;

لتغيير حجم خط الإضافة
font-size: 1.3em;

لتغيير نوع خط الإضافة
font-family: Tahoma, Georgia


الى هنا انتهى الدرس اتمنى ان تكونوا قد استفدتم من هذه التدوينة الى اللقاء في درس اخر 

Related Posts with thumbnails for bloggerEfadaBlog

0 التعليقات :

جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).