Jump to content

Chinese fonts: Customising individual pages and why do these fonts appear different on different devices?

Go to solution Solved by tuanphan,

Recommended Posts

Hey!

So I have two questions and I'm going to post them both to save spamming the forum. My website is: http://choypingclarkeng.com/

1: I want to make the Chinese text on this page into a different font/size etc. You can see it also isn't really in line with the English text either. https://www.choypingclarkeng.com/theatremaking/wwww

Screenshot(82).thumb.png.e311539dec870970b82000158e6e741b.png

 

2: On my Mac, the font I want for the main links shows up for the Chinese text. I've adjusted this in code injection to make it look right.

Screenshot2023-12-24at14_12_19.thumb.png.f48c14ba53b91af8b320143451c3d7a5.png

However on my Windows laptop and Android phone, the Chinese text is in a different font/size/etc.

Screenshot(81).thumb.png.20f4edc427a1b647c80a9489f5521752.png

And on my Android:

WhatsAppImage2023-12-24at2_28_01PM.thumb.jpeg.e6e1f3990e03decc84772269e8a5609b.jpeg

Is there a way to fix this so it will look like the style I want? It's really annoying! Thank you.

Link to comment
  • Replies 2
  • Views 1.3k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

  • Solution

#1. Edit this code from Code Injection

<script>
  $("span.portfolio-hover-item-content:contains('遊遊野野')").html(function(_, html) {
   return html.replace(/(遊遊野野)/g, '<span class="chinese">$1</span>');
});
</script>

to this code

<script>
   $("span.portfolio-hover-item-content:contains('遊遊野野')").html(function(_, html) {
   return html.replace(/(遊遊野野)/g, '<span class="chinese">$1</span>');
});
// theatremaking www page 
$(".html-block h2:contains('遊遊野野')").html(function(_, html) {
   return html.replace(/(遊遊野野)/g, '<span class="chinese2">$1</span>');
});
// theatremaking www page - team
$(".html-block p:contains('吳彩萍')").html(function(_, html) {
   return html.replace(/(吳彩萍)/g, '<span class="chinese3">$1</span>');
});
</script>
<style>
  .chinese2 {
    font-size: 30px !important;
}
.chinese3 {
    font-size: 10px !important;
}
</style>

#2. 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.