اضافة المشاركات الشائعة مع خيارات التنقل

اضافة المشاركات الشائعة مع خيارات التنقل - هذه الاضافة تعد من اهم اضافات بلوجر و سوف تجدها في كل موقع و كل مدونة على بلوجر فهي تقوم بعرض المواضيع في الشريط الجانبي و تستطيع تحديد عدد الموضيع التي يتم عرضها ويكون عددهم من 1 - 10 و لكن هناك بعض المدونين الذين يرغبون بعرض اكثر من 10 مواضيع في الشريط الجانبي فيقومون بتكرار الإضافة مما يؤدي إلى بطىء و تشوه منظر القالب لذلك اليوم في مدون محترف لقد حللنا هذا الامر و اتينا لكم بإضافة اكثر من رائعة بحيث يوجد ازرار التالي و السابق تجدها اسفل المشاركات الشائعة مما يسهل التنقل بين مواضيع المدونة كلها و تصفحها من السايدبار

معاينة

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

1. ادخل على لوحة تحكم بلوجر
2. انتقل إلى التخطيط
3. انقر على إضافة اداة/تحرير
4. اختر اضافة اداة HTML/JavaScript
5.  اضف الكود التالي بداخلها 

<style scoped='' type='text/css'>
/* Recent Post Navigasi */
#recentpostnav {border: 1px solid #585858;width: 100%;margin: 0 auto;}
#recentpostsae {margin: 0px;}
.recentpostel {background: #fff;display: block;border: 1px solid #ddd;margin: 5px 0;padding: 10px;height: 79px;}
.recentpostel img {background: #fff;padding: 4px;float: left;height: 70px;margin-right: 8px;width: 70px;border: 1px solid #ddd;}
.recentpostel h6,
.recentpostel h6 a {text-decoration: none;font-size: 12px!important;font-weight: 700!important;margin: 0;color: #111;}
.recentpostel:hover {background-color: #fefefe;}
.recentpostel p {font-size: 12px;text-align: left;color: #555;line-height: normal;margin: 5px 0;}
#recentpostload {color: #888;font-family: droid arabic kufi;font-size: 50px;letter-spacing: -10px;text-align: center;text-shadow: -5px 0 1px #444;background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpru6taq1s6ttKdDLV_w3lIMYqUhgMG9vDh3RhRM-Vpyb2NpPUI5JTGfeFIdF-3cAUDjTVwPiAJHuubnNQUjwFrlFrRXBjklKbpru94AhVP3MbJYMsklbTKWwYBXQR4e0Z3oCRvg8I5MHt/s1600/loader.gif) no-repeat 50% 50%;height: 470px;border: 1px solid #ddd;}
#recentpostnavfeed {border: 1px solid #ddd;color: #bbb;font-family: droid arabic kufi;font-size: 12px;text-align: center;margin: 0px;}
#recentpostnavfeed:hover {background-color: #fefefe;}
#recentpostnavfeed a {color: #141414!important;font-family: droid arabic kufi!important;font-size: 12px!important;font-weight: 400!important;display: block;padding: 5px 10px;}
#recentpostnavfeed span {padding: 5px 10px;}
#recentpostnavfeed .next {float: right;}
#recentpostnavfeed .previous {float: left;}
#recentpostnavfeed .home {text-align: center;}
#recentpostnavfeed a:hover,
#recentpostnavfeed span.noactived {color: transparant!important;}
</style>
<script type='text/javascript'>
//<![CDATA[
    var numfeed = 5;
    var startfeed = 0;
    var urlblog = "http://newz-b.blogspot.com";
    var charac = 50;
    var urlprevious, urlnext;
function mudwnpfeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzS3kIlwqsC_UIpUgRxhtsAgNLVAIMOKpo8tUv7QIVO-aRN2nvv8aq1N96pJZ498dYSipWzPqGfqw7JHqxOOPTN6-T4RAz_jXFsDqmX9GURkrUKaEf70frmzm7r44AB1ANEmM_gCUiPMX_/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"' target='_blank'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+mudwnpfeed(i,charac)+"...</p>",s+="</div>"}document.getElementById("recentpostsae").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'>السابق</a>":"<span class='noactived previous'>السابق</span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'>التالي</a>":"<span class='noactived next'>التالي</span>",s+="<a href='javascript:navigasifeed(0);' class='home'>الرئيسية</a>",document.getElementById("recentpostnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsae").innerHTML="<div id='recentpostload'></div>",document.getElementById("recentpostnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","mudwnplabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("mudwnplabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)};
//]]>
</script>
<div id="recentpostsae"></div>
<div id="recentpostnavfeed"></div>

التعديلات

var charac : و هي الخاصة بعدد الكلمات او ملخص الموضوع الذي يظهر بجانب الصورة
var urlblog : استبدل رابط المدونة الموجود و ضع رابط مدونتك
var numfeed : و هو عدد المواضيع التي تريد عرضها
font-family  : و هي خاصة بالخط  تجدها مكررة قم بتغييرها للخط الذي في مدونتك
font-size : و هي خاصة بحجم الخط تجدها مكررة غيرها بحجم الخط الخاص بك

اي سؤال او استفسار لا تترد بوضعه تعليق
ولا تنسى دعمنا عبر مشاركة الموضوع عبر ازرار التواصل