2.5 修改 Blogger 的 xml 說明2

程式閣 > Blog > 修改 Blogger 的 xml 說明2

接下來要說的即是 xml 與 Blogger 版型之間的關系，還記得左邊工具欄的『版面配置』嗎? 這跟 xml 是有關系的，以我們所用的 Magazine Basic 為例，我們接下來就是指出 xml 內跟『版面配置』與 Blog 畫面的相關性，在 xml 的CSS內主要的區分如下(皆有用/* */標記起來，很好找)：

(1)Header
(2)Outer-Wrapper
(3)Headings
(4)Posts
(5)Comments
(6)Sidebar Content
(7)Profile
(8)Footer

接下來就是依照自已的需求來修改內容，以下是我修改的記錄：

(1) Header 下修改的地方：
     (a) #header h1 裡的 font-size (修改主標題大小)
     (b) #header .description 裡的 font-size (修改標題下的說明)
     (c) .sf-menu li 裡的 font-size (修改 menu 的字型)

(2) Heading 下修改的地方：
     (a) h2 裡的 font-size (修改 Sidebar 標題字大小)

(3) Posts 下修改的地方：

     (a) .post h3 裡的 font-size (修改發文的標題字大小)

     (b) .post h3 stong 與 a:hover 的 font-size (修改文link字型)

     (c) .post-body 裡的 font-size (修改文章的內文字型大小)

(4) Sidebar Content 下修改的地方：

     (a) .sidebar li a 裡的 font-size (修改文link文字型大小)

     (b) 新增 class 定義，作為 Sidebar 內文章字型大小所用的標記

          <Variable name="New_def"
             description="define the new for sidebar body font" 

             type="font"

             default="normal bold 17px Georgia,serif" 

             value="normal bold 17px Georgia,serif">

           .sidebar test{
                              font:$New_def;
                              line-height:1.1em; }

經過以上的修改，大體上所要的文體都應該有不同的變化，不會都是一起變大變小，而想要在那作改變時，也不用再花時間找，只要修改一下上面的 Variable name 裡的定義，這樣的維護就變的簡便多了。

Blog

Blog目錄

上一篇

下一篇