recent
أخبار ساخنة

سكربت عرض المواضيع حسب التسميات بشكل جديد واحترافي

رغم ان بلوجر محدوده في لغات البرمجة التي يستخدمها json احضرت لكم اضافة اكثر من رائعه لعرض المواضيع حسب التسمية في مدونتك لتسهيل لزائر في تصفح مدونتك او مدونة اخرى 

طريقة تركيب الاضافة
ابحث في قالب مدونتك عن </body> وقم باضافة الكود التالي فوقه مباشرة 
<script type='text/javascript'>
var multiFeed = {
    feedsUri: [
        {
            name: &quot;دروس وشروحات&quot;,
            url: &quot;http://qaisi1web.blogspot.com&quot;,
            tag: &quot;دروس وشروحات&quot;
        },
        {
            name: &quot;قوالب بلوجر&quot;,
            url: &quot;http://qaisi1web.blogspot.com&quot;,
            tag: &quot;قوالب بلوجر&quot;
        },
        {
            name: &quot;اضافات بلوجر&quot;,
            url: &quot;http://qaisi1web.blogspot.com&quot;,
            tag: &quot;اضافات بلوجر&quot;
        }
    ],
    numPost: 4,
    showThumbnail: true,
    showDate: true,
    showSummary: true,
    summaryLength: 80,
    titleLength: &quot;auto&quot;,
    thumbSize: 72,
    containerId: &quot;feed-list-container&quot;,
    readMore: {
        text: &quot;مزيد من المواضيع&quot;,
        endParam: &quot;?max-results=20&quot;
    }
};
</script>
<script src='https://dl.dropboxusercontent.com/s/0uriwbaa7cp5y2v/qaisi1web-feed.js' type='text/javascript'/>

قم بالبحث عن]]></b:skin>
وأضف فوقه مباشره الكود التالي  /* CSS list-entries qaisi1web */ .post-body *,.post-body *:after,.post-body *:before{box-sizing:initial;-webkit-box-sizing:initial;-moz-box-sizing:initial;}
.list-entries{display:table;background:#fdfdfd;margin:1. 5% 1%;width:31.3%;float:left;font-size:80%;}
.list-entries ul,.list-entries li{margin:0;list-style:none;padding: 0;}
#feed-list-container ul li{background:#fdfdfd;padding:15px;line-height:normal;border:1px solid #eee;border-top:0;transition:all .3s;text-align: right;}
#feed-list-container ul li:hover{background:#fff;}
#feed-list-container ul li:last-child{border-bottom:0;}
.list-entries .main-title{padding:0;overflow:hidden;}
.list-entries .main-title h4{position:relative;display:block;font:inherit;pa dding:1em 3.5em;background-color:#444;color:#fff;margin:0;line-height:normal;font-size:16px;margin-top:0!important}
.list-entries .main-title h4:after{display:inline-block;content:"\f016";font-family:fontAwesome;font-size:17.4px;font-style:normal;background-color:#333;color:#fff;top:0;right:0;padding:1.1em 1em;position:absolute;font-weight:400}
.list-entries .title a{font-size:14px;text-decoration:none;color:#333;transition:all .3s;}
.list-entries .title a:hover{color:#4f93c5}
.summary span {font-size: 11px;}
.list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 0 0 1em;padding:0;float:right}
.list-entries .summary{overflow:hidden;color:#999}
.list-entries .more-link{border-bottom:none;}
.list-entries .more-link a{display:block;line-height:2em;overflow:hidden;text-decoration:none;background-color:#444;padding:0.8em 1.5em;position:relative;font-weight:400;color:#fff;transition:all .3s;font-size: 14px;}
.list-entries .more-link a:hover{background-color:#FF4D00;color:#fff;}
.list-entries .more-link a:after{display:inline-block;content:"\f053";font-family:fontAwesome;font-size:16.4px;font-style:normal;background-color:#333;color:#ccc;top:0;left:0;padding:0.8em 1.25em;position:absolute;font-weight:400;transition:all .3s;}
.list-entries .more-link a:hover:after{background-color:#FF4D00;color:#fff;}
.widget .post-body ul, .widget .post-body ol {position:relative;}
@media (max-width:640px){
.list-entries {width:100%;}
.list-entries{margin:2.5% 1%;}}


الكود التالي هو الخاص بتفعيل الاضافة
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='feed-list-container'/>
</b:if>
يجب عليك وضعه في مكان مناسب في مدونتك حتى يظهر بشكل جميل واحترافي انا افضل ان يوضع اسفل هذه الكود
<div class='outer-wrapper'

google-playkhamsatmostaqltradent