اذهب إلى المحتوى
  • 0

كيف أجعل بوتستراب يدعم اللغة العربية؟

المبرمج العربي

السؤال

Recommended Posts

  • 1

توجد عدّة مشاريع لدعم اللغة العريبة لمشروع بوتستراب من أشهرها هذا المشروع، لكن بالنسبة لي وللكثير من المبرمجين، فأنا أفضل أن أعدّل بنفسي على الموقع لجعله يدعم العربية مثلا عن طريق وضع هذا السطر:

<html lang="ar">

واستخدام خط درويد نسخ للموقع:

  <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/droid-arabic-naskh" type="text/css"/> 

ومن ثم اجعل اتجاه النص من اليمين لليسار و أعدل على تنسيق CSS لجعله يستخدم الخط السابق:

body {
	font-family: 'DroidArabicNaskhRegular';
    font-weight: normal;
    font-style: normal; 
	direction: rtl;
}

هذه بعض الأشياء البسيطة التي أقوم بها لدعم اللغة العربية في مشروع بوتستراب.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

من المستحسن استعمل المكتبة التي ذكرها الاخ هشام وهي مكتبة Bootstrap RTL حيث توفر عليك الجهد والعمل وتقوم بتعديل كل التنسيقات مثل float,direction,text-align.

وبالتالي سيكون كود html هكذا:

<!DOCTYPE html>
<html lang="ar">
    <head>
        <meta http-equiv="Content-Language" content="ar">
        <meta http-equiv="content-Type" content="text/html; charset=UTF-8">
        <!--IE Compatibility Meta-->
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <!--Mobile Meta-->
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- Bootstrap -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
        <!-- Bootstrap RTL -->
        <link rel="stylesheet" href="http://cdn.rawgit.com/morteza/bootstrap-rtl/v3.3.4/dist/css/bootstrap-rtl.min.css">
        <!--ِ ِCustom CSS -->
        <link rel="stylesheet" href="style.css">
        <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
        <title>Title_Here</title>
        <link rel="icon" type="image/x-icon" href="Icon_url_here" />
    </head>
    <body>
        <!-- Content Here -->
    </body>
</html>

وغالبا ما استعمل هذا الكود في بداية كل مشروع عربي.

ومن ثم قم بتغيير نوعية الخط الى خط خاص باللغة العربية من خلال ملف css:

@import url(http://fonts.googleapis.com/earlyaccess/amiri.css);

body {
 font-family: 'Amiri', serif; 
}

المزيد من الخطوط العربية

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...