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

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

شرح تركيب الاضافة

نتوجه الى لوحة التحكم >> القالب >> تحرير ونبحث عن الوسم </head> ثم نلصق فوقه الكود التالي :

<!--st-tek.blogspot.com-Related-Posts-Starts-->
<style>
#related-posts {
float: right;
width: 100%;
background-color: rgba(0, 0, 0, 0.13);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #000;
font-size : 13px;
text-decoration : none;
font-weigh:bold;
display:block;
}
#related-posts a:hover {
color : #fff;
text-decoration : none;
}
#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/AVvXsEi7dSnpeS745YQRwounDOUdFvE_sqOF8xLP1qwvrIm0NeOelJUsP_OqudSJVKfKo1KnM0Ss7tjo4B_jJuSO2uDRV9VIG5tziw1YqpuhOYXyqtTFj004THmX5vOtEsv1tTHwVk07UrAw32k/s20/ktipp1.png") no-repeat scroll 0 5px #E7E7E7;
margin-bottom:5px;
padding:2px 10px;
line-height : 2em;
border-radius:8px;
border:1px solid #bbb;
}
#related-posts ul li:hover {
display : block;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwwuN5TmqP1YmjyQl_Jh5Y21EzpdOAp6LDHa71FwnQB_D0W37tfxgsZun5et4dKaQ0Ls-XaGAMV3S1Sxf0Qa5xrd0-sGk6k7JoP3HKkgPqWpIqQN-JOXHuY8dB9J1vzEi9KilMToY_xGM/s20/ktipp.png") no-repeat scroll 0 5px #1b9bff;
border-color:#000;
transition:all 0.8s ease 0s;
}
#related-posts h3 {color: #FFF;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjIexXafI2DcSrMkkSrBdEYwrQjpXkeXTI3z9t7UXCZnOp0Rt5rhT2wGVPkBFajBMhFPjx-SdeWZAu07_rMQdI_B2UNXfI1485h2qbBapOdD86ByV2b3-0CIZTR543GGnxG6Bk7h8TaRkc/s1444/bigic.png") no-repeat scroll 100% 1px #0062C4;
padding: 2px 10px;
font-size: 16px;
text-align: center;}
 </style>
<script src='https://cnmu.googlecode.com/svn/trunk/related-post-just-title.js' type='text/javascript'/>
<!--st-tek.blogspot.com-Related-Posts-end-->

ثم نبحث عن الوسم <div class='post-footer'> ونلصق تحته الكود التالي :

<!--st-tek.blogspot.com-RELATED-POSTS-STARTS-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b><h3>مواضيع ذات صلة</h3></b><b:loop values='data:post.labels' var='label'><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=10&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script></div></b:if>
<!--st-tek.blogspot.com-RELATED-POSTS-end-->

* الرقم 10 هو عدد المواضيع المعروضة ويمكن تغييره الى اي رقم حسب الرغبة

ثم نحفظ القالب

كن ايجابيا ولاتبخل علينا بالتعليقات المشجعة فمجرد كلمة شكر تكفي لرد الجميل

الكاتب : Unknown

مدون عربي من السودان احب مجال التدوين على منصة بلوجر ولي فيه شغف كبير اعمل في هذا المجال لاكثر من سنة احب ان اشارككم افكاري عبر مدونتي ارشر

شارك المقال

شاركه على فيسبوكشاركه على جوجل+