سكريبت عرض التدوينات حسب التسميات في بلوجر
سكربت لعرض المواضيع حسب التمسيات، طبعا تطوير قوالب بلوجر محدود، لكن هناك بعض اضافات وسكربتات المميزة ومن بين هذه سكربتات سكريبت لعرض مواضيع المدونة بلوجر حسب التسميات، وهذا سكريبت مفيد للمدونات التي تحتوي على العديد من المواضيع مختلفة في مجالات متنوعة، لانه يسمح لك هذا سكريبت بعرض اكثر من قسم في الصفحة الرئيسية، حتى تستهدف اكبر قدر من الجمهور.
تركيب سكربت عرض المواضيع حسب التسميات:
- اولا وقبل كل شيء قم بحفظ نسخة احنياطية من قالب مدونتك.
- الان من مظهر مدونتك ابحث عن هذا الوسم التالي.
]]></b:skin>
بعد ايجاده ضع الكود التالى فوقه.
ul.rp_thumbs{margin:0}
ul.rp_thumbs li{font-size:12px;min-height:68px;margin:0 0 8px;padding:0 0 8px;border-bottom:1px dotted #f0f0f0}
ul.rp_thumbs .rp_thumb{position:relative;background:#fbfbfb;margin:3px 0 10px;width:100%;height:0;padding-bottom:46%;overflow:hidden}
ul.rp_thumbs .rp_thumb img{height:auto;width:100%;transition:transform 1.6s;transform:scale(1.0)}
ul.rp_thumbs .rp_thumb:hover img{transform:scale(1.10)}
ul.rp_thumbs2{font-size:13px}
ul.rp_thumbs2 li{padding:0;min-height:66px;font-size:11px;margin:0 0 8px;padding:0 0 8px;border-bottom:1px dotted #f0f0f0}
ul.rp_thumbs2 .rp_thumb2{background:#fbfbfb;float:right;margin:3px 0 0 8px;height:60px;width:60px}
ul.rp_thumbs2 li:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0}
ul.rp_thumbs2 .rp_thumb2 img{height:60px;width:60px}
.sidebar ul.rp_thumbs li:before,.sidebar ul.rp_thumbs2 li:before,#bottombar ul.rp_thumbs li:before,#bottombar ul.rp_thumbs2 li:before{display:none}
span.rp_title{font:normal normal 18px Roboto Condensed,Helvetica,Arial,sans-serif;display:block;margin:0 0 5px;line-height:1.4em}
span.rp_title2{font-size:14px}
span.rp_summary{display:block;margin:6px 0 0}
span.rp_meta{background:transparent;display:block;font-size:11px;font-weight:700;color:#8D8D8D;text-transform:uppercase}
span.rp_meta a{color:#8D8D8D!important;display:inline-block}
span.rp_meta_date,span.rp_meta_comment,span.rp_meta_more{display:inline-block;margin-left:8px}
span.rp_meta_date:before{content:"\f073";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:4px;float:right}
span.rp_meta_comment:before{content:"\f086";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:4px}
span.rp_meta_more:before{content:"\f0a9";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:4px}
ul.rp_thumbs2 li a:hover,ul.rp_thumbs li a:hover{color:#0072C6}
.posts-wdbloog{background:#ffffff;border:1px solid #f0f0f0;padding:15px;overflow:hidden;margin-bottom:10px;float:right;width:50%}
.recent-post-title{border-bottom:4px solid #333;margin:0 0 15px;padding:0;position:relative}
.recent-post-title h2 a{line-height:32px;text-align:center;margin:0 0;padding:10px;background:#333;color:#ffffff;display:inline-block;transition:all 0.25s;-moz-transition:all 0.25s;-webkit-transition:all 0.25s}
.recent-post-title h2 a:before{content:"\f14e";font-family:FontAwesome;font-style:normal;font-weight:normal;text-decoration:inherit;padding-left:6px}
- الأن اعد البحث عن الوسم التالي.
/head
بعد عثورك عليه ضع الكود التالى فوقه.
<script type='text/javascript'>
function labelthumbs(json){document.write('<ul class="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmOEwN-AGYD755hyHoK9oEceRoPq_r6eQZtPR48dHeC7_l3MciCbdxyhs-1_ioCFHZggSlLH4K0G221gWJYdNJ1KRXJikUFAO07sRICiJnR3g-Y3bpEl9lmSTM0fCG8v0IHorm3edbZ_of//';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
</script>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(t){for(var e=0;e<numposts;e++){var r,n=t.feed.entry[e],m=n.title.$t;if(e==t.feed.entry.length)break;for(var i=0;i<n.link.length;i++){if("replies"==n.link[i].rel&&"text/html"==n.link[i].type)var l=n.link[i].title,o=n.link[i].href;if("alternate"==n.link[i].rel){r=n.link[i].href;break}}var u;try{u=n.media$thumbnail.url,u=u.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(h){s=n.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=n.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10);document.write('<ul class="rp_thumbs">'),document.write("<li>"),1==showpostthumbnails&&document.write('<a href="'+r+'"><div class="rp_thumb"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+m+'" src="'+u+'"/></div></a>'),document.write('<span class="rp_title"><a href="'+r+'" target ="_top">'+m+"</a></span>");var g="";if(document.write('<span class="rp_meta">'),1==showpostdate&&(g=g+'<span class="rp_meta_date">'+f+"/"+_+"/"+w+"</span>"),1==showcommentnum&&("1 Comments"==l&&(l="1 Comment"),"0 Comments"==l&&(l="No Comments"),showcomment='<span class="rp_meta_comment"><a href="'+o+'">'+l+"</a></span>",g+=showcomment),1==displaymore&&(g=g+'<span class="rp_meta_more"><a href="'+r+'" class="url" target ="_top">شاهد المزيد ...</a></span>'),document.write(g),document.write("</span>"),document.write('<span class="rp_summary">'),"content"in n)var v=n.content.$t;else if("summary"in n)var v=n.summary.$t;else var v="";var k=/<\S[^>]*>/g;if(v=v.replace(k,""),1==showpostsummary)if(v.length<numchars)document.write(""),document.write(v),document.write("");else{document.write(""),v=v.substring(0,numchars);var y=v.lastIndexOf(" ");v=v.substring(0,y),document.write(v+"..."),document.write("")}document.write("</span>"),document.write("</li>"),document.write("</ul>")}document.write('<ul class="rp_thumbs2">');for(var e=1;e<numposts2;e++){var r,n=t.feed.entry[e],m=n.title.$t;if(e==t.feed.entry.length)break;for(var i=1;i<n.link.length;i++){if("replies"==n.link[i].rel&&"text/html"==n.link[i].type)var l=n.link[i].title,o=n.link[i].href;if("alternate"==n.link[i].rel){r=n.link[i].href;break}}var $;try{$=n.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(h){s=n.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),$=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb2}var p=n.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10);1==showpostthumbnails2&&document.write('<a href="'+r+'"><div class="rp_thumb2"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+m+'" src="'+$+'"/></div></a>'),document.write("<li>"),document.write('<span class="rp_title rp_title2"><a href="'+r+'" target ="_top">'+m+"</a></span>");var g="";document.write('<span class="rp_meta rp_meta2">'),1==showpostdate2&&(g=g+'<span class="rp_meta_date rp_meta_date2">'+f+"/"+_+"/"+w+"</span>"),1==showcommentnum2&&("1 Comments"==l&&(l="1 Comment"),"0 Comments"==l&&(l="No Comments"),showcomment='<span class="rp_meta_comment rp_meta_comment2"><a href="'+o+'">'+l+"</a></span>",g+=showcomment),1==displaymore2&&(g=g+'<span class="rp_meta_more rp_meta_more2"><a href="'+r+'" class="url" target ="_top">شاهد المزيد ...</a></span>'),document.write(g),document.write("</span>"),document.write("</li>")}document.write("</ul>")}
//Recent Comments
var numComments=numComments||5,characters=characters||40;function recent_comments(tb){var commentsHtml;commentsHtml='<ul id="recent_comments">';for(var i=0;i<numComments;i++){var commentlink,authorName;if(i==tb.feed.entry.length)break;commentsHtml+="<li>";var entry=tb.feed.entry[i];for(var l=0;l<entry.link.length;l++){if(entry.link[l].rel=='alternate'){commentlink=entry.link[l].href}}for(var a=0;a<entry.author.length;a++){authorName=entry.author[a].name.$t}commentsHtml+="<strong><a href=\""+commentlink+"\" title=\""+authorName+"\">"+authorName+"</a></strong>";var commHTML=entry.content.$t;var commBody=commHTML.replace(/(<([^>]+)>)/ig,"");if(commBody!=""&&commBody.length>characters){commBody=commBody.substring(0,characters);commBody+=" …"}else{commBody=commBody}commentsHtml+=" - ";commentsHtml+="<span>"+commBody+"</span>";commentsHtml+="</li>"}commentsHtml+='</ul>';document.write(commentsHtml)}
//]]>
//Recent Comments Settings
var numComments = 5;
var characters = 60;
</script>
<script type='text/javascript'>
//<![CDATA[
var numposts = 1;
var numposts2 = 4;
var showpostthumbnails = true;
var showpostthumbnails2 = true;
var displaymore = true;
var displaymore2 = false;
var showcommentnum = true;
var showcommentnum2 = true;
var showpostdate = true;
var showpostdate2 = true;
var showpostsummary = true;
var numchars = 100;
var thumb_width = 300;
var thumb_height = 140;
var thumb_width2 = 60;
var thumb_height2 = 60;
var no_thumb = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCQ6UARin1orM-ONj7rSO7AccyewABJlYFabw00eFyEQUWYlVtqg27uJqxTlJPeMlNrp6wkHN0I5LC7m7S47bg9LGbIIriYykVa1YqS_imfaPDY9fR5Aj2RLKQyfulbq5zWurLCEydo0dw/w300-c-h140/no-image.png'
var no_thumb2 = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAm2N5DNODeCX2JNCdAoyXGCV93QImB5LETHzFRtYUya7hKKUHE1FgzXpZaYPnEpXPbRNZy4nmJ7rncp7UiWneHQBXEkfr4MDdbqEFGRoVeI6RfXT6K3IwvWTPb7LByzOHU9_E_n7tx7Nb/s60-c/no-image.png'
//]]>
</script>
- الان قم بالبحث عن كود التالي.
<div class='post-wrapper'>
عند ايجاده قم بوضع الكود التالي اسفله.
<b:if cond='data:blog.canonicalUrl == data:blog.canonicalHomepageUrl'>
<div class='posts-wdbloog'>
<script>
//<![CDATA[
document.write('<div class="recent-post-title"><h2><a href="/search/label/فنون?max-results=10">اعمال</a></h2></div>');
document.write("<script src=\"/feeds/posts/default/-/فنون?orderby=updated&alt=json-in-script&callback=labelthumbs\"><\/script>");
//]]>
</script>
</div>
</b:if>
- التي باللون الازرق هي التسمية يمكنك تغيرها بالتسمية التي تريدها.
- التي باللون الأحمر هي عنوان الاضافة يمكنك تغيرها بما تريد.
- وللحصول على اضافة اخرى من سكربت ما عليك الا تكرار الكود المحدد باللون الأخضر.
ملاحظة: اذا ظهرت لك ايقونات على شكل مربع معناه ان مدونتك لا يوجد بها مكتبة الفونت أوسم، واذا اردت إظهار ايقونات فقط ابحث عن كيفية اضافة مكتبة الفونت أوسم fontawesome.