أهلا وسهلا بك عزيزي الزائر في المدونة التعليمية للحاسوب فما رأيك بالقالب الجديد؟؟

شرح طريقة اضافة خطوط عربية جذابة لمدونة بلوجر

 بسم الله الرحمن الرحيم

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

وهده الخطوط لصديقي King Sherif
الإضافة عبارة عن أجمل خطين باللغة العربية
وهما الأكثر إقبالا وطلبا لدى الجميع
إلا أنهما صعب إيجادهما مجانا
لكني اليوم سأمنحكم هده الإضافة عربونا لإخلاصي لزوار مدونتي
وأرجوا منكم التعليق شكرا وتقديرا لهديتي لكم
صورة الإضافة


والصورة خير دليل على مدى جمالية الخطوط


معلومات عن الإضافة
 
الخطوط المستخدمة فى مدونات بلوجر التقليدية هى خطوط ليست جميلة وليست جاذبة للزوار , لذلك يجب ابتكار طريقة ما لوضع خطوط عربية لتظهر المدونة بشكل جميل وجذاب , وانا قد احضرت لكم بعض خطوط بلوجر التقليدية لتشاهدوا الفرق بأنفسكم :

خط tahoma
خط ARIAL
خط traditional arabic
خط Verdana
 خط Times

كما رأيتم انها خطوط تقليدية وغير جذابة .

امثلة على الخطوط الحديثة الجذابة

كما ترون مدونتى بها خطوط جميلة تودُّون لو انها بمدوناتكم وهذه امثلة لها :

خط Droid Kufi Bold

هو من افضل الخطوط واشهرها على شبكة الانترنت وكثير من المواقع الضخمة تعمل به ! ,
وهذا مثال له :
لا اله الا الله محمداً رسول الله

خط Droid Kufi Regular


وهو نفس الخط السابق ولكنه ارفع قليلا منه
مثال :
لا اله الا الله محمداً رسول الله

أما الخط الآخر فهو بالصورة السايقة


طريقة تركيب الخطوط الجدابة على بلوجر

قد يقابل الكثير منا صعوبة فى تركيب الخطوط على بلوجر ولكن سأشرح طريقة سهلة لتركيبها :
اولا ادخل على لوحة تحكم بلوجر ثم قالب ثم تحرير html
وابحث عن هذا الكود بإستخدام Ctrl+f

]]></b:skin>

وضع قبله كود الخط الذى تريده :

ملاحظة: الملف عبارة عن ملف نصي بامتداد txt ستجدون به كود الخط

الخط الكوفي غليظ

 

 

  تحمــيل كود الخط



الخط الكوفي عادي

  تحمــيل كود الخط

 

خط النسخ غليظ

 

  تحمــيل كود الخط

 


خط النسخ عادي

انا آسف عملت هكدا لأن في بعض يأخد ولا يستطيع عمل like على الفيسبوك للمدونة
ولا يضع أي تعليق فقط تقديرا لمجهوداتنا

الآن نمر لشرح إضافة الخط لتصبح المدونة قادرة على معرفته
ويصبح مثل مدونتي
والشرح سهل
بعدما عملت لصق لكود أحد الخطوط المختارة ستعمل الآتي
تبحث عن كل الأسماء التي بالكود التالي عبر الضغط على Ctrl+F
لاتنسى مازلنا الآن لم نحفظ القالب

الكود
Font-family:

وغالبا مايكون هكدا كمثال

Font-family:Arial, Tahoma,vardana;

الآن كيف نضيف الخط المطلوب

مثال بالنسبة للخط الاول عادي وليس غليظ يعني regular وليس Blod

ستجد الكود أسفله بالأكواد التي حملتها

  font-family: 'DroidKufi-regular';

نقوم بنسخ إسم الخط فقط هكداولاتنسى النقطتين الجانبيتين

'DroidKufi-regular'

مثال كامل عن الإضافة

قبل

Font-family:Arial, Tahoma,vardana;

بعد

Font-family:'DroidKufi-regular', Arial, Tahoma, vardana;

لاحظ انه عندما نضيف الخط نعمل بعده فاصلة ثم مسافة ثم الخط الدي يليه

وهدا المثال ستعمله مع باقي أكواد Font-family

وهكدا مبروك عليك أحسن وأكثر الإضافات جمالا وإبداعا على مدونتك بلوجر مجانا

وأرجوا ان لاتنسى اخي الكريم التعليق
ولأي استفسار انا موجود

آخر مقالات المدونة

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

  1. تسلم على الشرح يا أخي
    تم التطبيق بمدونتي ( مدونة دريمز - للبرامج والتصميم )
    http://www.designnsoft.blogspot.com/

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

      حذف
  2. شرح رااائع جداا
    سلمت يدااك اخي اسامة
    وننتضر جديدك

    ردحذف
  3. أشكرك أختي الكريمة على متابعتك لكل تدويناتي ودوما أعدك بترقب كل جديد إنشاء الله :)

    ردحذف
  4. مدونة أقل ما يقال عنها أنها من يد محترفة لكن للاسف العرب لايقدرون المواهب.
    أريد التعلم منك أخي لقد حاولت الإتصال بك عبر صفحة الفيس بوك لكنها معطلة .حيث أنني طبقت الطريقة و أقل ما يقال انها رائعة
    http://a3malnet-dz.blogspot.com/
    لكن المشكلة الصغير كانت مع نص المقالة حيث الخطوط اصبحت غليظة و لم أستطع التحكم في حجمها .
    من فضلك كيف يمكنني التواصل معك.

    ردحذف
  5. سلام اخي الكريم أشكرك على كلامك الطيب وتم إرسال لك طلب الصداقة عبر الفيسبوك للإتصال :)

    ردحذف
  6. السلام عليكم
    أخي
    لماذا مدونتي لا تقبل أي اضافة في html
    لا تقبل الخطوط
    ولا تقبل كزد أليكسا
    ما الحل
    وشكراا موضوع شيق

    ردحذف
  7. والله لا أعرف أين هي مشكلتك بالضبط هل من القالب أم المدونة
    وشكرا لك على التعليق يا اخي

    ردحذف
  8. شرح رااائع جداا (h)
    http://istfada.blogspot.com/

    ردحذف
  9. شكرا على التعليق ياغالي :)

    ردحذف
  10. جزاك الله خيرا ,و زادك علما
    شرح رائع جدا وسهل التطبيق
    سأقوم بتطبيقه على مدونتي إن شاء الله
    (مدونة متعة التعلم)
    http://funlearn2.blogspot.com
    أدعوك لزيارتها

    ردحذف
  11. أولا أشكرك على التعليق ياغالي
    ثانية دخلت لمدونتك وهي جميلة ومفيدة طبعا (h)
    ولما ستضيف الخطوط سوف تصبح أكثر من رائعة موفق اخي :>)

    ردحذف
  12. والله سويت كل شيء لكن ما وجدت هذا الكود Font-family:Arial, Tahoma,vardana; [-(
    ايش الحل

    ردحذف
  13. أولا أشكرك على التعليق ياغالي
    ثانيا المشكل قد يكون هو أن في قوالب تكون على هذا الشكل مثلا
    font: normal 12px Arial, Tahoma
    إبحث عن مثل هذا الكود وضع الخط الذي تريده ورد علي هل نجحت في ذللك

    ردحذف
  14. السلام عليكم تسلم أخي على الموضوع
    و عندي سؤال الخط ده يضاف في العناوين في المدونه و لا يضاف في كتابة النص ؟؟؟؟؟؟ أي بالداخل في انشاء موضوع
    و السلام عليكم

    ردحذف
  15. يمكنك إضافته في أيم مكان تريدينه عناونين او نصوص بداخل التدوينات كما هو حال مدونتي تحياتي الطيبة وشكرا على التعليق :>)

    ردحذف
  16. جربت لك دون فائدة

    انا لم أجد هذا الكود الذي تكلمت عنه Font-family:Arial, Tahoma,vardana;


    شكرا على أي حال

    ردحذف
  17. لا يأخي ليس بالضرورة ان تجد ذلك الكود كاملا فقط حاول أن تبحث عن font-family فقط وإن لم تجيد فأكيد ستجده على الشكل الآتي
    font:
    مثلا
    font:normal 14px tahoma, arial
    فقط كمثال المهم شكرا على مرورك وأنا موجود لمساعدتك أخي الكريم :)

    ردحذف
  18. شكرا أخي على إضافة .
    http://www.videomixo.com/

    ردحذف
  19. العفو أخي الكريم وشكرا على مرورك الطيب

    ردحذف
  20. شكراً لك على الخطوط الرائعة
    لكن أنا لم أجد كود هذا الكود Font-family:Arial, Tahoma,vardana;
    فبحت عن أحد أسماء الخطوط في المدونة وأضفت إليها ما وضعته من الخطوط
    وحفظت التعديل لكن ماطلعت معي الخطوط مع الأسف :(
    فمالمشكلة ؟

    ردحذف
  21. لا يأخي ليس بالضرورة ان تجد ذلك الكود كاملا فقط حاول أن تبحث عن font-family فقط وإن لم تجيد فأكيد ستجده على الشكل الآتي
    font:
    مثلا
    font:normal 14px tahoma, arial
    فقط كمثال المهم شكرا على مرورك وأنا موجود لمساعدتك أخي الكريم :)

    ردحذف
  22. عذراً لكن أنا ليست لي خبره في التعامل مع الأكواد لذا أود أن أستفسر قليلاً
    في البداية الأكواد اللي حطيتها لتحميل ننسخ كامل المستند ونلصقه ؟ وإلا جزء معين بس ؟
    ثانياً لم أجد font-family :(
    لكن بحثت باسم خط arial ووجت مجموعة الخطوط الموجودة في المدونة وأضفت لتعدادها في كل مره اسم الخط زي ماكتبته هل هذا صحيح ؟
    أرجوا منك توضيح هذا لي إذا سمحت علماً بأني أريد إضافة جميع الخطوط التي وضحتها في شرحك ..
    شاكر ومقدر لك جهودك أخي الكريم :)

    ردحذف
  23. نعم كامل المستند تنسخه قبل
    ]]>
    ثم تأخد فقط الإسم 'DroidKufi-regular'
    وتضعه بجانب الخطوط التي لديك مثل arial,tahoma ولاتنسى ان تفصل بين كل خط بفاصلة وسيعمل معك الخط إن شاء الله
    وإذا أردت أن تجعلني مشرفا بمدونتك وأضيف لك الخط بدعم فني مباشر :)

    ردحذف
  24. طيب لكن أود أن أسأل قبل ذلك في حال أصفت الخطوط التي وضعتها أستطيع استخدمها في تغير خط الإضافات والأقسام وأقصد بالإضافات أسماء الأقسام في الأعلى ( الرئيسية ، عن المدونة ،... ) هل يتغير الخط فيها أم يقتصر على التعليقات وبعض الأشياء

    ردحذف
  25. نتم ممكن فقط إبحث عن محدد css للوسم الخاص بالأقسام أضف إليه الخط عبر إضافتك للتالي
    font:normal 14px 'DroidKufi-regular', tahoma ,arial;
    إذا لم تعمل سأعمل لك شرحا مفصلا كمثال عليها لتعرف كيفية التعامل معها وأنصحك بمتابعة دورة الـ css لتزيح عنك كل الغموض

    ردحذف
  26. شكراً لك أنا استخدمت الخط الكوفي بس بطريقة ثانية وضبطت معي لكن ماتغير الخط في المكان الذي أخبرتك به سابقاً ربما كما ذكرت الدورة تنفعني بما أنني مبُتدأ في ذلك فهلا وضعت رابطها هنا من فضلك ...

    ردحذف
  27. وجدتها القسم الخاص بـ Css شكراً لك
    سأبحث عما أريد فيه والله يجزاك خير على أتعابك
    مدونتك رائعة جداً وثرية بما هو مفيد
    سأحرص على متابعتها بإذن الله : )

    ردحذف
  28. إن شاء الله أخي الكريم ويشرفني أن تكون متابعا للمدونة

    ردحذف
  29. جدا رائع يعطيك الف عافيه على المعلومات الاكثر من رائعه نتشرف بزيارتك لنا عبر مدونتنا البسيطة
    http://monaquraishi11.blogspot.com/

    ردحذف
  30. أخي العزيز
    شكرًا لك على الموضوع القيم وكل مواضيعك المفيدة
    بس أنا طبقته وغيرت كل شيء
    لكن خط النافبار أقصد التبويبات لم يتغير
    وشكرًا
    وهذه مدونتي للإطلاع على الخطأ
    http://anime-shinsekai.blogspot.com/

    ردحذف

إذا أردت عزيزي الزائر إدراج فيديو من يوتوب بتعليق قم بالتالي
[youtube]رابط فيديو يوتوب هنا[/youtube]
كما يمكنك إدراج صورة عبر الكود التالي
[img]رابط صورتك هنا[/img]

جميع الحقوق محفوظة لمدونة المدونة التعليمية للكومبيوتر 2013

تصميم : بويردن