CSS Font-Face with the Arabic Fonts

how to I use an Arabic font in my css?

What do you mean with Arabic fonts? Most "normal" fonts we use every day will work just fine in CSS. Do make sure to set the RTL properties though, where needed. After all, you don't want Arabic people to read left-to-right, do you? :-)

<html dir="rtl"> (combined with an English website it looks funny, but it's what you need for Arabic and other RTL languages)

css arabic ttf font doesn't work

Your font from the jsFiddle works and displays correctly for me (in firefox 36), at least, it is arabic script, so I assume that's the desired result, although I can't understand it.

What browser are you using?

update 1

You need to ensure the font ttf is referenced correctly, you need to upload the ttf to the website and link to it, so for example only, if you are saving the ttf to /includes/fonts/CSDiwany4S_Inormal.ttf then your CSS should look like this

@font-face {
font-family: myFont;
src: url("/includes/fonts/CSDiwany4S_Inormal.ttf");
}

div {
font-family: myFont;
}

And this will work.
You have told me your font should look like this:

http://photoshop.cc/wp-content/fonts/arabic_fonts_img/horr/new/Tachkili%20Font%20TTF.gif (this is primarily for other westerners here who are seeing the original basic arabic font on the jsFiddle and are assuming that this is the intended output).

Installing Arabic fonts on Wordpress

I installed another plugin "Use any font" and the applied that font on the Arabic website by the following code:

:lang(ar)   {
font-family: fontname !Important;
}

And done!

I found this solution, not sure if that should be done or not, but solved my issue. :)

CSS Font-Face with the Arabic Fonts

how to I use an Arabic font in my css?

css arabic ttf font doesn't work

update 1

Installing Arabic fonts on Wordpress

Related Topics

Leave a reply