سكربت عرض المواضيع حسب التسمية الإصدر الثاني
السكريت عبارة عن صورة رائيسية في البداية و ثمانية موضيع علي شكل شبكة ويمكن زيادتها او انقصهم علي حسب ما يناسبك ، وهو خفيف علي المدونة ولن يوثر علي سرعتها
طريقة التثبيت
1:ادخل الي المدونة الخاصة بك
2:ادخل الي القالب
3:ادخل الي تحريرHTML
الخطوه الاولي
ابحث عن الموسم (</head>)واضف الكود التالي فوقة
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<style type='text/css'>
/* CSS Recent Post by Label */
#HTML90{margin-right: 6px;}
#HTML91{margin-right: 6px;}
.mudwnplabel1 ul,.mudwnplabel2 ul{list-style:none;margin:0;padding:0}
.mudwnplabel1 li,.mudwnplabel2 li{margin:0;padding:0}
.mudwnplabel1 .widget,.mudwnplabel2 .widget{font-family:'Droid Arabic Kufi',sans-serif!important;font-family:13px;margin:0;padding:0}
.mudwnplabel1 .widget-content,.mudwnplabel2 .widget-content{padding:0;margin:0;word-wrap:break-word;overflow:hidden}
.mudwnplabel1 h2,.mudwnplabel2 h2{position:relative;margin:0;padding:15px 0;font-size:12px;font-weight:700;border-bottom:1px solid #ddd}
.mudwnplabel2 h2{margin:20px 0 0}
.data-title:before{content:'\f143';left:10px;bottom:0;font-family:FontAwesome;font-style:normal;font-weight:400;margin:0 0 0 10px;color:#07ACEC}
.data-title{margin-right: 6px;color:#07ACEC;border:1px solid #07ACEC;padding:3px 8px;border-radius:2px;margin-left:10px;font-size:10px;font-weight:700}
.mudwnplabel1 .index,.mudwnplabel2 .index{font-size:10px;font-weight:700}
.mudwnplabel1 .index a,.mudwnplabel2 .index a{color:#07ACEC;padding:3px 8px;border-radius:2px;font-weight:400;border:1px solid #29b6f6;color:#07ACEC;border-color:#07ACEC}
.mudwnplabel1 .index a:hover,.mudwnpabel2 .index a:hover{background:#07ACEC;color:#fff;border-color:transparent}
.mudwnplabel1 .index a:after{content:"\f104";font-family:FontAwesome;font-style:normal;font-weight:700;text-decoration:inherit;padding-right:5px}
.mudwnplabel2 .index a:after{content:"\f104";font-family:FontAwesome;font-style:normal;font-weight:700;text-decoration:inherit;padding-right:6px}
.mudwnplabel2 span.mudwnp_meta_comment a:hover{color:#07ACEC!important}
.mudwnplabel2 ul.mudwnp_thumbs li a:hover,.mudwnplabel2 ul.mudwnp_thumbs2 li a:hover{color:#07ACEC;text-decoration:none}
.mudwnp_right{margin:0;padding:0;border-left:1px solid #fff}
.mudwnp_right .cat_thumb{float:right;margin-left:10px!important}
.mudwnp_left{float:right;margin-top:-35px;padding:0}
ul.mudwnp_thumbs{margin:0;padding:0}
ul.mudwnp_thumbs li,ul.mudwnp_thumbs2{margin:0;padding:0}
ul.mudwnp_thumbs .cat_thumb{position:relative;margin:0 0 15px;padding:0;width:280px;height:200px}
ul.mudwnp_thumbs .cat_thumb img{border-radius: 4px;margin-right: 2px;height: 160px;width:100%;transition:all .2s}
ul.mudwnp_thumbs .cat_thumb img:hover{opacity:.9}
ul.mudwnp_thumbs2 li{margin:0 0 10px;padding:0 0 10px;width:27%;overflow:hidden;min-height:74px;float:right;margin-left:10px!important;border-bottom:1px solid #e9e9e9}
ul.mudwnp_thumbs2 li:last-child{border-bottom:none;margin:0;padding:0}
ul.mudwnp_thumbs2 .cat_thumb2{float:right;margin:0 0 0 10px;height:72px;overflow:hidden}
ul.mudwnp_thumbs2 .cat_thumb2 img{border-radius: 3px;margin-right: 2px;height:60px;transition:all .2s}
ul.mudwnp_thumbs2 .cat_thumb2 img:hover{opacity:.9}
span.mudwnp_title{font-family:'Droid Arabic Kufi',sans-serif;font-size:12px!important;font-weight:700;display:block;margin:0 0 10px;line-height:normal;text-transform:none;max-height:45px;overflow:hidden}
span.mudwnp_title2{font-size:12px!important;font-weight:700!important;line-height:1.4em;margin:0 0 3px;max-height:38px}
span.mudwnp_title a{color:#333}span.mudwnp_title a:hover{color:#07ACEC;text-decoration:none}
span.mudwnp_summary{display:block;line-height:1.6em;font-size:11px;width: 87%;text-overflow:ellipsis;margin:10px 0 0}
span.mudwnp_meta{display:block;font-family:'Droid Arabic Kufi',sans-serif;font-size:11px;font-weight:400;color:#aaa;text-transform:uppercase}
span.mudwnp_meta a{color:#aaa;display:inline-block}
span.mudwnp_meta_date,span.mudwnp_meta_comment,span.mudwnp_meta_more{display:inline-block;margin-left:10px}
span.mudwnp_meta_comment a:before{content:"\f0e6";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:5px}
span.mudwnp_meta_comment a:hover{color:#07ACEC!important}
span.mudwnp_meta_date:before{content:"\f133";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:5px}
ul.mudwnp_thumbs2 li a:hover,ul.mudwnp_thumbs li a:hover{color:#07ACEC;text-decoration:none}
@media only screen and (max-width:768px){.tanggal i,.tags i{color:#ff8000!important}.mudwnp_left{width:100%;float:right;margin:0;padding:0}span.mudwnp_title2{max-height:33px!important}ul.mudwnp_thumbs2 li{border-bottom:0;width:58%;overflow:hidden;min-height:60px}.mudwnplabel1 .widget-content,.mudwnplabel2 .widget-content{margin-top:10px}span.mudwnp_summary,.mudwnp_right{display:none}span.mudwnp_title a{font-weight:700}span.mudwnp_title{margin:0 0 5px}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px;border-bottom:0}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
@media only screen and (max-width:320px){ul.mudwnp_thumbs2 .cat_thumb2 img{width:80px;height:50px}.mudwnp_left{width:100%;float:right;margin:0;padding:0}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
@media screen and (max-width:260px){.mudwnp_left{width:100%;float:right;margin:0;padding:0}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
</style>
</b:if>
</b:if>
الخطوه الثانية
اضفة الكود جافا سكريت فوق(</head>) ايضا
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(t){for(var e=0;e<numposts;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=0;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}var u;try{u=r.media$thumbnail.url,u=u.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb}var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10),g=new Array;g[1]="يناير",g[2]="فبراير",g[3]="مارس",g[4]="ابريل",g[5]="مايو",g[6]="يونيو",g[7]="يوليو",g[8]="أغسطس",g[9]="سبتمبر",g[10]="أكتوبر",g[11]="نوفمبر",g[12]="ديسمبر",document.write('<span class="mudwnp_right">'),document.write('<ul class="mudwnp_thumbs">'),document.write("<li>"),1==showpostthumbnails&&document.write('<a href="'+n+'"><div class="cat_thumb"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+m+'" src="'+u+'"/></div></a>'),document.write('<span class="mudwnp_title"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";if(document.write('<span class="mudwnp_meta">'),1==showpostdate&&(v=v+'<span class="mudwnp_meta_date">'+g[parseInt(_)]+" "+f+", "+w+"</span>"),1==showcommentnum&&("1 تعليقات"==l&&(l="1 تعليقات"),"0 تعليقات"==l&&(l="0 تعليقات"),showcomment='<span class="mudwnp_meta_comment"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore&&(v=v+'<span class="mudwnp_meta_more"><a href="'+n+'" class="url" target ="_top">إقرأ المزيد...</a></span>'),document.write(v),document.write("</span>"),document.write('<span class="mudwnp_summary">'),"content"in r)var y=r.content.$t;else if("summary"in r)var y=r.summary.$t;else var y="";var k=/<\S[^>]*>/g;if(y=y.replace(k,""),1==showpostsummary)if(y.length<numchars)document.write(""),document.write(y),document.write("");else{document.write(""),y=y.substring(0,numchars);var $=y.lastIndexOf(" ");y=y.substring(0,$),document.write(y+"..."),document.write("")}document.write("</span>"),document.write("</li>"),document.write("</ul>"),document.write("</span>")}document.write('<span class="mudwnp_left">'),document.write('<ul class="mudwnp_thumbs2">');for(var e=1;e<numposts2;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=1;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}var x;try{x=r.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),x=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb2}var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10);1==showpostthumbnails2&&document.write('<a href="'+n+'"><div class="cat_thumb2"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+m+'" src="'+x+'"/></div></a>'),document.write("<li>"),document.write('<span class="mudwnp_title mudwnp_title2"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";document.write('<span class="mudwnp_meta mudwnp_meta2">'),1==showpostdate2&&(v=v+'<span class="mudwnp_meta_date">'+g[parseInt(_)]+" "+f+", "+w+"</span>"),1==showcommentnum2&&("1 تعليق"==l&&(l="1 تعليقات"),"0 تعليق"==l&&(l="0 تعليقات"),showcomment='<span class="mudwnp_meta_comment mudwnp_meta_comment2"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore2&&(v=v+'<span class="mudwnp_meta_more mudwnp_meta_more2"><a href="'+n+'" class="url" target ="_top">إقرأ المزيد...</a></span>'),document.write(v),document.write("</span>"),document.write("</li>")}document.write("</ul>"),document.write("</span>")}
//]]>
</script>
<script type='text/javascript'>
var numposts=1,numposts2=9,showpostthumbnails=!0,showpostthumbnails2=!0,displaymore=!1,displaymore2=!1,showcommentnum=!0,showcommentnum2=!1,showpostdate=!0,showpostdate2=!0,showpostsummary=!0,numchars=150,thumb_width=310,thumb_height=160,thumb_width2=100,thumb_height2=55,no_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB3zlLpk1LckdhpGM94i9GliwktNVMpH6uItu85R7IKfYNdEfpaYO6rtTEdqX41AZfVyuW7hHJ_JAkO5VKS3KUxN01_igB2QpsrvMU-iDtzFL0t9DbfDrewTheS4Kx1ES9onn8pfQWmsU/s320/mudwnp_thumb.png",no_thumb2="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHLOGp15pXUcZcKvWrv5yYrLb0wBNvwUYvWcMP9uVT7atkdFUjTka5ED2XvlGuvvT0VVzUHogy4u8svgF74B3uF0rOOVdwHAKXMECil2NGBqnj8jeECg60eaVRt-Gy_yoh3w-mkfuZ-yU/s1600/mudwnpthumb_small.png";
</script>
</b:if>
</b:if>
ملاحظة( الكود الذي بالون الاحمر هو من تنصيق الاضافة حسب ذوقك )
اما الخطوة الثالثة
هي من اجل وضع الكود التالي في المكان الموضح في الصورة التالية
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='mudwnplabel1-wrapper'>
<b:section class='mudwnplabel1' id='mudwnplabel1' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML90' locked='false' title='Berita' type='HTML'>
<b:includable id='main'>
<h2><span class='data-title'><data:content/></span><span class='index'><a href='/search/label/<data:content/>?&max-results=8'>مشاهدة الكل</a></span></h2>
<div class='widget-content'>
<script>
document.write("<script src=\"/feeds/posts/default/-/<data:content/>?orderby=published&alt=json-in-script&callback=labelthumbs\"><\/script>");
</script>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<div id='mudwnplabel2-wrapper'>
<b:section class='mudwnplabel2' id='mudwnplabel2' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML91' locked='false' title='Info Menarik' type='HTML'>
<b:includable id='main'>
<h2><span class='data-title'><data:content/></span><span class='index'><a href='/search/label/<data:content/>?&max-results=8'>مشاهدة الكل</a></span></h2>
<div class='widget-content'>
<script>
document.write("<script src=\"/feeds/posts/default/-/<data:content/>?orderby=published&alt=json-in-script&callback=labelthumbs\"><\/script>");
</script>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</b:if>
الخطوة الرابعة
الان سوف تدخل الي التخطيط سوف تجد ادناتين جديدتين ، كل ما عليك فعله هو تحرير الاداة وكتابة اسم القسم الذي تريد ظهو مواضيعوة
تعليقات
إرسال تعليق