القائمة الرئيسية

الصفحات

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

مرحبا بكل زوار مدونة شروحات اون لاين فى درس جديد من دروس المدونة. عن كيفية إضافة مواضيع ذات صلة لمدونات بلوجر تحت كل مشاركة

ستتعلم في درس اليوم كيفية تثبيت السمات والموضوعات ذات الصلة لمدونات Blogger. تعرض هذة الاضافة الأكثر احترافية عنوان المقالة وعدد التعليقات لكل تدوينة.

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

مرحبًا بك في هذا الدليل الحصري الذي سيساعدك في تحسين مدونتك على بلوجر من خلال إضافة مواضيع ذات صلة احترافية تحت كل مشاركة. إن إضافة مواضيع ذات صلة تساهم في جذب المزيد من القرّاء وزيادة تفاعلهم مع محتوى مدونتك. فهي توفر للقرّاء فرصة استكشاف المزيد من المعلومات المفيدة والمثيرة للاهتمام.

 للبدء في إضافة مواضيع ذات صلة احترافية لمدونتك على بلوجر، يمكنك اتباع

 الخطوات التالية:

طريقة التثبيت:

 1- اذهب إلى مدونتك ثم اختر لوحة التحكم.

 2- في لوحة التحكم، حدد القالب ثم تحرير القالب.

 3- ابحث عن الوسم: []></b:skin>.

 4- قم بإضافة الكود التالي أعلى الوسم.

 /* Related Post Widget */

 #related-posts{

float:right;

height:160px;

margin-bottom:10px;

outline: 1px solid #fff;

border: 1px solid #ddd;

background: #f9fafb;

}

 #related-posts h3{

    font-family: Francois One;

    font-size:20px;

    font-weight:400;

    color: #222222;

    margin-bottom: 0.5em;

    margin-top: 0.5em;

    margin-right: 0.5em;;

    padding-top: 0em;

}

 #related-posts ul{

margin:5px;

width:613px;

padding-right:17px;

list-style:none;

display:block;

}

#related-posts ul li{

list-style:none;

position:relative;

float:right;

border:0 none;

margin-left:11px;

padding:2px;

width:86px;

}

  #related-posts ul li:hover{z-index:100}

#related-posts ul li:hover img{border:3px solid #BBB}

  #related-posts ul li:hover div{

font-size:7px;

text-transform:capitalize;

position:absolute;

top:20px;

right:-15px;

margin-right:0;

width:130px

}

#related-posts ul li img{

border:3px solid #DDD;

width:80px;

height:80px;

background:#FFF;

display:block;

}

#related-posts ul li div{

position:absolute;

z-index:99;

margin-right:-999em

}

#related-posts ul li .title{

text-align:center;

border:1px dotted #CCC;

background:#fff;

padding:5px 10px

}

  - بعد ذلك، ابحث عن الوسم <data:post.body/>

يتكرر هذا الرمز عدة مرات احيانا فى القالب ،المقصود هو الثالث ان ظهر اكثر من مرة.

 6- أضف الكود التالي أدناه.

 <b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<script type='text/javascript'>var ry=&#39;<h3>تدوينات مفيدة:</h3>&#39;;rn=&#39;<h3>No Related Posts </h3>&#39;;rcomment=&#39;Comment&#39;;rdisable=&#39;Comments off&#39;;commentYN=&#39;yes&#39;;</script>

<script type='text/javascript'>

//<![CDATA[

var nothumb='http://lh4.ggpht.com/_u7a1IFxc4WI/TTjruHJjcfI/AAAAAAAAAk0/i11Oj6i_bHY/no-image.png';dw='';titles=new Array();titlesNum=0;urls=new Array();time=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if('thr$total' in d){commentsNum[titlesNum]=d.thr$total.$t+' '+rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;time[titlesNum]=d.published.$t;if('media$thumbnail' in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]=nothumb};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=time[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;time=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);time.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+='<ul>';while(b<titles.length&&b<20&&b<maxresults){if(commentYN=='yes'){comments[c]=' - '+commentsNum[c]}else{comments[c]=''};dw+='<li><a href="'+urls[c]+'" rel="nofollow"><img alt="'+titles[c]+'" src="'+thumb[c]+'"/></a><div class="title"><a href="'+urls[c]+'" rel="nofollow"><h2>'+titles[c]+'</h2></a><span>'+time[c].substring(8,10)+'/'+time[c].substring(5,7)+'/'+time[c].substring(0,4)+comments[c]+'</span></div></li>';if(c<titles.length-1){c++}else{c=0}b++}dw+='</ul>'};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById('related-posts').innerHTML=dw};

//]]>

</script>

<b:loop values='data:post.labels' var='label'>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/>

</b:loop>

<script type='text/javascript'>var maxresults=4;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script>

</div>

<div style='clear both'/>

</b:if>

 7- احفظ النموذج.

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

تعليقات