السلام عليكم ورحمة الله وبركاته اهلا ومرحبأ بى متابعون مدونة بلوجر توب
درس اليوم هو اضافة موتضيع ذات صله مثل ما فى العنوان
مواضيع ذات صلة بشكل مميز مع امكانية التنسيق والتنسيق الرئيسي للآداة
مثل المدونات الاكثر احترافى
وجد بعض المدونون يبحثون على تلك الاضافة المميزة
الفرق بين هذه الآداة والآدوات السابقة هو أنها أخف نظراً لأنها
تنسيق بشكل جديد منتظم بشكل افضلمع امكنيات التحكم فيها من عداد الموضيع وتنسيق الالوان يناسب مدنتك وهذا
الشكل الاول
الخطوة الاول لتركيب الاضافة
ابحث عن هذا الوسم في القالب ]]></b:skin> وأضف فوقه الكود التالي
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related_posts h4 {
font-weight: bold; font-size: 13px; line-height: 150%;" face="Sorts Mill Goudy" size="4";
}
#related_posts {
padding: 10px 0;
}
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
margin: 0;
font-family:
Droid Sans', Arial, Verdana, sans-serif;
}
#related_posts h4, #comments .komhead h4 {
font-family: 'Oswald', sans-serif;
}
ul#relpost_img_sum {
margin: 0;
padding: 0;
}
ul#relpost_img_sum li {
border-bottom: 1px dashed #DDDDDD;
float: left;
height: 82px;
list-style: none outside none;
margin: 9px;
overflow: hidden;
padding: 10px 10px 10px 0;
width:47%;
height: auto;
}
ul#relpost_img_sum li a {
display: block;
}
ul#relpost_img_sum li img {
float: right;
width: 60px;
height: 60px;
margin-right: 5px;
padding: 2px;
background-color: white;
border: 1px solid #DDD;
}
ul#relpost_img_sum li a.relinkjdulx {
background-image: none;
color: #359BED;
display: block;
font-family: sans-serif;
font-weight: bold;
overflow: hidden;
}
</style>
<script type='text/javascript'>
//<![CDATA[
/*
Related Post with Thumbnail & Summary v1.0 (May 01, 2013)
copyright (c) 2014 http://bilokr.blogspot.com/*/
var relnojudul = 2;
var relmaxtampil = 4;
var numchars = 50;var reljudul=new Array();var relurls=new Array();var relcuplikan=new Array();var relgambar=new Array();function saringtags(g,h){var e=g.split("<");for(var f=0;f<e.length;f++){if(e[f].indexOf(">")!=-1){e[f]=e[f].substring(e[f].indexOf(">")+1,e[f].length)}}e=e.join("");e=e.substring(0,h-1);return e}function relpostimgcuplik(h){for(var e=0;e<h.feed.entry.length;e++){var g=h.feed.entry[e];reljudul[relnojudul]=g.title.$t;postcontent="";if("content" in g){postcontent=g.content.$t}else{if("summary" in g){postcontent=g.summary.$t}}relcuplikan[relnojudul]=saringtags(postcontent,numchars);if("media$thumbnail" in g){postimg=g.media$thumbnail.url}else{postimg="http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.GIF"}relgambar[relnojudul]=postimg;for(var f=0;f<g.link.length;f++){if(g.link[f].rel=="alternate"){relurls[relnojudul]=g.link[f].href;break}}relnojudul++}}function contains(a,e){for(var f=0;f<a.length;f++){if(a[f]==e){return true}}return false}function artikelterkait(){var v=new Array(0);var w=new Array(0);var x=new Array(0);var A=new Array(0);for(var u=0;u<relurls.length;u++){if(!contains(v,relurls[u])){v.length+=1;v[v.length-1]=relurls[u];w.length+=1;w[w.length-1]=reljudul[u];x.length+=1;x[x.length-1]=relcuplikan[u];A.length+=1;A[A.length-1]=relgambar[u]}}reljudul=w;relurls=v;relcuplikan=x;relgambar=A;for(var u=0;u<reljudul.length;u++){var B=Math.floor((reljudul.length-1)*Math.random());var i=reljudul[u];var s=relurls[u];var y=relcuplikan[u];var C=relgambar[u];reljudul[u]=reljudul[B];relurls[u]=relurls[B];relcuplikan[u]=relcuplikan[B];relgambar[u]=relgambar[B];reljudul[B]=i;relurls[B]=s;relcuplikan[B]=y;relgambar[B]=C}var r=0;var D=Math.floor((reljudul.length-1)*Math.random());var z=D;var q;var t=document.URL;while(r<relmaxtampil){if(relurls[D]!=t){q="<li class='news-title clearfix'>";q+="<a href='"+relurls[D]+"' rel='nofollow' target='_top' title='"+reljudul[D]+"'><div class='overlayb'></div><img src='"+relgambar[D]+"' /></a>";q+="<a class='relinkjdulx' href='"+relurls[D]+"' target='_top'>"+reljudul[D]+"</a>";q+="<span class='news-text'>"+relcuplikan[D]+"</span>";q+="</li>";document.write(q);r++;if(r==relmaxtampil){break}}if(D<reljudul.length-1){D++}else{D=0}if(D==z){break}}};
//]]>
</script>
</b:if>
يمكنك تغيير الرقم 50 وهو عداد الاحرف المستخدمة فى الاضافة
مع تغيير var relmaxtampil = 4 عداد الموضيع الزى تظهر فى الاضافه
تغيير حجم الصورة width: 60px
بعد الانتهاء من التعديل
الآن الخطوة الثانية في تركيب الآداة
ابحث عن الكود التالى
<div class='post-footer'>
وأضف تحته الكود التالي
<b:if cond='data:blog.pageType == "item"'> <div id='related_posts'> <div class='relhead'> <h4>مواضيع ذات الصلة:</h4><div class='stripe-line'/> </div> <b:loop values='data:post.labels' var='label'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=relpostimgcuplik&max-results=50"' type='text/javascript'/> </b:loop> <ul id='relpost_img_sum'> <script type='text/javascript'>artikelterkait();</script> </ul> </div> </b:if>
يمكنك تغيير كلمة مواضيع ذات صلة بكلمة تناسبك
انتهى بحمد الله
تعليقات
إرسال تعليق
يمنع نشر التعليقات ذات الروابط الدعائية أو تعليقات بإسلوب غير لائق أو التى تحتوى على معلومات شخصية كالبريد الإلكترونى
أعتذر عن الرد على طلبات التوزيع لضيق الوقت أو التبادل الإعلانى
لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى"