القائمة الرئيسية

الصفحات

كيفية تغيير خط المدونة على بلوجر إلى خط احترافي

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

إذا أردت الإطلاع على أحدث الخطوط من جوجل قم بالضغط هنا للذهاب الى موقع خطوط جوجل Google Fonts . حيث تقوم شركة جوجل بإضافة المزيد من الخطوط الجديدة كل فترة من الزمن.

بعد اختيارك للخط ، وأنا أقترح عليك الخطوط العربية التالية :

Lateef

Cairo

Amiri

Changa

Mada 

Aref Ruqaa

Mirza

Katibeh 

Markazi Text

بعد أن تختار الخط الذي تريد ، نأتي لطريقة تركيبه على المدونة .فيما يلي أكواد ال CSS الخاصة بكل خط من الخطوط السابقة :
font-family: 'Lateef', cursive;
font-family: 'Cairo', sans-serif;
font-family: 'Amiri', serif;
font-family: 'Changa', sans-serif;
font-family: 'Mada', sans-serif;
font-family: 'Aref Ruqaa', serif;
font-family: 'Mirza', cursive;
font-family: 'Katibeh', cursive;
الآن اتبع الخطوات الآتية :
افتح لوحة التحكم بالمدونة
اذهب الى المظهر > تحرير HTML
اضغط CTRL + F وابحث عن وسم <head/>
قم باضافة الكود التالي فوقه مباشرة :
<link href="https://fonts.googleapis.com/css?family=Amiri|Aref+Ruqaa|Cairo|Changa|Katibeh|Lateef|Mada|Mirza|" rel="stylesheet"/>
 ثم قم بالبحث باستخدام CTRL + F عن الوسم <b:skin> وقم بوضع كود الخط الخاص الذي قمت باختياره تحته مباشرة ، مثلاً :
*{ font-family: إسم الخط هنا !important;}
لنفترض أنك اخترت خط Cairo ، فسيكون الكود كالآتي :
*{ font-family:Cairo !important;}
بعد إجراء التغييرات اللازمة ، تقوم بحفظ المظهر وسيتم تطبيق الخط الجديد على المدونة.
وبذلك تكون قد حصلت على 8 خطوط جميلة جداً للمدونات والتي ستزيد من جاذبية المدونة للزوار ، كما أن الخط الجميل يحسّن الشكل الكلّي للموقع ويجعله يبدو احترافياً وهو دليل على اهتمام صاحب الموقع بموقعه وبتطويره وتقدّمه.

الى هنا يكون قد انتهى الشرح ، أرجو أن تكونوا قد استفدتم و وفقتم في تطبق الشرح دون مشاكل أو صعوبات. اذا وجهتك اية مشكلة فلا تتردد بطرحها في التعليقات لنساعدك في حلها ، في أمآن الله .

تعليقات

6 تعليقات
إرسال تعليق
  1. يا رجل انت مانع نسخ وفي اكواد ما ع نقدر ناخذها

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

      حذف
  2. ما الخط المستخدم في المقاله الحليه

    ردحذف
    الردود
    1. اسم الخط الحالي Tajawal

      حذف
    2. جميل جدا بصراحة ولكن للأسف لا يدعم ظهور أيقونات بجانب أسماء الأقسام بالقائمة الرئيسية يظهرها رموز ومربعات

      حذف
  3. الأيقونات ترتبط بخط اسمه fontawesome ، اذا كان موجوداً في قالبك فستظهر الأيقونات بجانب تسميات القائمة الرئيسية بدون مشاكل ، وإذا لم يكن موجوداً فلن تظهر ولو جربت أي نوع خط آخر.

    ردحذف

إرسال تعليق