WordPress Font Issue 讓網站的內容，中英文字都有各自的字型，這樣可以增加網站內容的閱讀性，同時提升網站的質感。
如何在 WordPress 網站套用中文字型，我分享過非常多的方法。對於多數中文內容的網站來說，這是可以提升網站質感最快也是最容易的方法。不過對於網站內容大量英文出現的網站來說，這樣的規劃又讓版面太單調了一些。所以，今天要跟大家分享一下如何讓中文呈現繁體中文字型，英文則呈現我們想要的英文字型，有興趣的朋友不要錯過了接下來的內容。
WordPress Font Issue
- 今天示範的內容，佈景主題使用的是很受歡迎的 Astra。
- 跟往常的示範文章一樣，整個修改的過程，我們需要透過子佈景主題來建置，如果還不曉得或是沒有使用子佈景主題的朋友，可以參考之前的文章。
- Astra 佈景主題之所以受到這麼多人喜愛，就是在於它的相關設定非常方便使用，免費版本就提供字型的設定，當然也包括繁體文字型 Google Noto Sans TC 與 Noto Serif TC 繁體中文字型。如果是中文為主的網站，可以直接設定網站字型為 Noto Sans TC 或是 Noto Serif TC 繁體中文字型。
- 不過我們今天示範的是中英文都很需要的網站內容，所以字型設定這裡不要變動，採用網站預設的 Default System Font 就好。
- 接下來我們就到 Google Fonts 選擇我們需要的英文字型與中文字型。
- 以今天示範的文章來說，我們選擇了 Noto Serif TC、Noto Sans TC 繁體中文字型與 Lobster 英文字型。
- 複製佈景主題資料夾下的 header.php 檔案到子佈景主題資料夾。這個步驟可以透過 Child Theme Configurator 子佈景主題外掛程式來建置，也可以手動透過 FTP 自己上傳，兩種方法擇一使用就可以。
- 接著編輯這個 header.php 檔案，在 </head> 之前插入以下字型語法。
|
1 |
<link href="https://fonts.googleapis.com/css?family=Lobster|Noto+Sans+TC|Noto+Serif+TC&display=swap" rel="stylesheet"> |
- 再來就是設定字型的式樣（CSS）語法，我們可以編輯子佈景主題資料夾下的 style.css 檔案，也可以在外觀的自訂/附加的式樣檔案，同樣的兩種方法擇一使用就可以。請填入以下式樣（CSS）語法：
|
1 2 3 |
body { font-family: 'Lobster', 'Noto Sans TC', sans-serif; } |
- 編輯完成以後存檔，就可以看見中英文各自呈現的效果了。
結論
中英文字型適用的方法不難，每一位網站設計人員都可以依照這個方式，設計出更多字型組合來套用。希望今天的文章大家會喜歡，或是還有什麼其他的意見，也歡迎大家一起來討論。
