夢想の遠方

不知道是不是Pixnet先天性的設計不良，造成使用ul,ol上很麻煩，編輯文章時，要加上"編號"或"清單符號"總是不能顯示!但試用其他家的Blog系統卻沒這種問題，我也曾經換過多種的Pixnet樣板，每一種都一樣，後來學了CSS之後才知道是因為把ul,ol等這幾項全部設定不顯示，因為Pixnet的結構上就使用非常多的ul,ol，要讓這些隱藏起來版面才會好看，但也影響到了編輯文章的使用。

編輯CCS原始碼，將以下這段

ul,ol {list-style:none;}

修改成以下

.article-head, .inner-box ul, .inner-box ol, .box-text ul, .box-text ol, .article-footer ul, .single-post, #navigation, #pix_article_switch ul { list-style:none;}
/*調整縮排*/
.article-content ul, .article-content ol {
    margin-left: 30px;
    margin-bottom:10px;
}

這是我目前版面會使用到的，我也曾搜尋到網路上有其他教學，但我套用後並非完全的生效，所以我還是看著網頁的原始碼再針對需要的下去設定。之後編輯文章時就可以隨心所欲地使用"編號"和"清單符號"了。

【pre 原始碼顯示】
另外編輯到要呈現原始碼的地方，目前使用<pre></pre>包覆，再設定CSS，如底下所示

pre{
    font-size: 0.8em ;
    white-space: pre-wrap; /*使code換行*/
    color: #000000;
    padding: 5px;
    margin-bottom: 10px;
    background-color: #eee;
    border: 1px dashed #999999;
    overflow: auto; /*設定內容溢出時自動加上卷軸，需搭配設定高度使用*/
}

 pre 的解說：「可定義預格式化的文本。被包圍在pre 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。常見應用就是用來表示計算機的源代碼。」

但由於pre並無法因應寬度自動換行，所以需要再加上CSS設定去顯示，所以需要使用 white-space 這個屬性配合 pre-wrap的值，相關的值請看下方

【文章分類子向展開】
文章寫得越多，分類也會隨著增加，pixnet雖然有子分類項目，但預設卻是關閉的，不容易讓人一目了然。因此只需要在側邊攔自訂欄位加入一<script></script>

<script type='text/javascript'>
pix.openAllCategory('open');
</script>

加入後就會自動展開，但展開後卻和分類其行，需要在CSS設定縮排才好方便辨識。

.inner-box ul { padding-left: 13px; }

如此一來Blog感覺更有結構一點，只是搞到來都覺得會不會換個Blog會不會比較容易點…，Pixnet的功能性還有待加強…