安裝外掛 WooCommerce PDF Invoices 後,會發現它所生成的 PDF 文件無法顯示中文,而衹會顯示一堆方格、空白或亂碼。原因是該外掛所默認的字型,並不包含漢字字符。解決此一問題的方法,在於修改(子)主題當中的外掛 CSS 檔。
1.
首先將 wp-content/plugins/woocommerce-pdf-invoices-packing-slips/templates/Simple/
內的檔案,全部複製到(子)主題中的以下路徑:
wp-content/themes/my-(child)theme-folder/woocommerce/pdf/my-template/
路徑中粗體字的部分自行命名。
2.
再來創建一個檔案夾 fonts/,並將自選的中文字型上傳到其中。注意,這裏衹支援 TTF 字型檔。
3.
打開 my-template 中的在 style.css 文件,並添加以下樣式:
/* 加載中文字型 */ @font-face { font-family: 'myFont'; font-style: normal; font-weight: normal; src: local('myFont'), local('myFont'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont.ttf) format('truetype'); } @font-face { font-family: 'myFont'; font-style: normal; font-weight: bold; src: local('myFont Bold'), local('myFont-Bold'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-bold.ttf) format('truetype'); } @font-face { font-family: 'myFont'; font-style: italic; font-weight: normal; src: local('myFont Italic'), local('myFont-Italic'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-italic.ttf) format('truetype'); } @font-face { font-family: 'myFont'; font-style: italic; font-weight: bold; src: local('myFont Bold Italic'), local('myFont-BoldItalic'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-bolditalic.ttf) format('truetype'); }
再將 font-family: ‘myFont’ 指派給同文件中的 body 標籤:
body { font-family: 'myFont'; }
4.
進入外掛後台,在 Choose a template 中選取剛剛創建好的模板(my-template),啟用後便解決了中文顯示的問題。
務必記得,在 General settings 下勾選 Enable font subsetting。啟動這一選項後,衹有實際使用的字符會被嵌入 PDF 文件中,而非整套字型。這個作法可以有效降低生成文件的大小。
Yingheng Pou
您好,请教如果更改成中文体后英文字体方面会有影响吗?有视频供参考?您的资讯对我很有帮助,谢谢。
ADMIN
你試試看,運用 font-family 排序,把想要顯示的英文字體,排在中文字體之前:https://developer.mozilla.org/zh-CN/docs/Web/CSS/font-family
Leon Chien
您好,
謝謝您的分享。請問照著做之後 pdf 還是無法顯示中文。是不是要在某處先安裝 myfont.ttf 呢?
ADMIN
是的,在 my-template/ 底下創建一個檔案夾 fonts/,把想要的 TTF 字型放進去。
Shieh Karl
還有一個辦法,就是用另一個Plugin,用這個Plugin: WooCommerce PDF Invoices, Packing Slips, Delivery Notes & Shipping Labels
大量生成invoice時選Print Invoice,中文顯示完全沒有問題,也可以自行添加公司資訊,而且還免費
ADMIN
謝謝你介紹這款 Plugin,感覺蠻不錯的,我會找時間試試看它的功能。