أعتقد أن جميعنا حاول أكثر من مره أن يستخدم خطوط عربيه جديده فى قالب مدونته على غرار الخطوط الأجنبيه الجديده التى قدمتها جوجل فى الآونه الأخيره , حيث قدمت لنا جوجل مجموعه كبيره من الخطوط الأجنبيه الجديده والتى تمتاز بشكلها الجميل والمختلف عن الخطوط التى إعتاد المدونون على إستخدامها فى مدوناتهم منذ بداية التدوين مع بلوجر .
جربنا كثيرا كل خط من هذه الخطوط الأجنبيه حتى نجد خطا ملائما للتدوين العربى , ولكننا لم نجد أى منهم يصلح للتدوين باللغه العربيه , ولكن جوجل لم تترك المدونين العرب طويلا بدون طرحها لبعض الخطوط العربيه التى تساعدهم على تحسين وتغيير شكل محتواهم .
وجوجل تقدم لنا الآن 6 خطوط عربيه جديده وهى :
الشق الأول : إضافة رابط الخط
إفتح أكواد HTML الخاصه بقالب مدونتك , ثم قم بالبحث عن الكود التالى
ملحوظه : عليك بوضع السطر الخاص بالخط المطلوب فقط وليس كل الخطوط .
والآن تستطيع تغيير الخط على كل أجزاء المدونه , فقط عليك معرفة كود الجزء المراد تغيير الخط فيه , وإليك شكل أكواد CSS الخاص بكل خط من الخطوط السابقه وبنفس الترتيب
ملحوظه : عليك إستخدام كود واحد من الأكواد التاليه , وإختر هذا الكود على أسس إختيارك لكود نوع الخط السابق .
جربنا كثيرا كل خط من هذه الخطوط الأجنبيه حتى نجد خطا ملائما للتدوين العربى , ولكننا لم نجد أى منهم يصلح للتدوين باللغه العربيه , ولكن جوجل لم تترك المدونين العرب طويلا بدون طرحها لبعض الخطوط العربيه التى تساعدهم على تحسين وتغيير شكل محتواهم .
وجوجل تقدم لنا الآن 6 خطوط عربيه جديده وهى :
- Amiri
- Droid Arabic Kufi
- Droid Arabic Naskh
- Lateef
- Scheherazade
- Thabit
Amiri
Droid Arabic Kufi
Droid Arabic Naskh
Lateef
Scheherazade
والآن كيف نستخدم هذه الخطوط فى مدوناتنا على بلوجر ؟
تنقسم الخطوات إلى شقينالشق الأول : إضافة رابط الخط
إفتح أكواد HTML الخاصه بقالب مدونتك , ثم قم بالبحث عن الكود التالى
وضع تحته مباشرة الكود الخاص بالخط وهو كالتالى للخطوط السته على التوالى<head>
ملحوظه : عليك بوضع السطر الخاص بالخط المطلوب فقط وليس كل الخطوط .
الشق الثانى : تعديل نوع الخط فى الجزء الذى تريد تغييره<link href='http://fonts.googleapis.com/earlyaccess/amiri.css' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/earlyaccess/lateef.css' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/earlyaccess/scheherazade.css' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/earlyaccess/thabit.css' rel='stylesheet' type='text/css'/>
والآن تستطيع تغيير الخط على كل أجزاء المدونه , فقط عليك معرفة كود الجزء المراد تغيير الخط فيه , وإليك شكل أكواد CSS الخاص بكل خط من الخطوط السابقه وبنفس الترتيب
ملحوظه : عليك إستخدام كود واحد من الأكواد التاليه , وإختر هذا الكود على أسس إختيارك لكود نوع الخط السابق .
وأخيرا يمكنكم الإستعانه بهذه الصفحه , وهى الصفحه الرئيسيه الخاصه بجوجل والتى تقدم هذه الخطوط .font-family: 'Amiri', serif;font-family: 'Droid Arabic Kufi', serif;font-family: 'Droid Arabic Naskh', serif;font-family: 'Lateef', serif;font-family: 'Scheherazade', serif;font-family: 'Thabit', serif;
اريد كود الخط الذي تستخدمه عندك في مدونتك
ردحذفالخط الذى أستخدمه هو Droid Arabic Kufi وستجد الطريقه بالأعلى .
حذفأزال المؤلف هذا التعليق.
ردحذفالسلام عليكم.. أخي من فضلك الخط يعمل جيدا في google chromأما علىinternet explorer لا يعمل بشكل المطلوب!!! النقاط تظهر على شكل مربعات.
ردحذفشكرا على مجهودك
http://salsabileparadise.blogspot.com
أين أجد الكود المسؤول على خط القوائم
ردحذفكما في الصورة
أريد تغيير الخط الى Droid Arabic Kufi
http://up.arab-x.com/May12/tpb32599.png
الاخ ياسر اسماعيل
ردحذفكفيت ووفيت
إلى الامام يا دكتور
مشاء الله خط جميل جدا
ردحذفطبقت الخطوات لاكن لا تنجح اليك المدونة لتعرف ما السبب http://ar-alfrsan-tv.blogspot.com/
ردحذفطبق الخطوات بالظبط وبدل الخط فى كل جزء من المدونه
حذفموضوع في غاية الروعة كنت ابحث عن الخطوط وبجانبها الصور اتمني زيارة مدونة
ردحذفبرنامج علي متصفح
اريد خط مثل هذه المدونة
ردحذفhttp://konozblog.blogspot.com/
ردحذفشكرا اخي الغالي على الشرح المتقن والاحترافي
العمل من الانترنت
شكرا لك تم التطبيق
ردحذفhttp://albnt.blogspot.com/
شكراا على الموضوع الرائع
ردحذفلقد تم التطبيق بنجاح على
http://afkarpro.blogspot.com/
شكرا جزيلا لقد طبقت خط Droid Arabic Kufi في مدونتي http://www.noukatmar.tk
ردحذفشكرا لك ..
ردحذفhttp://ec4learn.blogspot.com/
مشكوووور أخي .. شرح مميز وطريقتك جذابة
ردحذفhttp://fla4-back.blogspot.com/
ممكن تشرح الشق الثاني
ردحذفعمل رائع اخي شكرا
ردحذفبالتوفيق
زووم العربية
عندي في المدونه يغير العناوين ولا يغير الخط داخل المواضيع
ردحذفللمعاينه
ردحذفhttp://al5odary.blogspot.com
ربما تكون لاتفعل الخطوات بشكل صحيح MedØ ELkhodary
ردحذفانا عامله تمام بس مش خط المدونة كله اتغير حاجات معينة بس و انا عايز اغير خط كل حاجة و عايز كمان اغير خط كلام التدوينه زي عندك ده ازاي يعتي ايه
ردحذفعلي ما اعتقد اني عايز احط font-family في class معينهة صح او ايه الحل بتاعك
اخى حرر القالب font-family: وغير كل مابجانبة بالقالب
حذفعملت كدة و لسة بردو بس ده معناه ان في كتير مفيهاش font-family و محتاجة اني اضفها
ردحذفاخى اعطنى القالب وانا اقوم بالازم لك
حذفشكرا لك اخى شرفنا بزيارتك
ردحذف.....
www.m7loma.co.vu
العفو فى خدمتك دائماا
حذفشرح رائع و مدونة اروع شكرا لقد تمت العملية بنجاح
ردحذف(قالب معرب)
شكرا لك اخى نتمنى الزيارة مرة اخرى
حذف