This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This thread is resolved. Here is a description of the problem and solution.

Problem:

I just need to change google font for another language.

Solution:

1. Locate the header.php file of your theme.

2. Open it with a code editor.

3. Add this code to the file before the closing tag.

<?php if(ICL_LANGUAGE_CODE == 'ar'): ?>
        <!-- Arabic language style -->
        <link href="https://fonts.googleapis.com/css?family=Tajawal&display=swap" rel="stylesheet">
        <style type="text/css">
        body, p, h1, h2, h3, h4, h5, h6 {
            font-family: 'Tajawal', sans-serif !important;
        }
        </style>
    <?php else: ?>
    <!-- English language style -->
    <link href="https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,400i&display=swap" rel="stylesheet">    
    <style type="text/css">
        body, p, h1, h2, h3, h4, h5, h6 {
            font-family: 'IBM Plex Mono', monospace !important;
        }
    </style>
    <?php endif; ?>

4. Save the file.

5. See if the different Google fonts are loading for each language.

*Note: the style part in this snippet is specific to what the user needed. The languages involved are Arabic and English.

This topic contains 9 replies, has 3 voices.

Last updated by mahmoodH-3 2 months ago.

Assigned support staff: Itamar.

Author Posts
August 18, 2019 at 10:34 pm #4412765

mahmoodH-3

Tell us what you are trying to do?
I just need to change google font for another language.

Is there any documentation that you are following?
Yes,

Is there a similar example that we can see?
I haven't

What is the link to your site?
hidden link

August 19, 2019 at 3:06 am #4413275

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

Thank you for contacting WPML Support. Currently there are no settings within WPML to set different fonts for different languages but you can create a different style.css file for each language which will contain different google font, then include the style.css file in your theme's header.php file according to selected language.

You can use ‘ICL_LANGUAGE_CODE’ constant to get current language code and you can use it in your site header.php file in this way:

<?php if(ICL_LANGUAGE_CODE == 'fr'): ?>
	French language style goes here	      
<?php elseif(ICL_LANGUAGE_CODE == 'ar'): ?>
	Arabic language style goes here	
<?php else: ?>
	English/other language style goes here		
<?php endif; ?>

Here is doc:
https://wpml.org/documentation/support/wpml-coding-api/

Thank you

August 19, 2019 at 6:12 am #4413657

mahmoodH-3

Hi Noman,

Thanks for the help. So, I use google font. below the details,

font-family: 'Tajawal', sans-serif;
<link href="hidden link" rel="stylesheet">

So, How I include this?
What is ICL_LANGUAGE_CODE?

Thanks.

August 19, 2019 at 11:30 am #4415557

mahmoodH-3

Also, Now I get 500 internal error when I switch the languages.

Thanks.

August 19, 2019 at 1:45 pm #4416579

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

ICL_LANGUAGE_CODE is a constant that we use to get current language code and we can display content accordingly.

You need to write below code in header.php:

<?php if(ICL_LANGUAGE_CODE == 'ar'): ?>
    	<!-- Arabic language style -->
		<link href="<em><u>hidden link</u></em>" rel="stylesheet">
		<style type="text/css">
		body, p, h1, h2, h3, h4, h5, h6 {
			font-family: 'Tajawal', sans-serif !important;
		}
		</style>
	<?php else: ?>
    <!-- English language style -->
	<link href="<em><u>hidden link</u></em>" rel="stylesheet">    
	<style type="text/css">
		body, p, h1, h2, h3, h4, h5, h6 {
			font-family: 'IBM Plex Mono', monospace !important;
		}
	</style>
	<?php endif; ?>

I have written CSS in style tag, you can include separate CSS files for each language if you want.

Thank you

August 19, 2019 at 2:19 pm #4416817
mahmoodH-3

Hi Noman,

Thank you very much for your help. But when I switch the language a few times so I get Internal error for it.

I contact my hosting and ask. They told there are haven't any issue on their side. Also, I and hosting company decide this error come from WPML.

BEcause this error comes only if we switch the language.

Can you help me to fix this?

Thanks.

New threads created by Noman and linked to this one are listed below:

https://wpml.org/forums/topic/500-internal-error-when-i-switch-the-languages/

August 19, 2019 at 2:52 pm #4416973

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

To handle internal server error issue, I have created a new ticket since this is a separate issue. Here is the link to the new ticket:https://wpml.org/forums/topic/500-internal-error-when-i-switch-the-languages/

If you current ticket issue is resolved, you may mark this ticket as resolved and we will continue to work on the new ticket.

Thank you for your cooperation and patience.

August 19, 2019 at 3:33 pm #4417123

mahmoodH-3

Hi, Noman.

Thanks for your support.

If I add this code using Code Snippets plugin so My Arab text change to google fonts?

What are other necessary steps?

Much appreciated if you can provide step by step guideline.

Thanks

August 20, 2019 at 7:54 pm #4426207

Itamar
Supporter

Languages: English (English ) Hebrew (עברית )

Timezone: Asia/Jerusalem (GMT+03:00)

Hi.

Noman is not available today, so I'll continue to handle this ticket. I hope that it is alright with you.

You ask: "If I add this code using Code Snippets plugin so My Arab text change to google fonts?"
I'm not familiar with the Code Snippet plugin, but if this plugin can add this code to the header.php file of your theme, then it should work.

Without the Code Snippet plugin, here is what you need to do.
1. Locate the header.php file of your theme.
2. Open it with a code editor.
3. Add this code to the file before the </head> closing tag.

<?php if(ICL_LANGUAGE_CODE == 'ar'): ?>
        <!-- Arabic language style -->
        <link href="<em><u>hidden link</u></em>" rel="stylesheet">
        <style type="text/css">
        body, p, h1, h2, h3, h4, h5, h6 {
            font-family: 'Tajawal', sans-serif !important;
        }
        </style>
    <?php else: ?>
    <!-- English language style -->
    <link href="<em><u>hidden link</u></em>" rel="stylesheet">    
    <style type="text/css">
        body, p, h1, h2, h3, h4, h5, h6 {
            font-family: 'IBM Plex Mono', monospace !important;
        }
    </style>
    <?php endif; ?>

4. Save the file.
5. See if the different Google fonts are loading for each language.

Please let me know if this information is helpful to you.

Regards,
Itamar.

August 20, 2019 at 9:25 pm #4426629

mahmoodH-3

My issue is resolved now. Thank you!