發佈日期: 6 則留言

【WordPress】換上漂亮的中文字體 Google font – Avada、OnePress、Screenr、貳零壹伍、The Box Theme

Avada中文字型

打開WordPress網站,看到新細明體的中文字體,就瞬間消火許多。

幸好GoogleFont提供Noto Sans TC解決方案,讓我們一起消滅醜字體吧。


步驟一

安裝Header Footer Code Manager

HeaderFooterCodeManager

步驟二

至Header Footer Code Manager增加Google Font

Google Font head

貼入下列程式碼

<link href="https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900" rel="stylesheet">

步驟三

到主控台,外觀>自訂>附加CSS>貼上程式碼

Wordpress自訂
Wordpress附加CSS
【WordPress】換上漂亮的中文字體 Google font - Avada、OnePress、Screenr、貳零壹伍、The Box Theme 1

步驟四

依照佈景主題,挑選適合的CSS,然後貼上附加的CSS

WordPress 貳零壹伍/2015 theme

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	font-family: 'Noto Sans TC', sans-serif;
}

body,
button,
input,
select,
textarea {
	font-family: 'Noto Sans TC', sans-serif;
}

blockquote cite,
blockquote small {
	font-family: 'Noto Sans TC', sans-serif;
}

code,
kbd,
tt,
var,
samp,
pre {
	font-family: 'Noto Sans TC', sans-serif;
}

::-webkit-input-placeholder {
	font-family: 'Noto Sans TC', sans-serif;
}

:-moz-placeholder {
	font-family: 'Noto Sans TC', sans-serif;
}

::-moz-placeholder {
	font-family: 'Noto Sans TC', sans-serif;
}

:-ms-input-placeholder {
	font-family: 'Noto Sans TC', sans-serif;
}


button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	font-family: 'Noto Sans TC', sans-serif;
}

.post-password-form label {
	font-family: 'Noto Sans TC', sans-serif;
}

.main-navigation .menu-item-description {
	font-family: 'Noto Sans TC', sans-serif;
}

.post-navigation .meta-nav {
	font-family: 'Noto Sans TC', sans-serif;
}

.post-navigation .post-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.pagination {
	font-family: 'Noto Sans TC', sans-serif;
}

.image-navigation,
.comment-navigation {
	font-family: 'Noto Sans TC', sans-serif;
}

.site-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.site-description {
	font-family: 'Noto Sans TC', sans-serif;
}


.widget-title {
	font-family: 'Noto Sans TC', sans-serif;
}


.widget_calendar caption {
	font-family: 'Noto Sans TC', sans-serif;
}

.widget_rss .rss-date,
.widget_rss cite {
	font-family: 'Noto Sans TC', sans-serif;
}


.author-heading {
	font-family: 'Noto Sans TC', sans-serif;
}

.entry-footer {
	font-family: 'Noto Sans TC', sans-serif;
}

.page-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.page-links {
	font-family: 'Noto Sans TC', sans-serif;
}


.entry-caption {
	font-family: 'Noto Sans TC', sans-serif;
}

.comments-title,
.comment-reply-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.comment-metadata,
.pingback .edit-link {
	font-family: 'Noto Sans TC', sans-serif;
}

.comment-list .reply a {
	font-family: 'Noto Sans TC', sans-serif;
}

.comment-form label {
	font-family: 'Noto Sans TC', sans-serif;
}

.comment-notes,
.comment-awaiting-moderation,
.logged-in-as,
.form-allowed-tags {
	font-family: 'Noto Sans TC', sans-serif;
}

.no-comments {
	font-family: 'Noto Sans TC', sans-serif;
}

.form-allowed-tags code {
	font-family: 'Noto Sans TC', sans-serif;
}

.wp-caption-text {
	font-family: 'Noto Sans TC', sans-serif;
}

.gallery-caption {
	font-family: 'Noto Sans TC', sans-serif;
}

.widecolumn label,
.widecolumn .mu_register label {
	font-family: 'Noto Sans TC', sans-serif;
}

Avada Theme Google Font

body {
font: 15px/26px 'Noto Sans TC', sans-serif !important;
}

#main h1, #main h2, #main h3, #main h4, #main h5, #sidebar h1, #sidebar h2, #sidebar h3, #sidebar h4, #sidebar h5,.fusion-menu a,.fusion-page-title-captions h1,.fusion-columns h3,.reviews q,.fusion-button-text,.wpcf7-submit,.widget-title,.wpcf7-text
{
font-family: 'Noto Sans TC', sans-serif !important;
}

#nav ul li.menu-item a {
font-family: 'Noto Sans TC', sans-serif !important;
}

.page-title h1 {
font-family: 'Noto Sans TC', sans-serif !important;
}

.heading h2, .heading h3 {
font-family: 'Noto Sans TC', sans-serif !important;
}

One Press Theme

body, button, input, select, textarea {
	font-family: 'Noto Sans TC', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family:'Noto Sans TC', sans-serif;
}

tt,
kbd,
pre,
code,
samp,
var {
	font-family: 'Noto Sans TC', sans-serif;
}

.site-branding .site-title, .site-branding .site-text-logo {
	font-family: 'Noto Sans TC', sans-serif;
}

.onepress-menu a {
	font-family: 'Noto Sans TC', sans-serif;
}

.entry-header .entry-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.counter_item .counter__number {
	font-family: 'Noto Sans TC', sans-serif;
}

.mfp-close {
	font-family: 'Noto Sans TC', sans-serif;
}

Screenr Theme Google Font

body, button, input, select, textarea {
	font-family: 'Noto Sans TC', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Noto Sans TC', sans-serif;
}

tt,
kbd,
pre,
code,
samp,
var {
	font-family: 'Noto Sans TC', sans-serif;
}

.site-branding .site-title, .site-branding .site-text-logo {
	font-family: 'Noto Sans TC', sans-serif;
}

.entry-header .entry-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.entry-more a {
	font-family: 'Noto Sans TC', sans-serif;
}

.section-title-area .section-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.section-news .entry-grid-title {
	font-family: 'Noto Sans TC', sans-serif;
}

.mfp-close {
	font-family: 'Noto Sans TC', sans-serif;
}

The Box Theme Google Font

body,
button,
input,
select,
textarea {
	font-family: 'Noto Sans TC', sans-serif;
}

.site-title {
	font-family: 'Noto Sans TC', sans-serif;
}

相關文章

【WordPress】邁向95分 Google PageSpeed
【WordPress】WP Offload S3 Lite搭配Cloudflare
【WordPress】SiteNavigationElement 網站導航架構標記
【WordPress】Search Console Missing author updated
【WordPress】浮動FB粉絲專頁側邊欄
【WordPress】美美的中文字體 Google font - Avada、OnePress、Screenr、2015、The Box
【WordPress】OceanWP換上GoogleFont思源黑體

請用訂閱代替掌聲

*訂閱Youtube頻道
*追蹤IG
*追蹤FB粉專

在〈【WordPress】換上漂亮的中文字體 Google font – Avada、OnePress、Screenr、貳零壹伍、The Box Theme〉中有 6 則留言

  1. 照你的方法終於成功換掉字體了,幫你推一個!

  2. 感謝~真的成功了! 推薦推薦

  3. 很好又有效率的方法;但有碰到以下問題,雖然解決了,但依然不明究理 !

    昨天選擇了Avada Theme Google Font的CSS導致購物車變成方塊圖形。(我的網站是用Avada佈景主題!)

    今天重新選擇了WordPress 貳零壹伍/2015 theme的CSS就沒有這種情況,而字體如願,更改成google font 的Noto Sans TC字形。

  4. 感謝分享 有把字體換掉了

在想些什麼呢?留言吧

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料