跳到主要內容

Atom 的中文顯示框框問題

Atom Editor 中文顯示框框問題

去年（2014）2月的時候，GitHub 推出一個長相很像 Sublime text 編輯器的文字編輯器 Atom，是一個以網頁為基礎開發的編輯器，目標是希望從小學生到駭客都會使用的好上手編輯器。結合了 sublime text 與 Emac 的優點，經過六年的開發磨了一把好劍，去年 5 月的時候 GitHub 將核心程式與套件管理程式開源

修改 style 檔案

開啓家目錄下 .atom 裡的設定 less 檔 ~/.atom/styles.less，在將核心程式與套件管理程式開源。
因爲是基於 Chromium 的桌面程式框架和 Coffeescript 所寫，所以能夠跨平臺使用整合使用體驗，也可以使用我們熟悉的 HTML、CSS、Javascript 來修改一些 Atom 的內容。有機會將瀏覽器使用的 WebGL 或是視覺化常用的 Javascript 函式庫 D3.js 使用在 Atom 上。
因為使用了 Node.js 的架構，所以可以使用 Node.js 裡 npm 管理的套件（六萬多個）。Atom 有許多優點也有一些小缺點，現在還在積極的發展中，版本更新的速度很快相信許多問題能迅速的獲得解決。

Atom 中文顯示變框框

Atom 在 Linux 的版本中中文顯示會變成一個個的框框，這多半是因為預設使用了沒有支援中文的字型所造成，可以由 setting 裡的 font-family 設定自己喜歡有支援中文的字型。
Atom 因為是由 GitHub 開發所以有支援 markdown 的語法，剛好最近開始練習使用 markdown 語法，剛好在離線時可以拿來在本機使用。但是開啟 maekdown preview （ctrl+m）的時候，即使在 setting 中有設定 font-family 中文還是會變成框框字，如下圖。
enter image description here

修改 style 檔案更換字型

如前述，由於 Atom 是用 chromium 的桌面程式框架，所以可以使用 CSS 來定義（大心）。修改方法是，開啓家目錄下 .atom 裡的設定 less 檔 ~/.atom/styles.less，在前面先定義 font-family 字型，套用在 atom-text-editor 和 markdown-preview 裡面。
/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed.
 *
 * If you are unfamiliar with LESS, you can read more about it here:
 * http://www.lesscss.org
 */
@font-family: 'YaHei Consolas Hybrid';

.tree-view {
}

atom-text-editor {
    font-family: @font-family;
}

atom-text-editor .cursor {
}

/* 自行加上 markdown-preview */
.markdown-preview {
    font-family: @font-family;
}
套用後中文字型就可以出現，不再是框框字了。可是在 markdown preview 的標題還是框框字？！如下圖。
enter image description here
請在打開 ~/.atom/styles.less 在 .markdown-preview 加上標題的字型設定。
/* 前略 */
/* 把所有標題（h1~h6）都加上 font-family 的設定 */
.markdown-preview⧸⧸ {
    font-family: @font-family;
    h1, h2, h3, h4, h5, h6 {
        font-family: @font-family;
    }
}
修改完成，不再有框框字了！
enter image description here
標籤：

留言

張貼留言

這個網誌中的熱門文章

Word的合併列印如何出現「千分位」符號

今天樓下的同事突然問我一個問題，合併列印的時候如何顯示「千分位符號」（逗號），就是12 , 300。在Excel我們可以很容易的為儲存格裡的數字加上千分位的標記，但是儲存格實際儲存的還是只有數字，那個千分位符號是Excel給我們看的一種「格式」。 當我們在Word裡使用Excel做好的報表來合併列印的時候，Word會最真實的將這個數字欄位給讀出來，呈現在合併列印的欄位數值裡，無論在Excel理事不是有設定千分位符號，在Word合併列印後卻沒有出現，所以我們同樣的必須給他加上格式。 Word裡加上格式並不如Excel裡按一下就完成，加上逗號的千分位格式方法如後： 1.在Word裡插入合併列印的欄位變數。 2.在變數上按滑鼠右鍵，選擇「切換功能變數代碼」（也可以直接按Alt+F9），變數會由 經費 >> 變成 { MERGEFIELD "經費" } 。 3.加上格式就是把 { MERGEFIELD "經費" } 在}前加入數字格式參數 /##,###，會成為 { MERGEFIELD "經費" /# ##,### }（這裡指定五位數，以此類推） #：這個格式項目會指定要在結果中顯示的必要位數；如果結果不含該位數的數字，則 Word 會顯示一個空格。 0：這個格式項目會指定要在結果中顯示的必要位數；如果結果不含該位數的數字，則 Word 會顯示 0 (零)。 4.預覽內容，就可以發現千分位（逗號）出現，如果數值有零的話，最好可以換成 /# ##,## 0 ，避免空格出現。 數字格式參數請參考 Microsoft Office Online 。
1 則留言
閱讀完整內容

使用 Stackedit 發佈至 Blogger

使用 StackEdit 發佈至 Blogger 目前部落格裡新的文章幾乎都是在 StackEdit 上使用 Markdown 來完成撰寫，是一個舒適的撰寫體驗，也更能讓自己專注在文章的撰寫，不用去調整版面上的細節。StackEdit 除了可以將文本直接存在 Google Drive 上，圖形直接嵌入引用 Google+ 相簿，讓整個寫作的流程都是在雲端上完成，另外一個我喜歡的優點，是能夠直接將寫好的文章發佈到自己的部落格上。 發佈至 Blogger 部落格 將文章發佈至 Blogger 上的方法非常簡單，在 StackEdit 的左上角開啓左邊的功能列，拉開 Publish 項目並點選 Blogger，如下圖： 第一次使用時會導引至 Google 的授權頁，回到彈出的對話視窗，填寫好 Blogger 的 URL 內容。新發佈不用填寫 POST ID，這個是未來若需要更新內容的時候使用的。 按下「OK」後就完成發佈的動作，發佈完成後，在 StackEdit 該篇文章的右上角會出現 Blogger 的 Icon。 部落格的樣本改造 文章發佈至 Blogger 後有的模板會有小小的問題，如果我們使用 Markdown 時沒有寫入圖片的最大寬度，插入的圖片若比較大就會造成圖形突破樣板的驚嚇感。 這個可以透過自己改造Blogger 模板內容的 CSS，將圖片最大限制在某個數值。簡單一點的方式，是選擇現在 Blogger 中就已經有限制圖片大小的佈景主題。 程式碼高亮標識 StackEdit 的程式區塊是有支援程式碼高亮標識（Highlight）的功能，預設是使用 Highlight.js 的函式庫，也可以使用 Google prettify。Highlight.js 目前已經支援 118 種的程式語法自動偵測。還有 54 種的 Style 可以選擇。但是發佈至 Blogger 後因模板沒有相關的引入，所以程式碼區塊就和一般的文字一樣，沒有區塊和程式碼標識的區別。 我們可以透過修改 Blogger 的樣板的樣式，引入 Highlight.js 的函式庫與樣式。進入 Blogger 的後臺管理頁面，在左方的選單中選擇 範本 ，然後右方選 編輯 HTML ，開啓樣板的 HTML 編輯畫面。 我們可以在 Highlight.js ...
2 則留言
閱讀完整內容

使用者只能 SFTP 登入自己的家目錄

使用者只能 SFTP 登入自己的家目錄 老師的電腦動畫課堂的期末作品，是開放讓學生透過 FTP 上傳自己的作品及網頁至實驗室的伺服器，由於 FTP 是明碼的封包傳輸於最近升級系統後，便考慮改用 SFTP（SSH File Transfer Protocol）來提供上傳的服務。 提供 SFTP 上傳的同時，希望使用者和以前一樣只能使用 SFTP 無法使用 SSH 登入伺服器。SFTP 為 SSH 的檔案傳輸服務，預設建立帳號的時候使用者同時可以使用這兩種服務。透過 SFTP only + Chroot 設定我們能限制使用者僅能 SFTP 並且無法離開自己的家目錄去到處閒晃。 安裝 OpenSSH 如果安裝的是 Ubuntu Server 應該在安裝過程會安裝 openssh-server 套件，沒有的話可以利用下面的指令安裝。 $ sudo apt-get install openssh-server 新增一個給 SFTP 使用的群組 sftpaccess $ sudo groupadd sftpaccess 修改 OpenSSH 設定檔 編輯 /etc/ssh/sshd_config 設定檔，在約 77 行的地方找到 Subsystem sftp /usr/lib/openssh/sftp-server 註解此行並修改為 Subsystem sftp internal-sftp 。 $ sudo vim /etc/ssh/sshd_config #Subsystem sftp /usr/lib/openssh/sftp-server Subsystem sftp internal-sftp 在檔案的尾端加上下面的片段 Match group sftpaccess ChrootDirectory /home/%u X11Forwarding no AllowTcpForwarding no ForceCommand internal-sftp 建立新的使用者並加入 sftpaccess 群組 在設定檔中，我們設置了 sftpaccess 這個群組套用要做 ChrootDirectory 的設定，所以我們將要限制的使用者，加入這個群組中。 $ sudo useradd ...
張貼留言
閱讀完整內容