Code for updating arabic translation font is not working

  • Resolved meralyasser

    (@meralyasser)


    1 year, 8 months ago

    Hi, I am using translatepress on an ecommerce website using Flatsome theme. The website is in English and its translated to arabic language. Currently, I don’t like the font used and would like to use an arabic google font like “Cairo” for example. I checked other topics with same issue where you asked to add the following code to the customizer >> additional css but this didn’t work for me and the arabic language is still displaying the original english font which doesn’t look nice. I would appreciate if you could help me know where the problem is. Thanks in advance.

    @import?url(‘https://fonts.googleapis.com/css2?family=Cairo&display=swap’);
    body.translatepress-ar{
    font-family:Cairo;
    }

Viewing 2 replies - 1 through 2 (of 2 total)
  • Dragos

    (@dragosvrejiu)

    Hello,

    Thank you for getting in touch with us!

    Try adding !important at the end of the instruction.

    Something like font-family: Cairo !important;

    Best wishes,

    Thread Starter meralyasser

    (@meralyasser)

    Thank you for your response.

    After doing some search, I noticed I have to host the google font file locally in woff format and add this code.

    @font-face {
    font-family: ‘[google-font-name]’;
    src: url(‘[website-address]/fonts/[google-font-name].woff’) format(‘woff’);
    font-weight: normal;
    font-style: normal;
    }

    .translatepress-ar *{
    font-family: “[google-font-name]” !important;
    }

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Code for updating arabic translation font is not working’ is closed to new replies.