轉貼:如何擴展blogger頁面寬度

轉貼:全文來自於http://kevin1566.blogspot.com/

剛建立好Blogger時，會發現顯示頁面不夠寬，預設顯示頁面只有660的寬度而已(根據所選原始模版不同，各別可能的預設值也會不同)。如果想要加寬頁面顯示寬度的話，就得動手改一改了。

1. 按下Blogger的『版面配置』頁籤
2. 再按下其下的『修改HTML』頁籤
3. 若對HTML語言及CSS語法沒有把握，可以按下『下載完整模版』，先將現有模版儲存在自己電腦中，以便將來處理錯誤要復原時使用。
   要復原模版，可以在『從硬碟的檔案裡上載模版』右方文字格中輸入自己電腦中的完整模版儲存路徑，或按右方『瀏覽...』鈕進入挑選。最後，再按『上載』鈕即可。
4. 『展開小裝置範本』 核取盒，現在用不著，故，可以暫不理它。
5. 在下方HTML碼中，找到下面段落，並將紅色字處改掉(以下內容，可能會因原始所選模版不同，而有所差異，找到大致類似位置修改之即可)。
   

   下面者，原預設是660，視所需顯示頁面大小將之更改：
   

   /* Header
   -----------------------------------------------
   */
   
   #header-wrapper {
    width:1000px;
    margin:0 auto 10px;
    border:1px solid $bordercolor;
   }

   
   下面者，預設為700，此處可不改。
   

   #header .description {
    margin:0 5px 5px;
    padding:0 20px 15px;
    max-width:1040px;
    text-transform:uppercase;
    letter-spacing:.2em;
    line-height: 1.4em;
    font: $descriptionfont;
    color: $descriptioncolor;
   }

   
   下面者，預設為660。
   

   /* Outer-Wrapper
   ----------------------------------------------- */
   #outer-wrapper {
    width: 1000px;
    margin:0 auto;
    padding:10px;
    text-align:$startSide;
    font: $bodyfont;
   }

   
   下面為文章內容的寬度設定，預設為410。
   

   #main-wrapper {
    width: 750px;
    float: $startSide;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
   }

   當然，你也可以改Sidebar的寬度，預設為220。我沒改，要改的話，要注意與上方main-wrapper者之加總，不可超過Outer-Wrapper之寬度設定。
   

   #sidebar-wrapper {
    width: 220px;
    float: $endSide;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
   }

6. 改完後，按下下方的『儲存範本』鈕即可。
7. 按下『檢視Blog』連結，即可發現顯示頁面加寬了