Home > General > Affiliate Marketing Forum

How do i display arabic text in HTML? (15)


08-08-2014 11:31 AM #1 karim0028 (Member)
How do i display arabic text in HTML?

Hey Guys,

What text format do you need to use in HTML to properly display right to left text based languages like arabic and hebrew?

i copy and pasted arabic text from One hour translation and try and copy and paste it into Sublime or my HTML editor and it becomes unreadable and disjointed....


08-08-2014 12:46 PM #2 thepeopleschamp (Member)

This is what i use and it works fine. Not sure it makes everything 100% correct but it converts fine so fuck it!

In your landing page, change <body> to <body dir="rtl">

leave </body> as normal

Thats it!


08-08-2014 12:49 PM #3 karim0028 (Member)

i should have clarified, im doing this in a javascript popup type landing page.... So, the whole page is just a JS pop... I've been trying to figure this out for 2 hrs now...

Im using utf- 8

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

i changed the <body dir="rtl">

still the writing is disjointed...

Any more ideas?


08-08-2014 01:55 PM #4 thepeopleschamp (Member)

Here you go

Code:
<script>
        function init() {

            alert(('arabic text line 1' +
            'arabic text line 2')) ;
            window.location.href='http://meatspin.com';
        }
        window.onload = init;

    </script>
You can add more lines if you wish. Just be careful pasting regular latin letters/numbers in there as it makes copy+pasting a bitch. Just make sure once done that it appears the same as your translated text.


08-08-2014 02:19 PM #5 karim0028 (Member)

thanks,

but this doesnt do anything different

i was already doing this

<script type="text/javascript">

alert("<?php echo $p1; ?> \n\n<?php echo $p2; ?>\n\n");
window.location="blah.com";

</script>


08-08-2014 02:20 PM #6 Adamw (AMC Alumnus)

In addition to the rtl CSS, we also used this:

Code:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ar">
    <head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
and we had no issues


08-08-2014 02:23 PM #7 karim0028 (Member)

Here is my entire page

<?php
switch(x){
default:

$headline = "\u20ﺪﺪﻳﻭﺭﺪﻧﻷا ﻡﺎﻈﻧ ﻦﻣ ﺔﻟﺎﺳﺭ ﺔ";
$p1 = "!ﺔﺤﻴﺤﺻ ﺔﻘﻳﺮﻄﺑ ﺔﻳﺭﺎﻄﺒﻟا ﻦﺤﺷ ﻢﺘﻳ ﻻ ***ﺮﻳﺬﺤﺗ***";
$p2="!ﺎﻬﺑ ﺢﺼﻨﻳ ﻲﺘﻟا ﺪﻳﻭﺭﺪﻧﻷا ﺓﺰﻬﺟﺃ ﺕﺎﻳﺭﺎﻄﺑ ﺔﻳﺎﻤﺣ ﺕﺎﻘﻴﺒﻄﺗ ﺙﺪﺣﺃ ﻞﻳﺰﻨﺘﺑ ﻢﻗﻭ 'ﻖﻓاﻮﻣ'' ﻂﻐﺿا ،ﻒﻠﺘﻠﻟ ﺔﻳﺭﺎﻄﺒﻟا ﺽﺮﻌﺗ ﺐﻨﺠﺘﻟ ";



}
?>




<!DOCTYPE HTML>

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>

<body dir="rtl">





<script type="text/javascript">



//alert("<?php echo $headline; ?>");

alert("<?php echo $p1; ?> \n\n<?php echo $p2; ?>\n\n");
window.location="http://blah.com";
</script>

</body>

</html>

Even posting the arabic here doesnt work...

I found this old post from 2006

http://www.webdeveloper.com/forum/sh...ript-alert-box

it talks about \u202b but i cant figure out how to use that...


08-08-2014 02:28 PM #8 Adamw (AMC Alumnus)

I just pasted:

https://www.dropbox.com/s/9ns9wizhi7...2010.26.53.png


and checked in the browser:

https://www.dropbox.com/s/infw1sjak9...2010.26.34.png

Should it look different than that?


08-08-2014 02:32 PM #9 karim0028 (Member)

yeah, what is showing in the pop is the 2nd and 3rd line

look at your 2nd and 3rd lines of arabic txt in the first screenshot and then look at the 2nd screenshot...

pay attention to the ***wording*** in the first screenshot the wording is on the right, in the second its on the left...\

in sublime its correct in the pop its not..


08-08-2014 02:43 PM #10 Adamw (AMC Alumnus)

you want it like this?

https://www.dropbox.com/s/z2aql20dhz...2010.42.12.png


08-08-2014 02:45 PM #11 karim0028 (Member)

haha, no, its not about moving the individual text around...

Its gotta be written exactly like the first screenshot in sublime otherwise its just jumbled letters...


08-08-2014 02:49 PM #12 Adamw (AMC Alumnus)

hmmm I'm not sure... when OHT did ours, they did it in left to right, and we copied and pasted it exactly into our page... and then added the dir="rtl"

So I'd ask the translator to post it how it would be written in left to right, and do that.


08-08-2014 02:51 PM #13 karim0028 (Member)

i speak arabic, so i know what its supposed to look like...

The translation is fine. Its getting it to display properly in HTML thats a bitch...


08-13-2014 03:50 AM #14 zeno (Administrator)

Try applying dir="rtl" to the html tag, not the body tag.

In some browsers this will alter the UI substantially.

A better solution would be moving to an HTML dialog/jQuery pop instead of alert(), which is less browser/locale dependent.


08-13-2014 03:51 AM #15 Adamw (AMC Alumnus)

What worked for us is how I mentioned above... Other than that tho I have no idea


Home > General > Affiliate Marketing Forum