اضافة افضل ثلاثة خطوط في الويب لمدونات بلوجر باحترافيه

بسم الله والصلاة والسلام على رسول الله ,السلام عليكم اخواني اخواتي ,أعتقد أن جميعنا حاول أكثر من مره أن يستخدم خطوط عربيه جديده فى قالب مدونته على غرار الخطوط السته العربيه التي قدمتها جوجل مؤخرا ولكن البعض منا يريد ان يميز مدونته بخط اكثر جمالا ووضوحا لتظهر بشكل مميز واحترافي  ولكنه يجد عائقا في اضافة هذه الخطوط الى مدونته ,  واليوم باذن الله سنتطرق الى كيفية تجاوز هذا العائق واضافة افضل ثلاثه خطوط في الويب الى مدونات بلوجر بطريقه سهله جدآ واحترافيه ,,,



كيفية اضافة هذا الخط الى مدوناتكم

1- من  لوحة التحكم -> قالب -> تحرير HTML
2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
</head>
  
وقم بلصق كود الخط الذي تريده قبله تماما 

 

الخط الاول GESSTwoLight

كود الخط الاول

<link href='https://googledrive.com/host/0B-3cyo_HIYMIbGhrM09nZk5sVmc/GESSTwoMediumRegular.css' rel='stylesheet' type='text/css'/>





الخط الثاني GESSTwoMediumRegular

كود الخط الثاني

<link href='https://googledrive.com/host/0B-3cyo_HIYMIbGhrM09nZk5sVmc/GESSTwoMediumRegular.css' rel='stylesheet' type='text/css'/>






الخط الثالث DroidKufi-Bold


كود الخط الثالث

<link href='https://dl.dropboxusercontent.com/s/0saazd998wx8vpn/DroidKufi-Bold.css' rel='stylesheet' type='text/css'/>



الآن بعد ان اضفت كود الخط الذي اخترته  الى القالب تبقى لك خطوه اخيره لكي يظهر هذا الخط في مدونتك  , كل ماعليك الان  هو تغير اسم الخطوط في القالب , وخصوصا الأوسمة المهمه مثل الـ h2 , h3 , h1 , باسم الخط الذي اخترته ولتغيير اسم الخطوط في مدونتك قم بعمل الاتي:

قم بالبحث داخل القالب عن الكود التالي    

Font-family:
 

Font-family:Arial, Tahoma,vardana;       ستجده غالبا بهذا الشكل 

  font-family: كل ماعليك الان هو  استبدال اسم الخط الذي يلي كود الــــ

باسم الخط المطلوب الذي  سبق واضفته لمدونتك 

         GESSTwoLight   وفي مايلي مثال لاضافة الخط الاول المسمى بـ

قبل
Font-family:Arial, Tahoma,vardana;

بعد

Font-family:GESSTwoLight, Tahoma, vardana;


لاحظ هنا اننا قمنا باستبدال اسم الخط Arial   باسم الخط الجديد الذي اضفناه الى المدونه وهو  GESSTwoLight
الان قم بتكرار العمليه على باقي اكواد font-family 

واذا اردت تغيير خط المدونه بالكامل فقم بالبحث عن الكود التالي


body{

واضف الكود التالي بعده مباشره

Font-family:GESSTwoLight, Tahoma, vardana;

وبالاخير قم بحفظ القالب ومعاينة المدونه ومبروك عليك اشهر ثلاثه خطوط في الويب

اذا واجهتك اي مشكله في اضافة الخط الى مدونتك قم بكتابة تعليق وسيتم الرد عليك ان شاء الله

هناك 55 تعليقًا:

  1. غير معرف20/8/13 23:58

    شكرا لاك أخي على الموضوع

    ردحذف
    الردود
    1. العفو اخي شكرا لمرورك العطر

      حذف
  2. أزال المؤلف هذا التعليق.

    ردحذف
  3. غير معرف20/8/13 23:59

    أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  4. جميلل
    اتمنى ان تضيف خاصية اضفنا الى المفضلة
    في كل من google chrom/mozilla/explorer

    ردحذف
  5. عبد الكريم31/8/13 01:38

    الله يحفظلك أمك أخي
    لم تنجح مع الطريقة جرب كل الروابط ولم تفلح معي
    ارجوك اعطيني نصيحة ارجوك

    ردحذف
    الردود
    1. اخي بعد اصافة الكود الى مدونتك
      يجب عليك استبدال اسم الخطوط الوجوده في مدونتك باسم الخط الجديد الذي اضفته الى القالب

      حذف
  6. جزاك الله خير اخى .. ولكن للاسف لم تفلح معى ... ركبت الكود كويس فى المكان المناسب .. غيرت اسم الخطوط كلها للخط الى اخترته الى هو الثالث .. ولكن للاسف ماذال الخطوط لم تتغير .. وللعلم انا مركب قالب انت وضعته من فتره فى احد المواقع


    انظر اخى
    http://thaptalmbda89.blogspot.com/
    لم يتغير شئ... فما هى المشكله .

    ردحذف
    الردود
    1. اخي اذا لم يظهر الخط في مدونتك قم بعمل الاتي

      قم بالبحث عند الكود التالي

      ]]>


      والصق الكود التالي قبله تماما

      @font-face {
      font-family: 'DroidKufi-bold';
      font-style: normal;
      font-weight: 700;
      src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot);
      src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),
      url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff2) format('x-woff2'),
      url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff) format('woff'),
      url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.ttf) format('truetype');
      }

      وان شاء الله سوف يظهر الخط في مدونتك

      حذف
  7. مبدع والله اخي استمر

    ردحذف
  8. غير معرف29/9/13 01:52

    صباح الخير اخي اتمنى انك بخير اخوي ولا عليك امر انا توني فاتح مدونه ومالي خبره في المدونات لاقيت قالب عرب سيع واعجبني وحملته والحين مركب على المدونه بس ابغى عليه تعديلات ولا عليك امر اذا تقدر
    ابغى اعلانات قوقل ادسنس تظهر على يمين ويسار الصفحة
    وابغى اغير الاقسام حقي تظهر محل الاقسام الي موجوده الي مركبه على القالب
    وكمان ما ادري هل الون اقدر عدله ام لا غير الاسود اقصد
    والاهم انا اخر كل تدوينه يظهر اعلان قوقل ادسنس
    ومشاركة المو ضع على الفيس بك وتويتر
    وتحت الموضوع تظهر المواضيع المشابهه وسويت صفحة على الفيس بك بس لما انشر الموضوع يتاخر مايتم نشره مباشره على الصفحه يجلس كم ساعه على ماينتشر على الصفحه اذا تقدر تساعدني اكون شاكر لك والله يوفقك في الدنيا والاخره
    ممكن اضيف وخليك الادمان على المدونه وتعدل عليها براحتك
    اخوك رشيد
    رابط المدونة http://banat--style.blogspot.com/
    ايميلي mlak-i@hotmail.com

    ردحذف
    الردود
    1. نعم اخي يمكنك ذلك ايميلي alb33dani@yahoo.com

      حذف
  9. غير معرف29/9/13 12:37

    تم اخي اضافة ايميلك ادمان المدونة

    ردحذف
  10. غير معرف30/9/13 16:59

    وينك اخي انا الي طلبت التعديلات على القالب

    ردحذف
  11. غير معرف25/11/13 01:20

    السلام عليكم ورحمة الله وبركاته اوتا اشكرك على هدا القالب الرائع
    وجهة بعض المشاكل متل تغير الخط والطريقة التي يظهر بها الكاتب ممكن تساعدني اريد متل هدا الخط واريد ان يظهر الكاتب بهده الطريقة لاحظ المدونة http://afkar501.blogspot.com/ ان كان ممكن تظيف لي اكواد الابتسامة

    ردحذف
  12. أخي جلال الله يعطيك العافية و اكثر على جهدك الكبير على رفع كل هذه المواضيع و بدون مقابل ...
    اخي جلال ... لدي طلب ... هل يمكنك مساعدتي على تغيير الخط لأن ولا طريقة من هذه الطرق افلحت

    رابط مدونتي :
    http://www.algg07.tk/


    :)

    ردحذف
    الردود
    1. اخي ماهو اسم الخط الذي تريد اضافته

      حذف
  13. الخط الاول GESSTwoLight

    ردحذف
  14. لقد غيّرت القالب و سأجرب عليه .. إن لم تفلح سأطلب مساعدتك و ان افلحت فسأشكرك .. حتى لو بدون سبب : )

    ردحذف
  15. تم تعديل الملف ارجو تحميل هذا القالب
    http://www.gulfup.com/?Y4J6eN

    ردحذف
  16. و ركب عليه الخط الاول
    :)

    ردحذف
  17. اريد الخط ان يكون مثل خط مدونتك .. ان كان الاول او الثاني او الثالث .. المهم ان يكون مثل خط مدونتك او شبيه له ان كان غير موجود خط مدونتك

    ردحذف
  18. أين القالب : ) ؟

    ردحذف
  19. أخي ممكن تركب لي خط متناسق مع مدونتي هذه: http://www.7ikayah.com/
    رابط القالب: http://www.gulfup.com/?Ojrt80

    ردحذف
  20. :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b :-b

    ردحذف
  21. يعطيك العافيه 8-)

    ردحذف
    الردود
    1. الله يعافيك ,,, شكرا لمرورك العطر

      حذف
  22. بارك الله فيك اخي موضوع في القمة

    ردحذف
  23. أزال المؤلف هذا التعليق.

    ردحذف
  24. [-(
    غير صحيح مواضيع منسوخة من بعض !!

    ردحذف
  25. احاول عمل قولب ممتازة عني مشقل مع اللغة وهذه مدوني الرئيسية http://salamkabir.blogspot.com/
    احاول انظم انواع اخري بمميزات خاصة :d

    ردحذف
  26. مش عايز يتغير عندي مش عارف ليه . ممكن اعرف السبب مع اني عملت الطريقة صح 100% و قبل كدة بردو من شرح كتير و بردو مش عايز يتعمل للقالب ده

    ردحذف
  27. ممكن اضيف الثلاثة

    ردحذف
  28. مشكور يا حبيب (h)

    ردحذف
    الردود
    1. العفو :>) :>) شكرا لمرورك

      حذف
  29. أخي عندما أحاول تغيير خط قالب أنا قمت بتعريبة ... لا يظهر الخط ويبقى كما هو ... وتكررت المشكلة أكثر من مرة معي .. أرجو الرد وشكرا لك .

    ردحذف
  30. شكرا علي هذا الموضوع و أتمنا أن تزور مدونتي برامج

    ردحذف
  31. أزال المؤلف هذا التعليق.

    ردحذف
  32. مشكورررررررررررررررررررررر ادخل و شوف كم سارت المدونة راااااااااااائعة http://info-fennouni.blogspot.com/

    ردحذف
  33. موضوع جميل شكرا لك ؛ افضل الخط DroidKufi-Bold

    ردحذف
  34. أخي جلال انا عندما اضيف سياسه الحصوصيه تظهر في مكانها الذي اردته ولكني ارها تكون في الصفحه الرئيسيه

    ردحذف
  35. غير معرف16/10/14 09:55

    شكراً لك

    لكن روابط الخطوط لا تعمل :/

    ردحذف
  36. غير معرف17/3/15 13:45

    أزال المؤلف هذا التعليق.

    ردحذف
  37. أخي جلال ممكن كود إضافة الأزرار التي تضعها في أسفل الموضوع "الأزرار الإجتماعية"

    ردحذف
  38. غير معرف4/6/15 07:41

    اخ جلال روابط الخطوط لا تعمل

    ارجو مراجعة الموضوع

    ردحذف
  39. ممكن اخي جلال كود تابعنا على الفيسبوك

    لانني جربت كل الاكواد ولا تعمل

    وبارك الله فيك

    ردحذف
  40. شكرا لاك أخي

    ردحذف
  41. ما ضبط مع للاسف اخي الكريم مدري وين المشكله !!! شكرا لك على الشرح الجميل واتمنى لك التوفيق

    ردحذف