English تم الإنتقال للبوابة الجديدة والتسجيل من هنا

تطوير المواقع : تركيب السكربتات والبرمجيات وقواعد البيانات والهاكات و ستايلات المنتديات و ترقيع الثغرات

Blogger : تغيير نوع خط "Font" مدونتك باحتراف.

Blogger : تغيير نوع خط "Font" مدونتك باحتراف.

السلام عليكم ورحمة الله وبركاته
اليوم إخواني سوف نشرح درسنا التاسع من دورة التدوين على المدونات بلوجر على هذا الربط ..
دورة البلوجر المتقدمة blogger
ودرسنا اليوم هو طريقة تغيير خط المدونة إلى نوع خط أو فونت آخر وشرحنا يختلف عن اغلب شروحات المنتديات جميعها في شئ واحد, هو أننا نقوم بتغيير نوع خط المدونة على قالبها الاصلي من بلوجر , أما كل الشروحات تعني بتغيير خط المدونة على القالب المُركب وهو ليس اصلي وتختلف طريقة تغيير الخط بداخله عن طريقة تغييره في القالب الأصلي من بلوجر وهذا ما سوف نتابعه الآن ..

اولاً للعثور على نوع خط جديد من خطوط الويب أو التي تصلح للمدونات والمواقع فتوجه إلى هنا..

https://www.google.com/fonts/earlyaccess
سوف تجد التالي...
Blogger تغيير "Font" مدونتك باحتراف.

رابط الفونت او الخط المظلل هو ما نريده يليه اسم الخط في لغة CSS اما كلمة تحميل المظللة بالاسفل فهي لتحميل الفونت على جهازك لو أردت ذلك ولكن استخدامه لا يصلح لموقعك بل على جهازك فقط.
اخترت لكم هذان النوعان في الصورة السابقة حيث انهما الأحدث و الأجمل والمستخدمين على نظام اندرويد ونظام جوجل OS
الآن بعد ان نسخت رابط الخط الذي اعجبك ضعه في هذا الكود كالتالي...
كود PHP:
<link href='http//fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet' type='text/css'/> 
والآن توجه إلى لوحة تحكم المدونة ثم انتقل إلى البند قالب ثم اضغط تحرير HTML وابحث في قالبك عن الوسم
كود PHP:
</head
وضع فوقه مباشرتاً كود الفونت او الخط كما في المثال هذا
كود PHP:
<link href='http//fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet' type='text/css'/> 
ليكون هكذا...
https://u.damasgate.com/002a/k1oif7hhntknh8wp7har.png
والآن احفظ قالب مدونتك بالضغط على حفظ النموذج , إذهب إلى أعلى القالب هنا تحديداً...
Blogger تغيير "Font" مدونتك باحتراف.
حيث أن الثلاث نقظ المظللين الاصفر بينهم أكواد CSS وبعد الضغط على الثلاث نقاط يكون الشكل هكذا...
https://u.damasgate.com/002a/zpey0m7wnkp8g9ynmaxd.png
قف بالفأرة على هذا السطر المُظلل ثم اضغط CTRL + F ثم اكتب في خانة البحث font وانظر النتيجة...
Blogger تغيير "Font" مدونتك باحتراف.
الرقم واحد يشير ان هناك كلمة font في البحث مظللة وهذا التظليل هو الطبيعي عند البحث عن كلمة في القالب...
اما الرقم اثنان هو ما نريد واعتبره نفسه المثال رقم واحد ولكن مظلل
انظر ستجد ان هناك تظليل على الكمات type و value تتبعها ستجد ان بعدها كلمة normal normal px نوع الخط وهو كالتالي بالضبط ..
كود PHP:
normal normal 13px ArialTahomaHelveticaFreeSanssans-serif 
وحتى تقوم بتركيب الخط الجديد فسوف تجعل الكود هكذا
كود PHP:
normal normal 13px Arial"Droid Arabic Kudi",TahomaHelveticaFreeSanssans-serif 
ما تم اضافته هو Droid Arabic Kufi بين علامتين تنتصيص بعد حجم الخط مباشرتاً , وحجم الخط هو 13بكسل كما في الكود السابق.
ليكون الشكل الآخير بدلاً من أن يكون هكذا
Blogger تغيير "Font" مدونتك باحتراف.

سوف يكون هكذا..
Blogger تغيير "Font" مدونتك باحتراف.

قُم بالتعديل على كل أكواد الفونت الموجودة بالمدونة وهي فقط في هذا الجزء ..
من هنا
Blogger تغيير "Font" مدونتك باحتراف.
حتى هنا
Blogger تغيير "Font" مدونتك باحتراف.

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

Blogger تغيير "Font" مدونتك باحتراف.
Blogger تغيير "Font" مدونتك باحتراف.

لدعم قناة وسام الحمد على اليوتيوب


المواضيع المشابهه
"جوجل" تقدم خدمة "حاسة الشم" فى "كذبة أبريل"
رئيس "نينتاندو" يرحل .. و"موزيلا Mozilla Firefox" تنهي تعاونها مع "فلاش"


جزاك الله كل خير اخى الحبيب احمد
شرح رائع جداً وسهل ، بارك الله لك على تعبك ومجهودك
مع خالص تحياتي وتقديري لك ،،


بارك الله فيك


يعطيك العافية وبارك الله فيك


روعة يا أستاذ

تسلم على نشر العلم والمعرفة


روعة يا أستاذ

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


بارك الله فيك استاذنا الحبيب أحمد صالح على الموضوع
الشرح كتاب الكتروني
هنا


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