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

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


اولأ اذهب الي لوحة التحكم ثم الي قالب ثم تحرير html
ثم 
 ابحث عن الكود التالى 
</head>
ضع الكود التالى مباشرة قبل الكود السابق

<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Arial ; margin-bottom:10px; }#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 {font-size : 24px;  text-decoration : none; text-shadow: 2px 2px 3px #0058cd;} #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background :        url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEDbF2HgouvFZ6OvlNssBgzSatQjyp7aMNtJ_fiF2BxrFsqX8gCaLVH-Z5ofVizWiu1q2PwzpkMQpVBsEC2ZGZ_B3w2uPDsdNxB1IhT6vXbCVbxUShdcn80jfSvMOCqV3g9H5KLfzr15CF/s1600/favicon.ico") 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 type='text/javascript'>

//<![CDATA[

var relatedTitles = new Array();

var relatedTitlesNum = 0;

var relatedUrls = new Array();

function related_results_labels(json) {

for (var i = 0; i < json.feed.entry.length; i++) {

var entry = json.feed.entry[i];

relatedTitles[relatedTitlesNum] = entry.title.$t;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

relatedUrls[relatedTitlesNum] = entry.link[k].href;

relatedTitlesNum++;

break;

}

}

}

}

function removeRelatedDuplicates() {

var tmp = new Array(0);

var tmp2 = new Array(0);

for(var i = 0; i < relatedUrls.length; i++) {

if(!contains(tmp, relatedUrls[i])) {

tmp.length += 1;

tmp[tmp.length - 1] = relatedUrls[i];

tmp2.length += 1;

tmp2[tmp2.length - 1] = relatedTitles[i];

}

}

relatedTitles = tmp2;

relatedUrls = tmp;

}

function contains(a, e) {

for(var j = 0; j < a.length; j++) if (a[j]==e) return true;

return false;

}

function printRelatedLabels() {

var r = Math.floor((relatedTitles.length - 1) * Math.random());

var i = 0;

document.write('<ul>');

while (i < relatedTitles.length && i < 20) {

document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');

if (r < relatedTitles.length - 1) {

r++;

} else {

r = 0;

}

i++;

}

//]]>

</script>

لتغير الصور التي تظهر بجانب الوضوعات غير https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEDbF2HgouvFZ6OvlNssBgzSatQjyp7aMNtJ_fiF2BxrFsqX8gCaLVH-Z5ofVizWiu1q2PwzpkMQpVBsEC2ZGZ_B3w2uPDsdNxB1IhT6vXbCVbxUShdcn80jfSvMOCqV3g9H5KLfzr15CF/s1600/favicon.ico
و  لتغيير حجم عرض الاداة  ابحث عن 540px غير ما يناسب موقعك

ثم
الخطوة الثانية لوضع الكود HTML بالمكان الذى تظهر بة الاداة  :ابحث عن الكود التالى
<data:post.body/>
ضع كود HTML التالى مباشرة اسفل الكود السابق 

<b:if cond='data:blog.pageType == "item"'><div id="related-posts"><font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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&amp;max-results=5 &quot;' type='text/javascript'/></b:if></b:loop> </font><script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script></div></b:if>

ثم احفظ القالب
وكدة مبروك عليك
واي استفسار ضعة في تعليق وانا موجود

اعجبك الموضوع؟ مشاركتها مع أصدقائك:-

• Facebook
• Twitter
• Google+
• Pinterest
• StumbleUpon
• Digg
• LinkedIn
• Reddit
• Delicious
• Technorati