يمكنك استخدام إعدادات الخطوط في الكتلة لتغيير خط ومظهر النصوص الخاصة بك. تختلف هذه الإعدادات من كتلة لأخرى وقد تتضمن لون النص، عائلة الخط، حجم الخط، مظهر الخط، ارتفاع السطر، تباعد الحروف، المسافة البادئة للأسطر، الأعمدة، الزخرفة، الاتجاه، حالة الأحرف، الحرف الاستهلالي الكبير (Drop cap)، وملاءمة النص. عند دمجها معاً، فإنها تتيح لك طرقاً جديدة لتنويع محتواك.
تتوفر إعدادات الخطوط عند استخدام محرر الكتل. إذا كنت جديداً على محرر الكتل، فسيوضح لك هذا الدليل كيفية العمل مع الكتل.
الوصول إلى إعدادات الخطوط
يمكن العثور على إعدادات الخطوط في الشريط الجانبي لإعدادات الكتلة للـ كتلة تحت قسم الخطوط (Typography).
إذا لم ترَ الشريط الجانبي لإعدادات الكتلة، فقم بتحديد الكتلة التي تريد تخصيصها، ثم انقر فوق أيقونة الإعدادات الموجودة بجوار زر حفظ/نشر.
إعدادات إضافية
في قسم الخطوط، قد تكون بعض الخيارات مخفية. انقر على قائمة النقاط الثلاث الخاصة بخيارات الخطوط لاستكشاف جميع إعدادات الخطوط غير المرئية افتراضياً.
من القائمة المنسدلة، حدد إعداد الخطوط الذي تريد إضافته إلى قسم الخطوط. يمكنك إضافة العديد من الإعدادات كما تشاء.
تم سرد القائمة الكاملة لأنواع الإعدادات المختلفة أدناه.
إذا قمت بتعديل هذه الإعدادات وأردت العودة إلى الإعدادات الأصلية بسرعة، يمكنك فعل ذلك عن طريق اختيار أيقونة قائمة النقاط الثلاث والضغط على إعادة تعيين الكل (Reset All) كما هو موضح في هذا المقال. يؤدي هذا إلى إعادة تعيين الإعدادات وإزالة كافة التغييرات الخاصة بك.
الإعدادات المتاحة
تأتي كل كتلة مدعومة بمجموعة مختلفة من إعدادات الخطوط.
اللون
لتغيير لون النص لكل النصوص الموجودة في الكتلة، انقر فوق زر اللون. يمكنك اختيار لون جاهز من لوحة الألوان أو إدخال قيمة اللون الخاصة بك بالنقر فوق معاينة اللون الكبيرة في أعلى قائمة الألوان. قد تختلف خيارات الألوان لديك بحسب القالب الذي تستخدمه.
مثال على اختيار اللون البنفسجي من لوحة ألوان جاهزة.
قد يظهر لك تحذير إذا لم يكن لون النص الخاص بك يتمتع بتباين كافٍ مقارنة بلون الخلفية مما يجعله صعب القراءة. استخدم واجهة الألوان المخصصة لاختيار لون مختلف يلبي إرشادات تباين إمكانية الوصول.
تعرف على المزيد حول إعدادات الألوان.
حجم الخط
يسمح لك حجم الخط بتعديل مقاس النص. يمكنك الاختيار من المقاسات الجاهزة مثل (S) صغير، (M) متوسط، (L) كبير، و(XL) كبير جداً. يمكنك أيضاً ضبط قيمة مخصصة عن طريق النقر فوق أيقونة شريط التمرير الموجودة مباشرة أعلى الخيارات الافتراضية.
يمكنك تغيير وحدة قياس حجم الخط بالنقر فوق أيقونة px الموجودة على اليمين. يمكنك الاختيار بين px، em، rem.
تعرف على الفرق بين هذه الوحدات هنا.
عائلة الخط
يتيح لك هذا الخيار تغيير عائلة الخط للنص الخاص بك، مع معاينة للخطوط المتاحة في القائمة المنسدلة. تعتمد قائمة الخطوط المتاحة على قالبك. انقر على قائمة النقاط الثلاث واختر الخط (Font) لعرض القائمة المنسدلة لعائلات الخطوط.
عائلة خط Fira Code
المظهر (سمك وحالة الخط)
يتيح لك إعداد المظهر تغيير سماكة النص من رفيع (Thin) إلى عريض جداً (Extra Bold) وأسود (Black). لديك أيضاً خيار جعل النص مائلاً بدءاً من مائل عادٍ (Regular Italic) وحتى مائل عريض جداً (Extra Bold Italic) ومائل أسود (Black Italic).
مظهر خط عريض (Bold)
ارتفاع السطر
يحدد هذا الإعداد المسافة أعلى وأسفل كل سطر نصي داخل الفقرة. ارتفاع السطر الافتراضي لمعظم القوالب هو 1.5. يمكنك استخدام إعدادات ارتفاع السطر لزيادته أو إنقاصه حسب رغبتك، كما يمكنك إضافة رقم مخصص لارتفاع السطر.
ارتفاع سطر بمقدار اثنين
تباعد الحروف
يسمح لك هذا الإعداد بتحديد المسافة بين كل حرف فردي. يمكنك أيضاً تغيير الوحدات من القيمة الافتراضية (px) إلى %، em، rem، vw، وvh.
تعرف على الفرق بين هذه الوحدات هنا.
تباعد حروف بمقدار ثلاثة بكسل
المسافة البادئة للسطر
يمكن استخدام المسافة البادئة للسطر في كتلة الفقرة لإضافة مسافة قبل الكلمة الأولى في تلك الفقرة، مما يضفي لمسة أدبية على النص.
مسافة بادئة للسطر بمقدار مئة بكسل
الأعمدة
يمكن استخدام تحكم الأعمدة لتقسيم الفقرة عبر عدة أعمدة، تماماً مثل طريقة تدفق النصوص في المجلات أو الصحف.
ثلاثة أعمدة
ملاحظة: تستمر أعمدة النصوص على الهواتف والأجهزة اللوحية وأجهزة سطح المكتب.
الزخرفة (Decoration)
يتيح لك إعداد الزخرفة اختيار نمط خط تحتي (Underline) أو خط يتوسط النص (Strikethrough) للنص. حدد عادي (Normal) (—) لإزالة أنماط الخطوط السفلية أو المتوسطة الحالية.
زخرفة النص بخط يتوسطه
ملاحظة: من الأفضل تخصيص الخطوط التحتية للروابط لكي يعرف القراء ما هي العناصر القابلة للنقر.
الاتجاه
بعض الكتل مثل العنوان والفقرة تحتوي على خيار الاتجاه الذي يمكن الكتلة من التدفق عمودياً أو أفقياً.
اتجاه النص العمودي
حالة الأحرف (Letter case)
يتيح لك هذا الإعداد ضبط النصوص في الكتلة على ثلاثة خيارات لحالة الأحرف: أحرف كبيرة بالكامل (AB)، أحرف صغيرة بالكامل (ab)، أو الحرف الأول كبير (Ab). حدد خيار بلا (—) لإزالة أنماط حالة الأحرف.
تطبيق حالة الأحرف الكبيرة على كامل الفقرة
الحرف الاستهلالي الكبير (Drop cap)
تقوم ميزة الحرف الاستهلالي الكبير (Drop cap) بتكبير الحرف الأول ومحاذاته إلى يسار النص (أو يمينه حسب لغة العرض).
فقرة مع تفعيل الحرف الاستهلالي الكبير
ملاءمة النص (Fit text)
سيسمح لك تبديل خيار ملاءمة النص (Fit text) بأن ينمو النص أو ينكمش لملء العرض الكامل للحاوية. يمكن استخدامه لجعل العنوان يمتد عبر عرض الصفحة بالكامل على الهواتف والأجهزة اللوحية وأجهزة سطح المكتب.
فقرة مع تفعيل ملاءمة النص
الفرق بين وحدات px و em و rem و % و vw و vh
- px: (البكسل): وحدة مطلقة تظل ثابتة بغض النظر عن حجم الشاشة أو إعدادات متصفح المستخدم.
- em: وحدة نسبية تعتمد على حجم خط العنصر الحالي (أو حجم خط العنصر الأب).
- rem: (الـ em الجذري): نسبة إلى حجم الخط الجذري (حجم النص الافتراضي للمتصفح).
- %: (النسبة المئوية): نسبة إلى قيمة العنصر الأب (مثل عرض العمود).
- vw: (عرض إطار العرض - Viewport Width): نسبة إلى عرض نافذة المتصفح.
- vh: (ارتفاع إطار العرض - Viewport Height): نسبة إلى ارتفاع نافذة المتصفح.
البكسل (px) هي وحدة مطلقة وغير قابلة للتوسع. نظراً لأن البكسلات لا تتغير بناءً على العناصر الأخرى، فهي ليست متجاوبة. ومع ذلك، هناك مناسبات نادرة تكون فيها قيمة البكسل المطلقة مطلوبة لتلبية متطلبات التصميم، مثل الحدود الرفيعة، أو الأيقونات الثابتة، أو أبعاد المكونات الصارمة.
الوحدات مثل em و rem و % و vh و vw هي وحدات نسبية. وهي مناسبة تماماً للتصميم المتجاوب لأنها تتكبير وتصغر بناءً على حجم العناصر الأخرى أو أبعاد الشاشة.
