2015年7月23日

〔雜記〕修改 Blogger 設定,調了好久,差點將部落格搞砸 (2015.07.24.)

前言


最近看到別人的部落格.Blogger,都弄得很漂亮,想說,也來改改自己的部落格 — 不管是文章字體大小、行距、段距、字體間距、小工具等等,看能不能讓部落格看起來更順眼、更舒服、更讓人看的下去。(如果自己都不喜歡自己的部落格,別人是要怎麼喜歡?)


作法 → Google 搜尋


利用 Google 搜尋「關鍵字」(如:blogger 行高設定),看到相關文章,就試試看。一下子改 HTML、一下子改 CSS,因為自己不懂語法,只能依樣畫葫蘆,能學多少、就學多少。

萬萬沒想到,越改,自己的部落格文章格式→越看越不順眼;行高 超高,不知哪個環節弄錯了,導致自己的部落格文章越看越奇怪。(心裡十分懊惱,明明是把部落格要弄漂亮一點,怎麼越弄越糟。)


結論


只好將上次自己備份的 HTML 檔,重新上傳。回到上次備份時間點的樣式。
換言之,今天,白忙了一場。




修改文章內文 行距、字元間距





    隨機 文章(直接貼上 此 HTML)


      <script type="text/javascript">
      var randarray = new Array();var l=0;var flag;
      var numofpost=10;function randomposts(json){
      var total = parseInt(json.feed.openSearch$totalResults.$t,10);
      for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
      if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
      for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
      for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
      document.write(item);}}
      }document.write('</ul>');}
      </script>
      <script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>




      ===以下是直接改 CSS===

      ===以下是直接改 CSS===



      (將預設的字型,改成「微軟正黑體」)
      h3.post-title, h3.entry-title {
      font-family: '微軟正黑體', 'Microsoft JhengHei', Georgia;
      }
      .post-body, .entry-content {
      font-family: '微軟正黑體', 'Microsoft JhengHei', Arial;
      }


      (照片最大寬度)
      .post-body img { max-width:720px; }


      (行距 1.8)
      . post-body {line-height: 1.8em;}


      (網誌標題、網誌說明的文字 置中)
      #header-inner {text-align: center ;}


      (取消 blogger 內建的 訂閱 atom)
      .blog-feeds, .post-feeds {display :none;}


      (部落格網站標題 離 網頁頂端多遠)
      .titlewrapper {padding-top: 40px  !important;} 

      ----------------------------
      ----------------------------


      h3.post-title, h3.entry-title {
      font-family: '微軟正黑體', 'Microsoft JhengHei', Georgia;
      }

      .post-body, .entry-content {
      font-family: '微軟正黑體', 'Microsoft JhengHei', Arial;
      }

      .post-body img { max-width:720px; }
      . post-body {line-height: 1.8em;}
      letter-spacing: 0.8px;
      #header-inner {text-align: center ;}
      .blog-feeds, .post-feeds {display :none;}
      .titlewrapper {padding-top: 40px  !important;}





      Related Posts Plugin for WordPress, Blogger...