Sublime Text 2 - 好用的前端程式編輯器 Part.4 更換主題(Theme)

前面兩篇文章說明了 Sublime2 安裝以及 Pack Control 的安裝與使用，而這一篇則是要來介紹如何更換主題，雖然說這並不是什麼多重要的功能，也不會為往後的操作上能帶來多大的效益，但是如果能夠把一個會時常面對的工具讓它的外觀可以變得賞心悅目一些，我相信在使用上以及觀看上可以讓我們更加的順眼，你說是吧！？

---

進入主題之前

已經有使用 Sublime2 的人在這幾天開啟 Sublime2 時都會收到以下的訊息：



是的，Sublime2 Build 更新了版本，我們一開始在做介紹時是使用 Build 2165，
而這一次所發佈的版號為 Build 2181，更新發佈日期為：2012-02-22，



而在 Sublime 的 Blog 也說明了 Sublime Text 2 Build 2181 的更新內容：
http://www.sublimetext.com/blog/articles/sublime-text-2-build-2181



如果要說這一版最大的更新重點的話，我會說 Sublime2 終於換掉了原本黑黑一塊的圖示了，也不是說原本的圖示很醜或是很不好看，而是原本的圖示真的太過於陽春，顯得沒有什麼特色，雖然說 Sublime2 可以讓使用者自己去更換顯示自己喜歡的圖示，網路上也有很多文章是介紹如何更換，總之，Sublime2 開發者總算是想通了，換了一個還不錯的圖示，讓 Sublime2 的辨識度提高不少。

更換 Sublime Text 2 的圖示，底下有說明在 Windows 7 的環境下要如何修改，
https://github.com/dmatarazzo/Sublime-Text-2-Icon

好吧，既然都已經通知我們有新版本可以更新了，那就乖乖更新吧，下載新的版本後，已經有安裝的人可以不必把原本的給移除，執行安裝新版本的同時就會覆蓋原來的版本，而這邊要特別說明一下，如果已經有對已安裝的 Sublime2 進行設定上的修改或是安裝了 Packages，在安裝新版本時都可以不必擔心這些設定或是 Packages 會不見或是設定亂掉，而是通通不會有任何的變動。



P.S.
這次 Sublime2 Build 2181 的更新好像對於執行速度有了改善，第一次執行是讓我覺得有比前一版本稍快了一些。

比較更換Theme前後的Sublime2

 

Sublime2原本的Theme，是有點單調，


將Sublime2的Theme更換為Soda Theme之後，是不是覺得變得亮眼不少呢？！

下載以及安裝Soda Theme

我們要更換的主題就是最多人所使用的Soda Theme：https://github.com/buymeasoda/soda-theme/，

Sublime2 更換Soda Theme的方式有兩種，一種是直接下載壓縮檔後，再解壓縮到Sublime2的Package目錄中，而另一種方式是使用透過Command Palette去下git指令將Soda Theme透過git給抓回來，但是使用第二種方法的前提是，你的Sublime2需要先安裝git的Packages，所以呢……先不較紹第二種的安裝方式，我們就用手工的方式來安裝吧！


Step.1：下載檔案



https://github.com/buymeasoda/soda-theme/

進入soda-theme的git Repository之後，點選如上圖中的地方，把soda-theme的壓縮檔給下載下來，下載後的檔案及其內容：




Step.2 安裝

將壓縮檔內的目錄給解壓縮，並且將目錄更改為「Theme – Soda」


接下來將這個目錄搬移到Sublime2的Packages目錄下，







Step.3 修改Sublime2的設定

將「Theme - Soda」目錄及檔案複製到Packages目錄下之後，接下來就是要修改Sublime2的設定點選Sublime2的「Preferences > Settings – User」



點選後就會開啟檔案「Preferences.sublime-settings」



這個檔案的內容會隨著每個使用者的設定而有所不同，如果你打開這個檔案是空白的話，請先別擔心，這很正常，有的人的設定內容還可能比我的還要更加複雜，再來就是加上Theme-Soda的使用設定，

"theme": "Soda Light.sublime-theme"

如果你的Preferences.sublime-settings是空白的，那就是用以下的設定：

{

    "theme": "Soda Light.sublime-theme"

}

加上設定的內容之後，儲存檔案……你就會看到Sublime2有了改變，


而如果是使用「Soda Dark.sublime-theme」就會是以下的樣貌，


我是覺得「Soda Light」比較好看……

使用Package Control安裝

 

其實呢……裝上這個「Theme Soda」也是可以透過Package Control來完成，首先是叫出Command Palette，然後輸入「install package」，再輸入「Theme Soda」


接著就選定這個「Theme - Soda」項目按下 Enter，Sublime2 就會開始下載並安裝




安裝完成之後就重新啟動 Sublime2，重新開啟Sublime2之後還是必須要手動去修改 Preferences.sublime-settings。

---

Sublime Text 2 Theme Switcher

 

雖然說現在Sublime2的Theme並不是很多，但是安裝完Theme之後想要去切換Theme就必須要修改Setting檔案，這一個操作就會讓人覺得不便，所以就有人提供了這樣一個Package，可以用Command Palette的方式來切換Theme，

「Sublime Text 2 Theme Switcher」https://github.com/skt84/Themr

這一個Package相當方便，同樣的也可以透過Package Control來安裝，首先呼叫出Command Pallette，然後輸入「install package」，接下來就是輸入「Themr」，



選定後安裝，安裝完成就重新啟動Sublime2，重新啟動 Sublime2 之後，一樣呼叫出Command Palette，接著輸入指令「Themr」就會看到Theme的列表，



這樣一來就可以透過Command Palette來做Theme的切換，這樣是不是很方便呢？

---

Syntax Highlighting Color Schemes

 

在「Soda Theme」的Git Repository網頁中的說明裡有個「Bonus Options」，這個Bonus Options指的是作者有另外提供了兩套Color Schema的設定，分別是：

Espresso Soda

Monokai Soda



所以我們就照著網頁上的說明，下載「colour-schemes.zip」並且將檔案複製到指定的目錄中，


這邊會建議安裝到「Packages/Theme - Soda」目錄下，


這樣可以跟原本Sublime2所預設的Color Scheme做區隔，也比較好做管理，如圖，在「Preference > Color Scheme」下就會多出一個項目「Theme - Soda」，項目下就是剛才所新增的color scheme設定，



下圖是使用原本 Default Color Scheme 的 Monokai


再來這一張是使用 Theme - Soda 的 Monokai Soda


雖然乍看之下沒有什麼不一樣，但是仔細比對下還是可以感覺到Monokai Soda的背景是比較亮一些，

當然還有其他一些不同，那就請各位自行打開tmTheme檔案來做比較囉！

---

Sublime Text Packages上面的Color Scheme

 

在Sublime Text Packages上有很多人提供了Color Scheme，我們來看看這些Color Scheme的樣貌。


Phix Color Scheme
https://github.com/stuartherbert/sublime-phix-color-scheme




Dogs Colour Scheme
https://github.com/radiosilence/dogs-colour-scheme



KWrite Color Scheme
https://github.com/daris/sublime-kwrite-color-scheme



zenburn
http://echonull.colinta.com/null/you-probably-googled-zenburn-textmate/

---

Sweyla's Color Theme Generator

 

如果你是直接新安裝Sublime Text 2 Build 2181版本的人，可以不用再安裝這一個Package，因為安裝Sublime2的時，Sweyla's Color Theme Generator也是預設安裝的Package，如果是之前就已經安裝過Sublime2的人就必須安裝這一個Package了，

https://bitbucket.org/cryzed/sweylas-color-theme-generator

這一個Package的功能是什麼呢？其實很簡單，這是個Color Theme的產生器，其實這個產生器一開始是產生給textmate/emacs/vim 這些編輯器所用，而Sublime2因為同樣使用相同格式的Color Scheme，所以也可以使用這個產生器所產生的Color Scheme，

http://themes.sweyla.com/


在網頁上的「Generate bright！」以及「Generate dark！」都可以產生color scheme。

而Sweyla's Color Theme Generator這一個Package可以讓我們直接在Sublime2中就可以透過Command Palette來產生Color Scheme，呼叫出Command Palette，輸入「Color Theme」，出現兩個與Sweyla’s Color Theme Generator相關的指令，


接下來就是看你是要產生Bright的color scheme還是Dark的color scheme，我就是選擇產生一個新的Dark Color Scheme，然後Sublime2就會立刻套用上新產生的color scheme，



不順眼的話，就多利用Package去多產生幾個吧，產生的color scheme可以在「Preferences > Color Scheme > Sweyla’s Color Theme Generator > Dark」中看到，



如果你想要管理這些由Generator所以產生的color scheme檔案，可以到「Packages\Sweyla's Color Theme Generator\Dark 」目錄下做管理，透過「Sweyla's Color Theme Generator」的使用，也可以產出一個與別人不同的color scheme。

---

使用 textmate 的 Themes

 

Sublime2也可以直接討用textmate的theme，這對於有用過textmate的人來說是個不錯的功能，而沒有使用過textmate的人，則是可以先看看textmate的Themes，先看看這些Themes有沒有自己喜歡的，如果有看到喜歡的就可以下載theme檔案然後套用在Sublime2上，

textmate – Themes Galler
http://wiki.macromates.com/Themes/UserSubmittedThemes



例如說我們要套用「_krTheme」這個textmate theme，


在下面就會有這個theme的下載位置，


「_krTheme」的git Repository，點選「ZIP」下載壓縮檔


壓縮檔內容，而我們只要「krTheme.tmTheme」這個檔案，


為了方便管理，所以我在Sublime2的Packages目錄下新增了一個「TextMate ColorScheme」目錄，然後就把 krTheme.tmTheme 檔案放到這個目錄下，


接著就可以在「Preferences > Color Schemme 」項目下看到剛剛新增的目錄及檔案：「TextMate ColorScheme > ktTheme」


選用新增的「krTheme」來看看Sublime2套用後的樣子，


如此一來就不用擔心 Color Theme 要怎麼設定了，可以先到 textmate 的 Theme Gallery 選擇一個順眼的 Theme，然後下載下來，就可以直接套用到 Sublime2 上。

---

這一篇文章說明了有關 Sublime2 Theme 與 Color Scheme 的 Packages 以及操作方法，藉由這篇的說明可以讓大家知道如何調整自己所使用的 Sublime Text 2 顯示樣式，選一個賞心悅目的外觀與 Syntax Highlighting Color Schemes 設定，可以增加你編寫程式時的效益喔！


以上