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

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

اضافة مواضيع ذات صله  بشكل نصي











كيفية اضافة هذه الاداه الى مدوناتكم

1- نذهب الى لوحة التحكم ثم نضغط من اليمين على قالب ثم نضغط على تحرير Html
2- قم بإجراء نسخة احتياطية لمدونة بلوجر قبل إجراء اي شيء 
3- قم بالبحث عن الكود التالي بالاستعانة بمحرك البحث Ctrl+F وابحث عن </head> 

وألصق الكود التالي فوقه او قبله تماماً 



<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++;}
document.write('</ul>');
}
//]]>
</script>
<style>
#related-posts {
float : right;
width : 600px;
margin-top:20px;
margin-right: 0px;
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 {
background:#EEEEEE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWPHT9NOgOE1wWh1qe38JsUIRtyH2w-x4lIqSoIHf8Whez5pLzuiWm1K_w7R5IVQfMT32zAM_GfEjHXJc-FcfLRK4JN5LWg2_ciVTsYwTGNQREm2a6Xw0oYtbioEjASRaGEpCbQoDwy5k/s0/widget-title-bg.png) right top repeat-y;
color : #222222;
font-size:16px;line-height:16px;font-family:Arial,Helvetica,Sans-serif;font-weight:bold;margin:0 0 10px 0;padding:10px;text-transform:uppercase;text-shadow:0 1px 0 #fff;
}
#related-posts a {
color : #054474;
font-weight:bold;
font-family: Arial;
font-size : 14px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url(&quot;http://i263.photobucket.com/albums/ii150/mohamedrias/newconcept_bullet.png&quot;) no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
</style>



الأن قم بالبحث عن <data:post.body/> 
والصق الكود التالي تحته او بعده تماماً .




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<h2>مواضيع ذات صله<div style='display:none;'> <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=4&quot;' type='text/javascript'/></b:if></b:loop></div> </h2>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script>
</div>
</b:if>


max-results=4 لتحديد عدد المواضيع ذات صلة وفي الاخير قم بحفظ القالب ومبروك عليك الإضافة ارجو وضع تعليق لتشجيعنا .
من فضلك شارك هذا الموضوع اذا اعجبك

ضع تعليقا أخي الكريم

هناك تعليق واحد:

جميع الحقوق محفوظة التقنية نت ©2012-2014 | ، نقل بدون تصريح ممنوع . Privacy-Policy| إتفاقية الإستخدام

مركز تحميل الصور