كيفية وطريقة جعل التدوينه او أكثر مثبته على الصفحه الرئيسيه لمدونتك على بلوجر
هناك العديد من الطرق التى تستطيع بها عمل هذه الإضافه أو الحصول على هذا النوع من التدوينات ولكن معظمها بها بعض المشاكل وهى مثل :
طريقة التاريخ ( غير جيده )
قم بنشر تدوينتك ولكن ستقوم بتغيير التاريخ لتجعله مستقبليا , وكمثال أن تجعل التاريخ 2020 وستظهر هذه التدوينه فى المقدمه دائما حتى بلوغ هذا التاريخ , ولكن بها مشكله كبيره وهى أن خلاصات مدونتك لن تعمل بشكل جيد , بل ستظل خلاصات مدونتك متوقفه مع هذه التدوينه كآخر تدوينه تم نشرها ولن تقوم بأرشفة أى تدوينات أخرى .
طريقة الإضافه ( غير جيده )
وهى أن تقوم بإستخدام بعض الأكواد عن طريق لصقها فى إضافة أداة HTML/JAVASCRIPT فى تخطيط مدونتك أعلى رسائل المدونه الإلكترونيه , ومع انها سوف تأخذ نفس شكل التدوينات العاديه وسوف تظهر فى مقدمة كل التدوينات , ألا أن لديها مشكله كبيره وهى انها ليست تدوينه ولن يتم نشرها فى محركات البحث ولن يتم أرشفتها كما أنها لن تدخل ضمن ارشيف المدونه الإلكترونيه .
طريقة التدوينه المثبته الحديثه ( ممتازه )
وهى الطريقه التى سنقوم بشرحها شرحا كاملا هنا , حيث تتلافى هذه الطريقه كل المشاكل التى وقعت فيها التجارب والاضافات الأخرى , وتقدمها بشكل يسمح بالتحكم فى شكلها عن طريق السى إس إس , تستطيع مشاهذة الإضافه فى هذا الرابط وإليكم الطريقه وشرحها بشكل مفصل , هيا بنا .
إذهب إلى أكواد HTML الخاصه بقالب مدونتك ثم قم بالبحث عن الكود التالى
</body>
ثم ضع قبله تماما الكود التالى
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<b:if cond=’data:blog.pageType != "item"’>
<style type=’text/css’>
.sticky-post { background-color: #F0F0F0; padding: 8px;}
.stickies-container { background-color: #E4E4E4; padding: 4px; margin-bottom: 2em;}
.stickymore { display: none; }
</style>
<script type=’text/javascript’>
//<![CDATA[
// Sticky posts by MS-potilas 2011. See http://yabtb.blogspot.com/
// Configuration:
var stickyLabel = “sticky”
var maxStickies = 2; // 1-20
var showDate = true;
var showTitle = true;
var showFooter = true;
var showPostedBy = true;
var showCommentLink = true;
var showLabels = true;
var showStickyLabel = false;
var showEmailPost = false;
var showShareButtons = true;
var showShareEmail = true;
var showShareBlog = true;
var showShareTwitter = true;
var showShareFacebook = true;
var showSharePlusone = true;
var widthPlusone = 300;
var txtComment = “comment”;
var txtComments = “comments”;
var txtPostedBy = “Posted by [user] at [time]”;
var txtLabels = “Labels:”;
var txtMore = “Read more »”;
var dynamicMore = true;
var txtHideMore = “« <small>Hide</small>”;
// config end
function findQuickEdit() {
var elements = document.getElementsByTagName(“*”);
var expr = /(^| )quickedit( |$)/;
for(var i=0 ; i<elements.length ; i++)
if(expr.test(elements[i].className))
return (elements[i].offsetWidth != 0);
return false;
}
function toggleStickyMore(id) {
if(document.getElementById(id)) {
if(document.getElementById(id+’-morelink’).style.display != ‘none’) {
document.getElementById(id).style.display = ‘block’;
document.getElementById(id+’-morelink’).style.display = ‘none’;
} else {
document.getElementById(id).style.display = ‘none’;
document.getElementById(id+’-morelink’).style.display = ‘inline’;
}
}
var elm=document.getElementById(id+’-buttons’);
if(elm) {
var old=elm.style.display;
elm.style.display = ‘none’;
elm.style.display = old; // because of IE…
}
}
function renderStickies(result) {
if(!result || !result.feed || !result.feed.entry || !result.feed.entry.length) return;
var divSticky = document.createElement(‘div’);
divSticky.className = “stickies-container”;
var elm = document.getElementById(“Blog1”);
elm.insertBefore(divSticky, elm.firstChild);
if(!showLabels && !showPostedBy && !showCommentLink)
showFooter = false;
var strBuffer=””;
var isQuickEdit = findQuickEdit();
for(var i = 0 ; i < result.feed.entry.length && i < maxStickies ; i++) {
if(strBuffer != “”)
strBuffer += “<br />”;
var entry = result.feed.entry[i];
strBuffer += “<div class=”sticky-post”>”;
var datePart = entry.published.$t.match(/d+/g); // assume ISO 8601
postDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);
if(showDate)
strBuffer += “<h2 class=”date-header”>” + postDate.toLocaleDateString() + “</h2>”;
var link=””;
for(var k = 0; k < entry.link.length; k++ ) {
if(entry.link[k].rel == ‘alternate’) {
link = entry.link[k].href;
break;
}
}
var blogid = entry.id.$t.split(‘-‘)[1].split(‘.’)[0];
var postid = entry.id.$t.split(‘-‘)[2];
if(postid != “”) {
var elepost=document.getElementsByName(postid);
if(elepost && elepost[0]) {
elepost = elepost[0].parentNode;
while(elepost && !/(^| )date-outer( |$)/.test(elepost.className))
elepost = elepost.parentNode;
if(elepost && elepost.parentNode) elepost.parentNode.removeChild(elepost);
}
}
if(showTitle)
strBuffer += “<h3 class=”post-title entry-title”><a href=”” + link + “”>”+ entry.title.$t + “</a></h3><br />”;
var content = entry.content.$t;
if(content.indexOf(“<a name=’more'”)!=-1) {
if(!dynamicMore) {
content = content.replace(/n/g, ” “);
content = content.replace(/<a name=’more’.*$/, “<div style=’clear: both;’></div><div class=’jump-link’><a href='”+link+”#more’ title='”+entry.title.$t+”‘>”+txtMore+”</a></div>”);
} else {
var morelink = ‘<a href=”javascript:void(0);” id=”sticky’+postid+’-morelink” onclick=”toggleStickyMore(‘sticky’+postid+”);return false;” title=”‘+entry.title.$t+'”>’;
morelink += txtMore+'</a><div class=”stickymore” id=”sticky’+postid+'”>’;
morelink += ‘<a style=”float:right;margin-left:1em;” href=”javascript:void(0);” onclick=”toggleStickyMore(‘sticky’+postid+”);return false;” title=”Hide text”>’ + txtHideMore + ‘</a>’;
content = content.replace(/n/g, ” “).replace(/<a name=’more’.*?</a>/, morelink) + “</div>”;
}
}
strBuffer += content;
if(showFooter) {
var strComments = “”;
if(showCommentLink)
strComments = “<a class=”comment-link” href=”” + link + “#comments”>” + entry.thr$total.$t + ” ” + ((entry.thr$total.$t==1) ? txtComment : txtComments) + “</a>”;
strBuffer += “<div class=”post-footer-line post-footer-line-1″><div class=”post-footer”>”;
if(showPostedBy) {
var strPostedBy = txtPostedBy.replace(‘[user]’, entry.author[0].name.$t);
strPostedBy = strPostedBy.replace(‘[time]’, ‘<a class=”timestamp-link” href=”‘+link+'”>’+postDate.getHours() + “:” + String(“0″+postDate.getMinutes()).slice(-2)+'</a>’);
strBuffer += strPostedBy;
if(showCommentLink)
strBuffer += ” “;
}
if(showCommentLink && (showShareButtons || showEmailPost)) {
strBuffer += strComments + ” “;
strComments = “”;
}
if(isQuickEdit) {
strBuffer += “<a href=’http://www.blogger.com/post-edit.g?blogID=”+blogid+”&postID=”+postid+”&from=pencil’ title=’Edit Post’><img class=’icon-action’ height=’18’ src=’http://img2.blogblog.com/img/icon18_edit_allbkg.gif’ width=’18’/></a> “;
}
if(showEmailPost) {
emailPostUrl = “http://www.blogger.com/email-post.g?blogID=”+blogid+”&postID=”+postid;
strBuffer += ‘<span class=”item-action”><a href=”‘+emailPostUrl+'” title=”Email Post”><img class=”icon-action” height=”13″ src=”http://img1.blogblog.com/img/icon18_email.gif” width=”18″/></a></span> ‘;
}
if(showShareButtons) {
strBuffer += “<div id=’sticky”+postid+”-buttons’ class=’post-share-buttons goog-inline-block’>”;
sharePostUrl = “http://www.blogger.com/share-post.g?blogID=”+blogid+”&postID=”+postid;
if(showShareEmail)
strBuffer += ‘<a class=”goog-inline-block share-button sb-email” href=”‘+sharePostUrl+’&target=email” title=”Email This” target=”_blank”><span class=”share-button-link-text”>Email This</span></a>’;
if(showShareBlog)
strBuffer += ‘<a class=”goog-inline-block share-button sb-blog” href=”‘+sharePostUrl+’&target=blog” onclick=”‘window.open(this.href, “_blank”, “height=270,width=475″); return false;’ title=”BlogThis!” target=”_blank”><span class=”share-button-link-text”>BlogThis!</span></a>’;
if(showShareTwitter)
strBuffer += ‘<a class=”goog-inline-block share-button sb-twitter” href=”‘+sharePostUrl+’&target=twitter” title=”Share to Twitter” target=”_blank”><span class=”share-button-link-text”>Share to Twitter</span></a>’;
if(showShareFacebook)
strBuffer += ‘<a class=”goog-inline-block share-button sb-facebook” href=”‘+sharePostUrl+’&target=facebook” onclick=”‘window.open(this.href, “_blank”, “height=430,width=640″); return false;’ title=”Share to Facebook” target=”_blank”><span class=”share-button-link-text”>Share to Facebook</span></a>’;
if(showSharePlusone)
strBuffer += ‘ <div class=”goog-inline-block dummy-container”><div class=”g-plusone” data-size=”medium” data-href=”‘+link+'” data-width=”‘+widthPlusone+'” data-annotation=”inline”></div></div>’;
strBuffer += “</div>”;
}
if(showLabels && (showPostedBy || showShareButtons))
strBuffer += “<br />”;
if(showLabels) {
if((entry.category.length > 1 && !showStickyLabel) || (entry.category.length > 0 && showStickyLabel)) {
strBuffer += txtLabels + ” “;
for(var z = 0 ; z < entry.category.length ; z++) {
if(entry.category[z].term == stickyLabel && !showStickyLabel)
continue;
if(z) strBuffer += “, “;
strBuffer += “<a href=”/search/label/” + encodeURIComponent(entry.category[z].term) + “”>” + entry.category[z].term + “</a>”;
}
}
if(strComments != “”)
strBuffer += ” “;
}
strBuffer += strComments;
strBuffer += “</div></div>”;
}
strBuffer += “</div>”;
}
strBuffer = strBuffer.replace(/<img width=.1. height=.1. [^>]+>/g, “”);
divSticky.innerHTML = strBuffer;
}
feedURI = “/feeds/posts/default/-/” + stickyLabel + “?max-results=25&redirect=false”;
document.write(‘<script type=”text/javascript” src=”http://’+window.location.hostname+feedURI+’&alt=json-in-script&callback=renderStickies”></’+’script>’);
//]]>
</script>
</b:if>
</b:if>
ثم قم بحفظ قالب مدونتك وإستمتع بالتدوينات المثبته .
إعدادات وملاحظات هامه جدا
- التدوينه التى تريد أن تجعلها تدوينه مثبته يجب عليك فقط أن تجعل تسميتها (sticky ) وستصبح تدوينه مثبته , وتستطيع تغيير هذا الإسم كا تشاء عن طريق تغييره من مكانه فى الكود السابق .
- يجب عليك تطبيق هذا الدرس أيضا ( إظهار التاريخ على كل التدوينات التى تنشرها فى يوم واحد فى مدونتك على بلوجر ) وذلك لتلافى إنضمام التدوينات العاديه التى تنشر فى نفس التاريخ إلى التدوينه المثبته فى إطار واحد .
- تستطيع التحكم فى الإعدادات والشكل من خلال هذه السطور الملونه باللون الأزرق فى الكود السابق .
والآن أصبح عندك تدوينات مثبته , أى إستفسار أو إقتراح برجاء وضعه فى التعليقات .