順利完成WordPress架站,卻覺得新網站美觀不足,尤其中文字型少之又少,該如何善用字體提升視覺美觀?本篇將為你解析中文WordPress字型少的原因,並分享安裝字體的方法,幫助你輕鬆改善網站視覺。
為什麼中文WordPress網頁字型類型少?解析其中原因
由於中文網站架設完成後,都是使用預設字體「新細明體」,為了提升網站的視覺美觀,就必須更換其他字型,優化文字內容的閱讀體驗。然而可選擇的中文網頁字型不多,大多使用Google提供的思源字體,或是Windows系統的微軟正黑體,究竟是為什麼呢?
因為中文字高達上萬,一套中文字體大小往往超過10MB以上,相比英文僅需要26個字、100KB的容量大小,在存取網站的過程中將會影響載入速度。因此大多數的網站,都使用前面提及的兩種開放字體,以避免載入過慢的問題。
如何在WordPress上傳字型?3種WordPress字型設定方法
1.從WordPress主題編輯器安裝字型
步驟一:
以Google提供的思源字體 Noto Sans TC為例,複製Use on web區塊中提供的@import代碼。
<style>
@import url(‘https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap’); </style> |
步驟二:
進入WordPress後台,點擊【外觀】,選擇【主題編輯器】的【style.css】頁面,
在編輯器中貼上複製的代碼,並按下儲存後離開。
步驟三:
回到【外觀】,選擇【編輯CSS】頁面,在欄位中貼上以下代碼:
body
{ font-family:’ Noto Sans TC ‘,sans-serif; } |
儲存後就完成字型更新。
2.從前台進入自訂CSS頁面更新字體
若想將網站字型設定為微軟正黑體,可在登入狀態下檢視前台網頁,上方會出現黑色選單,點擊進入【自訂】模式,在【附加CSS】欄位中,設置:
body {
font-family: 微軟正黑體, sans-serif !important; } h1,h2,h3,h4,h5,h6{ font-family: “微軟正黑體”, sans-serif !important; } |
按下發布後,重新整理就能更新網站字體。
3.使用外掛更換字體
從WordPress後台的【外掛】下載Header Footer Code Manager,安裝後進入Edit Snippet頁面,新增GoogleFont,並在下方Snippet / Code欄位貼上這段語法:
<link rel=”preconnect” href=”https://fonts.gstatic.com”>
<link href=”https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap” rel=”stylesheet”> |
中、英WordPress字型推薦
中文WordPress字型推薦
思源字體是由Google開發的免費字體,一共包含楷體、園體、黑體、明體、宋體、柔黑體等6種字型,不僅免費授權,可通用日、韓文的中文字,本身造型更是優雅美觀,安裝在網站後,能提升整體視覺美觀。
英文WordPress字型推薦
Helvetica是1957年由瑞士人Eduard Hoffmann發明,屬於無襯線字體中的一種,被大眾認為是現代主義的代表字體,造型端莊典雅,被眾多知名企業如BMW、MUJI、3M、EPSON選為Logo字體,成為英文的經典字體。
善用WordPress字型,點綴網站視覺美觀|網站設計服務
網站字型是打造品牌調性不可或缺的一部分,裝設優美字體能幫助你提升網站視覺美觀,但要架構使用者體驗優良的網站,歡迎交由戰國策集團幫你搞定,我們擁有投入網路領域20年的深厚經驗,加上專業的網路技術,幫助您架設兼具視覺豐富與順暢實用的企業網站。
歡迎聯繫我們,為您製作優質網站!
若有虛擬主機需求或想換主機商,歡迎您先申請試用本公司主機/SSL,先測試主機速度及效能是否能符合您的需求比較準,若在試用過程中有任何問題,歡迎隨時與本公司聯繫!
試用虛擬主機
試用VPS主機
試用企業信箱
試用SSL
優惠方案:
1.月底前訂購輸入折價卷代碼<line-sales>可享第一年50%折扣優惠 請上網訂購
2.買SEO年約享優惠及贈送商務型虛擬主機+SSL各5年(價值45000元)