Skip Navigation

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

Problem:
The client was unable to change the font for their site when translated from English to Arabic using the Divi theme. They attempted to apply custom CSS to set the font-family for the Arabic language but it did not work. Additionally, they encountered issues translating large portions of the site, particularly in widgets from plugins.

Solution:
We recommended adding custom CSS code to change the font for a specific language. Here is an example of the code that should be added to the Appearance > Customizer > Custom CSS area:

html[lang="he-IL"] {font-family: Alef !important; font-size: 24px !Important;}

The client should replace "he-IL" with the correct language code for Arabic and "Alef" with the desired font family name. We also discovered that the issue might be related to Divi Caching, which has a font set for the Arabic language that could be overriding the custom CSS. We suggested clearing the Divi cache and checking the Divi options for font settings that might be set per language. If the client was not the one who built the site, we advised consulting with the person who did for more information on how the fonts were set up.

For the issue of translating large portions of the site, we asked the client to open a new ticket, as per our Support Policy, which states that we handle only one issue per ticket.

If this solution does not seem relevant, please open a new support ticket with us.

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.

Tagged: 

This topic contains 6 replies, has 2 voices.

Last updated by nouraZ 1 year, 3 months ago.

Assisted by: Mihai Apetrei.

Author Posts
November 21, 2023 at 7:40 pm #14890673

nouraZ

Hello, I'm having trouble figuring out how to change the font for the translated site (from English to Arabic). I am using the Divi theme and cannot find any information on it or find a setting to set the translated font on the backend. Help, please and thanks.

November 21, 2023 at 8:14 pm #14890831

Mihai Apetrei
Supporter

Languages: English (English )

Timezone: Europe/Bucharest (GMT+02:00)

Hi there.

You will need some CSS code to do that.

Example:


html[lang="he-IL"] {
 
font-family: Alef !important;
font-size: 24px !Important;
 
}

The code needs to be added in the Appearance > Customizer > Custom CSS area.

Depending on the language that you will use, you will have to change "he-IL" to the proper language lang code.

Depending on the font that you will use, you will have to change "Alef" to the font's family name.

I hope that you will find this information helpful.

PS - Similar existing ticket for the same request:
https://wpml.org/forums/topic/how-to-make-different-font-for-two-languages/

Please let me know how things go.

Kind regards,
Mihai Apetrei

November 21, 2023 at 8:29 pm #14890849

nouraZ

Hello Mihai, thanks for your reply, unfortunately that did not work.
I used the following:
/*arabic font*/
html[lang="ar"] {
font-family: Arial !important;
}

November 21, 2023 at 10:11 pm #14891625

nouraZ

I also tried this:

/*arabic font*/
html[lang="ar"] body p,
html[lang="ar"] body a,
html[lang="ar"] body h1, html[lang="ar"] body h2,
html[lang="ar"] body h3, html[lang="ar"] body h4,
html[lang="ar"] body h5, html[lang="ar"] body h6,
html[lang="ar"] body span,
html[lang="ar"] body strong
{
font-family: Cairo !important;
}

November 21, 2023 at 10:23 pm #14891653

Mihai Apetrei
Supporter

Languages: English (English )

Timezone: Europe/Bucharest (GMT+02:00)

Hi there and thank you for the updates.

I would like to request temporary access (wp-admin and FTP) to your site to take a better look at the issue. You will find the needed fields for this below the comment area when you log in to leave your next reply. The information you will enter is private which means only you and I can see and have access to it.

Our Debugging Procedures

I will be checking various settings in the backend to see if the issue can be resolved. Although I won't be making changes that affect the live site, it is still good practice to backup the site before providing us access. In the event that we do need to debug the site further, I will duplicate the site and work in a separate, local development environment to avoid affecting the live site.

Privacy and Security Policy

We have strict policies regarding privacy and access to your information. Please see:
https://wpml.org/purchase/support-policy/privacy-and-security-when-providing-debug-information-for-support/

**IMPORTANT**

- Please make a backup of the site files and database before providing us access.

- If you do not see the wp-admin/FTP fields this means your post & website login details will be made PUBLIC. DO NOT post your website details unless you see the required wp-admin/FTP fields. If you do not, please ask me to enable the private box.

The private box looks like this: hidden link

I will be waiting for your response.

Kind regards,
Mihai Apetrei

November 22, 2023 at 10:31 pm #14902791

nouraZ

Hello, I have continued to translate the site while I wait for your response. and now it seems in addition to the font, I also can't figure out how to translate big chunks of the site (mostly in widgets from plugins).

November 23, 2023 at 8:41 am #14904885

nouraZ

Hello again, yup that did it! Thanks for the help! happy to know how to deal with this in the future.. Thank you so much for all the help!