Some languages require specific fonts to be included in the template, so that the language characters display correctly. This guide shows how to add support for Chinese to a template, by using the font named Noto Sans.
Note: The following guide assumes you are using the template designs that are provided within the Order Printer Pro app.
Add a Chinese font to your templates
1- Open Order Printer Pro (Shopify admin > Apps)
2- Go to the "Manage templates" page
3- Click the "Edit template" button on the template you would like update
4- In the code section, scroll down in the code until you see the CSS styling towards the bottom:
5- Add the following code, just below the <style>
line.
For Chinese (Simplified), use this:
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:300,400,700&display=swap&subset=chinese-simplified');
For Chinese (Traditional), use this:
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,700&display=swap&subset=chinese-traditional');
See below example after making this change:
6- Update the font-family
CSS rule found just a few lines lower, to use the new font.
To do this, change the text:
"Open Sans"
To be:
"Noto Sans SC"
for Chinese (Simplified). Make sure the quotation marks are included.
"Noto Sans TC"
for Chinese (Traditional). Make sure the quotation marks are included.
See below example after making this change:
7- Click "Save" and you are done.
Now your template will load the needed font for displaying Chinese characters correctly.