شرح عمل قسم منقسم لموضعات بلوجر مثل المواقع الاخبارية

تسمية خاصة مع صورة مصغرة، أدلى المقالة على آخر الزوار أو آخر بواسطة وظائف التالية والسابقة وكما ترون في بلوق قالب واحد جوني آخر. على الفور، لأنه كان ليلا وصباح الغد يجب الفجر، قد لا تحصل على ما يصل. وفيما يلي لقطات للشاشة والتجريبي من فضلك انقر لرؤية أكثر وضوحا.


1-   الدخول إلى Blogger باستخدام حسابك
2-   بعد أن حدد بلوق تريد إضافة هذه القطعة.
3-  الذهاب إلى >> تحرير قالب HTML، ثم تحقق توسيع قوالب القطعة
4-  وكإجراء وقائي لتجنب الأخطاء في تحرير المستقبل، أولا احتياطية القالب الخاص بك.
5- بعد كل الخطوات أعلاه قمت بذلك، وضع التعليمات البرمجية التالية فوق رمز : ]]></b:skin

#mas-terbaru{border:1px solid #585858;width:100%;margin:0 auto}
#terbaru{margin:0px}
.mas-elemen{border:1px solid #ccc;margin:5px 0;padding:5px;height:79px}
.mas-elemen img{background:#999;padding:4px;float:left;height:70px;margin-right:8px;width:70px}
.mas-elemen h6,.mas-elemen h6 a{font-size:12px!important;font-weight:700!important;margin:0;color:#111}
.mas-elemen:hover{background-color:#c3c3c3}
.mas-elemen p{font:14px PT Sans Narrow;text-align:justify;color:#555;line-height:14px;margin:5px 0}
#mas-loading{color:#888;font-family:Tahoma;font-size:100px;letter-spacing:-10px;text-align:center;text-shadow:-5px 0 1px #444;background:#141414 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht-xGKPu54W3J4nqm6RzkUsdoZz6Q-PQIV0O2nzMqVFuxiibJ-oFQqSEi7pJi0GN3_rblV_uWmZZdZOB1Ap8SaAcc7sDDgSw8dHAgdTzaVN3pHAU2q4shWyW5I8Ft_XNTWgm-C-mcFfPk/s1600/loading.gif) no-repeat 50% 50%;height:470px;border:1px solid #c3c3c3}
#mas-navigasifeed{border:1px solid #c3c3c3;color:#bbb;font-family:Verdana;font-size:12px;text-align:center;margin:0px}
#mas-navigasifeed:hover{background-color:#c3c3c3}
#mas-navigasifeed a{color:#141414!important;font-family:Tahoma!important;font-size:12px!important;font-weight:400!important;display:block;padding:5px 10px}
#mas-navigasifeed span{padding:5px 10px}
#mas-navigasifeed .next{float:right}
#mas-navigasifeed .previous{float:left}
#mas-navigasifeed .home{text-align:center}
#mas-navigasifeed a:hover,#mas-navigasifeed span.noactived{color:transparant!important}

لاحظ الكتابة الأزرق أعلاه، هو العرض والارتفاع للصورة المصغرة.

6- وعلاوة على ذلك لا يزال الموقف من تحرير HTML، إدراج التعليمة البرمجية التالية فوق رمز </head

<script type='text/javascript'>
//<![CDATA[
var numfeed = 5;
var startfeed = 0;
var urlblog = "http://blogeinter.blogspot.com/";
var charac = 100;
var urlprevious, urlnext;

function maskolisfeed(johny,banget){
var showfeed = johny.split("<");
for(var i=0;i<showfeed.length;i++){
if(showfeed[i].indexOf(">")!=-1){
showfeed[i] = showfeed[i].substring(showfeed[i].indexOf(">")+1,showfeed[i].length);
}
}
showfeed =  showfeed.join("");
showfeed = showfeed.substring(0,banget-1);
return showfeed;
}
function showterbaru(json) {
var entry, posttitle, posturl, postimg, postcontent;
var showblogfeed = "";
urlprevious = "";
urlnext = "";
for (var k = 0; k < json.feed.link.length; k++) {
if (json.feed.link[k].rel == 'previous') {
urlprevious = json.feed.link[k].href;
}
if (json.feed.link[k].rel == 'next') {
urlnext = json.feed.link[k].href;
}
}
for (var i = 0; i < numfeed; i++) {
if (i == json.feed.entry.length) { break; }
entry = json.feed.entry[i];
posttitle = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
if ("content" in entry) {
postcontent = entry.content.$t;
} else if ("summary" in entry) {
postcontent = entry.summary.$t;
} else {
postcontent = "";
}
if ("media$thumbnail" in entry) {
postimg = entry.media$thumbnail.url;
} else {
postimg = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJFR6dRPqUw5_cdaaYwBFa54AAYB0Xdg4YTxtGLUW5ZBl1j-QonXMYvWoI8Ti-K2bhJ4aim9h5d29Hd94DVXw-7Wvkj5AibM51N7RYN3qELQNphRfqDN0u2_HhiM0YToPLqEtDuxIvSQI/s1600/no+image.jpg";
}
showblogfeed += "<div class='mas-elemen'>";
showblogfeed += "<a href='" + posturl + "' target='_blank'><img src='" + postimg + "' /></a>";
showblogfeed += "<h6><a href='" + posturl + "'>" + posttitle + "</a></h6>";
showblogfeed += "<p>" + maskolisfeed(postcontent,charac) + "...</p>";
showblogfeed += "</div>";
}
document.getElementById("terbaru").innerHTML = showblogfeed;
showblogfeed = "";
if(urlprevious) {
showblogfeed += "<a href='javascript:navigasifeed(-1);' class='previous'>&#9668; Previous</a>";
} else {
showblogfeed += "<span class='noactived previous'>&#9668; Previous</span>";
}
if(urlnext) {
showblogfeed += "<a href='javascript:navigasifeed(1);' class='next'>Next &#9658;</a>";
} else {
showblogfeed += "<span class='noactived next'>Next &#9658;</span>";
}
showblogfeed += "<a href='javascript:navigasifeed(0);' class='home'>Home</a>";
document.getElementById("mas-navigasifeed").innerHTML = showblogfeed;
}

function navigasifeed(url){
var p, parameter;
if(url==-1) {
p = urlprevious.indexOf("?");
parameter = urlprevious.substring(p);
} else if (url==1) {
p = urlnext.indexOf("?");
parameter = urlnext.substring(p);
} else {
parameter = "?start-index=1&max-results=" + numfeed + "&orderby=published&alt=json-in-script"
}
parameter += "&callback=showterbaru";
incluirscript(parameter);
}
function incluirscript(parameter) {
if(startfeed==1) {removerscript();}
document.getElementById("terbaru").innerHTML = "<div id='mas-loading'></div>";
document.getElementById("mas-navigasifeed").innerHTML = "";
var archievefeed = urlblog + "/feeds/posts/default"+ parameter;
var terbaru = document.createElement('script');
terbaru.setAttribute('type', 'text/javascript');
terbaru.setAttribute('src', archievefeed);
terbaru.setAttribute('id', 'MASLABEL');
document.getElementsByTagName('head')[0].appendChild(terbaru);
startfeed = 1;
}
function removerscript() {
var elemen = document.getElementById("MASLABEL");
var parent = elemen.parentNode;
parent.removeChild(elemen);
}
onload=function() { navigasifeed(0); }
//]]>
</script>

الوصف:

1-  أحدث عدد المواد المعروضة على القطعة : var numfeed = 5

2- استبدال URL الخاص بك بلوق : var urlblog = "http://blogeinter.blogspot.com/"

3- عدد الأحرف أو الأحرف على كل وظيفة : var charac = 100

7- بعد أن حفظ قوالب، ومن ثم يتجه لتحديد التخطيط الذي تريد إضافة هذه القطعة. انقر فوق إضافة أداة >> HTML / جافا سكريبت أدخل التعليمة البرمجية التالية إليه:

<div id="terbaru"></div>
<div id="mas-navigasifeed"></div>

تستمر حفظ ونرى النتائج.

هشام ابرشى

اسمي هشام : من المملكة المغربية , اهتم بتقنيات الموقع ومواكبة كل ماهو جديد في عالم التقنيه , انقل قالبا ما اراه مفيد ومناسب للزوار , وايضا اطرح المواضيع الحصريه والمفيده للكل بأذن الله ..