Set font for additional language

  • Hello,
    I added additional language on my website. And looks like native Twenty Twenty fonts do not work with new language. So it looks like Arial. Maybe is there any way to set Times New Roman for additional language?

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

  • If you have separate pages for the separate languages – or at least separate headers – then you should be able to add a class to the body tag in the header.
    Once you do that, you can define the font-family for each page.

    So, for instance, your header would have
    body class="Russian"
    Then your css would have
    body.Russian div.elementor-widget-container {font-family: "Times New Roman";}

    There are different fonts used for different areas (such as the menu) so you can define each area’s font-family separately, or if you want to use the same font throughout, just set
    body.Russian {font-family: "Times New Roman";}

    You wouldn’t have to set a different class for the English site, as this will only affect the Russian pages.

    Thread Starter handmadehome

    (@handmadehome)

    I tried to add

    <?php

function append_language_class($classes) {
    $classes[] = 'lang-' . ICL_LANGUAGE_CODE;
    return $classes;
}
add_filter('body_class', 'append_language_class');?>

    And
    body.Russian {font-family: "Times New Roman";}

    But looks like that doesn’t work.

    I also noticed that when I edit the page font is okay. But on published page it differs. Maybe it’s possible to make them match?

    • This reply was modified 2 years, 10 months ago by handmadehome.

    Hmm, I’m not sure what that php code will do, but I can tell you that things are much simpler than that. Probably.

    Open the header.php file (for the Russian version of the site) and find the line
    <body <?php body_class(); ?>>
    Now you can just add your new class to that, like so:
    <body <?php body_class( 'Russian' ); ?>>

    Then the css
    body.Russian {font-family: "Times New Roman";}
    should work throughout the site.

    I don’t use the block editor so I can’t speak to how it displays when you edit vs published, but if the Preview is the same as Published then you can at least test things that way.

    Thread Starter handmadehome

    (@handmadehome)

    Thank you so much!

    Glad to help!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Set font for additional language’ is closed to new replies.

Tags