• 21 يناير , 2018
• 3206
• أحدث المقالات

ما هي خطوط جوجل :

قامت جوجل بدعم مجموعة خطوط على سيرفراتها و متاحة لإستخدام مواقع الويب و المطورين على حد سواء في مجموعة سطور بسيطة ترفق في ملف CSS عن طريق @import .

و كما هو معلوم عن سيرفرات جوجل تتميز بعدة نقاط :

1.  سرعة تحميل خطوط جوجل في الموقع الاكتروني
2. خطوط متنوعة تصل إلى 600 خط
3. بعض الخطوط تدعم اللغة العربية في تصميم موقع الويب
4. خطوط جوجل متوافقة مع كافة الأجهزة
5. يوجد خيارات متنوعة للتحكم بسمك الخط و دعم المطلوب فقط منها

هذه بعض مميزات خطوط جوجل في موقعك الالكتروني و هي مفيدة في تصميم المواقع متعددة اللغات multi language  website design

كيف استخدم خطوط جوجل في تصميم موقع الكتروني :

يوجد أكثر من طريقة لدعم خطوط جوجل في تصميم موقع الويب الخاص بك و إليك خطواط دعم خطوط جوجل google fonts في موقعك

الخطوة الأولى : 

نفتح صفحة جوجل فونت من الرابط

https://fonts.google.com/

 

و نختار الخط المناسب لموقعك الالكتروني

 

الخطوة الثانية : 

نختار الخط المطلوب إضافته في الموقع الالكتروني بالضغط على زر زائد بجوار خط جوجل المطلوب و بالتالي يضاف للسلة في الأسفل و نختار كذلك السمك و الإختيارات المختلفة الموجودة

الخطوة الأخيرة :

دعم الخط الخاص بجوجل فونت في تصميم موقعك الالكتروني بإحدا الطريقتين التالييتين :

الطريقة الأولى:

في ملف الإستايل style.css والذي يكون بالامتداد CSS ونضيف له الكود التالي في الملف  الإستايل الخاص بموقعك ( يختلف الكود حسب نوع الخط )

@import url(‘https://fonts.googleapis.com/css?family=Cairo‘);

ولاستخدام في داخل تصميم الموقع الالكتروني نضيف الكود التالي في ملف CSS في المكان المطلوب تغيير خطه مثلا في الbody للموقع الالكتروني كامل

 

body{

font-family: ‘Cairo’, sans-serif;

}

لطريقة الثانية:

في الصفحة الرئيسية لموقع الويب أو header الهيدر في موقع ووردبريس و نقوم بإضافة الكود التالي

و اضفة السطر التالي في تصميم المواقع الالكترونية المراد تغيير الخط  بها

 

h1{

font-family: ‘Cairo’, sans-serif;

}