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

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

 وهى اضافة موضوعات مهمه وهى عباره عن اضافه تظهر بشكل تلقائى فى اخر كل مقاله تظهر بها عناوين المقالات من نفس قسم التدوينه ومن الاكيد ان القارئ سيجد بها اى موضوع يهمه مما يجعلنا نستفيد من بقائه اطول وقت ممكن داخل المدون تابعونا .

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

مميزات اداة مواضيع ذات صله او اهم المواضيع

1.  تجعل الزائر يتنقل داخل موقعك بشكل اكبر.
2. تجعل الزائر يبقى داخل موقعك لفتره اكبر مما يقلل معدل الارتداد.
3. يربط بين موضوعات موقعك مما يقوى موقعك بالنسبه للارشفه.
4. سهولة تصفحها وهى بالنسبة لى افضل من الاضافات الصوريه حيث انها سهلة التصفح لى اعين الزائر عن المشاركات الصوريه.
5. تقوم بعرض الموضوعات بشكل عشوائى من نفس القسم او التسميه التى ينتسب اليها موضوع المقاله.
6. تزيد من عدد الزائرين حيث ان بقاء الزائر فتره كبيره داخل موقعك يعزز من موقعك لمحركات جوجل مما يساعد فى ظهورك فى نتائج البحث الاوليه لمحركات البحث وبالتالى زيادة عدد الزوار .

كما تعودنا سوف ارفق لكم شرح مرئى لطريقة تركيب الاضافه بشكل سهل حتى يتثنى لكم فهم الموضوع وايضا سوف ارفق تحت الفيديو الاكواد الخاصه بالاضافه حيث يمكنك نسخها او تحميلها .

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

الان يمكنك نسخ الاكواد التاليه ووضعها داخل قالبك كما هو موضح بالشرح .

تحميل اكواد الاضافه

يتم نسخ هذا الكود ووضعه اعلى وسم الهيد

/head قبل
.......
 <script type='text/javascript'>
//<![CDATA[
var relateddTitles = new Array();
var relateddTitlesNum = 0;
var relateddUrls = new Array();
function relatedd_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relateddTitles[relateddTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relateddUrls[relateddTitlesNum] = entry.link[k].href;
relateddTitlesNum++;
break;}}}}
function removerelateddDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relateddUrls.length; i++) {
if(!contains(tmp, relateddUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relateddUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relateddTitles[i];}}
relateddTitles = tmp2;
relateddUrls = tmp;}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;}
function printrelateddLabels() {
var r = Math.floor((relateddTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relateddTitles.length && i < 20) {
document.write('<li><a href="' + relateddUrls[r] + '">' + relateddTitles[r] + '</a></li>');
if (r < relateddTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;}
document.write('</ul>');
}
//]]>
</script>
<style>
#relatedd-posts {
float : right;
width : 100%;
margin-top:20px;
margin-right: 0px;
margin-bottom:20px;
font : 11px Arial;
margin-bottom:10px;
}
#relatedd-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#relatedd-posts .widget h2, #relatedd-posts h2 {
background:#504844 ;
color : #d4d2c5;
font-size:16px;line-height:16px;font-family:'Cairo';font-weight:bold;margin:0 0 10px 0;padding:10px;text-transform:uppercase;text-shadow:0 1px 0 #fff;    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
    border-radius: 5px;
}
#relatedd-posts a {
color : #504844;
font-weight:bold;
font-family: 'Cairo';
font-size : 14px;
text-decoration : none;
}
#relatedd-posts a:hover {
color : #f15406;
text-decoration : none;
}
#relatedd-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#relatedd-posts ul li {
display: block;
    margin: 0;
    padding-top: 5px;
    padding-right: 9px;
    padding-bottom: 7px;
    padding-left: 16px;
    margin-bottom: 5px;
    line-height: 2em;
    border-bottom: 1px dotted #cccccc;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
    border-radius: 5px;
    background: #ffae5c;
border: 1px solid #EBEBEB
}
</style>

وايضا هذا الكود الثانى الذى يتم استبداله

اسفل الوسم 
data:post.body
...................
               <b:if cond='data:blog.pageType == "item"'>
<div id='relatedd-posts'>
<h2>مواضيع مهمه<div style='display:none;'> <b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=relatedd_results_labels&max-results=20"' type='text/javascript'/></b:if></b:loop></div> </h2>
<script type='text/javascript'> removerelateddDuplicates(); printrelateddLabels(); </script>
</div>
</b:if>

ويمكنك تحميل ملف الكود بالكامل بالضغط على زر التحميل بالاسفل

هنا نكون قد انتهينا من موضوعنا اليوم اتمنى ان اكون قد وفقت وان تكونو قد استفدتم من الاضافه وان اعجبك الموضوع لا تنسى مشاركته مع الاصدقاء حتى تعم الفائده ولا تنسى الاشتراك فى قناتنا على اليوتيوب حتى تكون اول المستفيدين من شروحاتنا لكم منى كل الحب والتقدير والى اللقاء فى موضوع جديد على مدونة تى جو .