mardi 21 mai 2013
» » » كيف تجعل تدوينه او أكثر مثبته على الصفحه الرئيسيه لمدونتك على بلوجر

كيف تجعل تدوينه او أكثر مثبته على الصفحه الرئيسيه لمدونتك على بلوجر

21:19
يمكنك الآن إنشاء أو تحويل تدوينه او أكثر من تدوينه عاديه إلى تدوينه مثبته , وتدوينه مثبته تعنى أن التدوينه تظهر على الصفحه الرئيسيه دائما وفى مقدمة باقى التدوينات , حتى ولو كانت هذه التدوينه اقدم من باقى التدوينات فسوف تظهر أيضا فى المقدمه دائما .

هناك العديد من الطرق التى تستطيع بها عمل هذه الإضافه أو الحصول على هذا النوع من التدوينات ولكن معظمها بها بعض المشاكل وهى مثل :

طريقة التاريخ ( غير جيده )

قم بنشر تدوينتك ولكن ستقوم بتغيير التاريخ لتجعله مستقبليا , وكمثال أن تجعل التاريخ 2020 وستظهر هذه التدوينه فى المقدمه دائما حتى بلوغ هذا التاريخ , ولكن بها مشكله كبيره وهى أن خلاصات مدونتك لن تعمل بشكل جيد , بل ستظل خلاصات مدونتك متوقفه مع هذه التدوينه كآخر تدوينه تم نشرها ولن تقوم بأرشفة أى تدوينات أخرى .

طريقة الإضافه ( غير جيده )

وهى أن تقوم بإستخدام بعض الأكواد عن طريق لصقها فى إضافة أداة HTML/JAVASCRIPT فى تخطيط مدونتك أعلى رسائل المدونه الإلكترونيه , ومع انها سوف تأخذ نفس شكل التدوينات العاديه وسوف تظهر فى مقدمة كل التدوينات , ألا أن لديها مشكله كبيره وهى انها ليست تدوينه ولن يتم نشرها فى محركات البحث ولن يتم أرشفتها كما أنها لن تدخل ضمن ارشيف المدونه الإلكترونيه .

طريقة التدوينه المثبته الحديثه ( ممتازه )

وهى الطريقه التى سنقوم بشرحها شرحا كاملا هنا , حيث تتلافى هذه الطريقه كل المشاكل التى وقعت فيها التجارب والاضافات الأخرى , وتقدمها بشكل يسمح بالتحكم فى شكلها عن طريق السى إس إس , تستطيع مشاهذة الإضافه فى هذا الرابط  وإليكم الطريقه وشرحها بشكل مفصل , هيا بنا .

إذهب إلى أكواد HTML الخاصه بقالب مدونتك ثم قم بالبحث عن الكود التالى
</body>
ثم ضع قبله تماما الكود التالى
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <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 &raquo;";
    var dynamicMore = true;
    var txtHideMore = "&laquo; <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 += " &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ";
              }
              if(showCommentLink && (showShareButtons || showEmailPost)) {
                strBuffer += strComments + " &nbsp; &nbsp; ";
                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> &nbsp; ";
              }
              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> &nbsp; &nbsp; ';
              }
              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 += '&nbsp;<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 += " &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ";
              }
              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 ) وستصبح تدوينه مثبته , وتستطيع تغيير هذا الإسم كا تشاء عن طريق تغييره من مكانه فى الكود السابق .
  • يجب عليك تطبيق هذا الدرس أيضا ( إظهار التاريخ على كل التدوينات التى تنشرها فى يوم واحد فى مدونتك على بلوجر ) وذلك لتلافى إنضمام التدوينات العاديه التى تنشر فى نفس التاريخ إلى التدوينه المثبته فى إطار واحد .
  • تستطيع التحكم فى الإعدادات والشكل من خلال هذه السطور الملونه باللون الأزرق فى الكود السابق .
والآن أصبح عندك تدوينات مثبته , أى إستفسار أو إقتراح برجاء وضعه فى التعليقات .
Publié par à 21:19

0 commentaires:

Enregistrer un commentaire

Inscription à : Publier les commentaires (Atom)