البعد الجمالي لأي مدونة وشكلها يلعب دورا مهما في تسهيل تصفحها والإطلاع على محتواها. فكما يمكن اختيار قالب بسيط وأنيق يمكن كذلك التحكم في تغيير خط المدونة وتزيينها بخطوط عربية أنيقة وجميلة. وسنحاول في هذا الدرس أن نرى طريقة تغيير خطوط نصوص مدونتكم باستعمال نوعين من الخطوط وهي:
الخطوة الأولى:
الخطوط التي أستعملها شخصيا في مدونتي
Tahoma : وهو نفس الخط الذي أستعمله شخصيا في مدونتي بالنسبة للنصوص ويبدو بهذا الشكل:
 |
| خط Tahoma |
Droid Arabic kufi: الخط العربي الكوفي أستعمله للعناوين، ولكن يمكنكم استعماله بالنسبة للنصوص كذلك ويبدو بهذا الشكل:
 |
| الخط العربي الكوفي |
كيف يتم التحكم في الخط عن طريق الCSS
قبل المرور لطريقة تغيير خط مدونتكم، دعونا نرى أولى كيف يبدو كود الCSS الخاص بالتحكم في نصوص الكتابة.
إسم_الجزء {
هنا كود ال CSS
}
فمثلا نريد تغيير نوع الخط الخاص بعنوان h1 فالشكل سيكون على هذا النحو:
h1 {
font-family: أسماء الخطوط;
}
بين المعقوفتين نضيف إسم الخط ك Arial مثلا أمام font-family :
h1 {
font-family: Arial;
}
إذا أردنا استعمال أكثر من خط واحد نفصل بين الخطوط بفواصل:
h1 {
font-family: Arial , Tahoma;
}
طريقة تغيير خط المدونة باستعمال الخطين أعلاه
نصيحتي هي أن تستعملوا الخط العربي الكوفي بالنسبة للعناوين، وللقيام بذلك هناك خطوتان:
الخطوة الأولى:
قوموا بفتح أداة تغيير القالب ثم تحرير HTML. من لوحة المفاتيح Ctrl+F للبحث عن ]]></b:skin> ومن فوقه مباشرة أضيفو كود ال CSS التالي:
هذا الكود هو الذي سيقوم بتحميل الخط العربي الكوفي على مدونتكم. لماذا؟ لأن الخط لا يوجد على جميع الحواسيب وبالتالي سيتكلف الكود بإظهاره في كل مرة يتصل شخص ما بمدونتكم.
لإستعمال الخط العربي الكوفي أضيفوه أمام font-family لما تريدون تطبيقه عليه:
في المثال أعلاه أنا أستعمل الخط العربي الكوفي بالنسبة للعناوين h1
إحفظوا التغييرات وهذا كل ما في الأمر بالنسبة للخط الأول.
لإستعمال خط Tahoma مثلا قوموا بتغيير كود ال CSS بهذا الشكل:
هذا الكود هو الذي سيقوم بتحميل الخط العربي الكوفي على مدونتكم. لماذا؟ لأن الخط لا يوجد على جميع الحواسيب وبالتالي سيتكلف الكود بإظهاره في كل مرة يتصل شخص ما بمدونتكم.
لإستعمال الخط العربي الكوفي أضيفوه أمام font-family لما تريدون تطبيقه عليه:
.post h1 {
color: #0575CE;
font-family: 'Droid Arabic Kufi';
font-size: 21px;
}
في المثال أعلاه أنا أستعمل الخط العربي الكوفي بالنسبة للعناوين h1
إحفظوا التغييرات وهذا كل ما في الأمر بالنسبة للخط الأول.
لإستعمال خط Tahoma مثلا قوموا بتغيير كود ال CSS بهذا الشكل:
.post h1 {
color: #0575CE;
font-family: Tahoma;
font-size: 21px;
}
