شــرح إضـافــة مـواضـيــع ذات صـلــة وســط الــمـواضـيــع تــلـقـائيــا

ســأشـرح الــيـوم طـريــقـة إضــافـة مـواضــيـع ذات صــلـة بـشــكـل تـلــقـائي وسـط الــمـواضــيـع لـتــحـســيـن الـســيـو SEO وزيـادة عـدد الـزوار.

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

المعــاينة

مراحل تركيب الإضافة

1. ادخل إلى لوحة تحكم المدونة في بلوجر.
2. اختر قالب المدونة التي تود تطبيق الشرح فيها.
3. اضغط على تحرير HTML ( قم بأخد نسخة إحتياطية للقالب )
4. ابحث عن الوسم </head> و اضف الكود التالي فوقه:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
var relatedSimply = new Array(); var relatedSimplyNum = 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]; relatedSimply[relatedSimplyNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedSimplyNum] = entry.link[k].href; relatedSimplyNum++; 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] = relatedSimply[i];}} relatedSimply = 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((relatedSimply.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedSimply.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedSimply[r] + '</a></li>'); if (r < relatedSimply.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}
//]]>
</script>
</b:if>

5. ابحث عن الوسم ]]></b:skin> و اضف الكود التالي قبله مباشرة

/* Related Post Style 1 */
.related-simplify{position :relative;padding:0;margin:15px auto;width : 100%;}
.related-simplify h4{background:#3498db;padding:8px 12px;margin:0;font-size:15px;font-weight:400;color:#fff;border:1px solid #2e88c5}
.related-simplify ul{margin:0;padding:0}
.related-simplify ul li{background:#f6f6f6;position :relative;list-style:none;padding:9px;margin:auto;line-height:1.4em;border:1px solid rgba(0,0,0,0.1);border-bottom:0;transition:all .3s}
.related-simplify ul li:nth-child(odd){background:#fefefe}
.related-simplify ul li:last-child{border-bottom:1px solid rgba(0,0,0,0.1)}
.related-simplify ul li:before{content:'\f138';font-family:fontawesome;position :absolute;margin:0 4px 0 9px;color:#2ecc71;overflow:hidden;transition:all .3s}
.related-simplify ul li:hover:before{content:'\f138';font-family:fontawesome;-webkit-animation:bounceleft .3s alternate ease infinite;animation:bounceleft .3s alternate ease infinite}
.related-simplify a{color:#0383d9;font-size:13px;margin:0 30px 0 0;}
.related-simplify a:hover{color:#0383d9;text-decoration:underline}
.related-simplify ul li:nth-child(n+4) {display :none;}
@-webkit-keyframes bounceleft{from{-webkit-transform:translateX(0)}to{-webkit-transform:translateX(3px)}}
@keyframes bounceleft{from{transform:translateX(0)}to{transform:translateX(3px)}}

6. الــخـطـوة الأخـيـرة قـم بــالــبـحـث عـن الــعـلامـة <data:post.body/> ســتــجـد مــنــهـا كــثـر مـن واحـده، عـادة الــثــالــثـه هـي الــمــطــلــوبـه ويــمــكــنـك تــجــريـب أكــثـر مـن واحـده، وألــصـق بـدل مــنــهـا ( أي احــذفــهـا والــصـق بـدل مــنــهـا ) الــكـود الــتــالـي :

<div expr:id='&quot;post1&quot; + data:post.id'/>
<div class='related-simplify'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<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=3&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
<h4>قد يهمك أيضا</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
<div expr:id='&quot;post2&quot; + data:post.id'><p><data:post.body/></p></div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);
var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>

7. ثم احفظ القالب وعاين الأضافة

إشترك في قناتنا على اليوتيوب لتتوصلو بجديد حلقاتنا التقنية
سبحان الله، والحمدلله، ولا إله إلا الله، والله أكبر
إذا أعجبك الموضوع فلماذا تبخل علينا بالردود المشجعة ؟!