pregnancy

طريقه تنسيق مدونتك








 بسم الله الرحمن الرحيم





مشكلة

  1. نجد أن كل تدوينة لها تنسيق مختلف عن باقي التدوينات في نفس المدونة.
  2. الخطوط إما أنها أكبر من اللازم أو أصغر من اللازم.
  3. عدم استعمال الخطوط المناسبة سواءً في النص أو في العناوين.
  4. عدم استعمال الفقرات وأحياناً تكون التدوينة بأكملها عبارة عن فقرة واحدة مكتظة.
  5. تلوين النصوص بشكل مفرط – أحمر، وردي، أخضر … الخ
  6. اتجاه النص يكون أحياناً من اليسار لليمين.

ما الحل إذاً ؟

بإذن الله الحل بسيط لكن عليك أولاً أن تفهم كيف يعمل المحرر المتطوّر المستخدم في لوحة تحكم المدونة وعليك أيضاً أن تحافظ على أحادية ثابتة في تنسيق جميع المواضيع في مدونتك. للخوض بالتفاصيل بشكل موسّع اقرأ ما يلي.

كيف يعمل المحرر المتطور ؟

مدونة ووردبريس تستعمل المحرر WYSIWYG وهو اختصار للعبارة What You See Is What You Get أي (ما تراه تحصل عليه) والمقصود أنّ طريقة التنسيق التي تظهر لك أثناء كتابتك للتدوينة في لوحة التحكم هي نفس طريقة التنسيق التي سيظهر فيها الموضوع بعد نشره وفي الواقع هذا الأمر غير دقيق. المحرر المتطوّر يحتوي على أزرار كثيرة ولكل زر وظيفة معيّنة. بعض هذه الأزرار لها علاقة وثيقة بمحتوى ملف الستايل الموجود في القالب المستخدم في مدونتك.

ما هو ملف الستايل ؟

بلغة بسيطة ملف الستايل (style.css) هو عبارة عن ملف يحتوي على تعليمات معيّنة مسئولة عن تصميم المدونة ومن ضمن ذلك (أنواع الخطوط المستخدمة) (حجم الخطوط) (المسافة بين كل فقرة وفقرة) (ألوان الخطوط) (لون خلفية المدونة) … الخ. لكل قالب مدوّنة يوجد ملف ستايل. طبعاً لن أدخل إلى جميع التفاصيل المتعلّقة بملف الستايل لكن سأتطرّق لما يهمنا الآن في سياق تنسيق المواضيع واستعمال المحرر المتطوّر.

العناوين – الترويسات

بداية أرجو أن تراجع هذا [الموضوع] وأن ترقي مدونتك حتى يكون الشرح التالي مطابقاً لما تراه في مدونتك. بالنسبة للخطوط عليك أن تستخدمها وفق نظام معيّن.
الترويسات
نلاحظ بالصورة أعلاه بعض الخيارات مثل (فقرة) (ترويسة 1) (ترويسة 2) … حتى الترويسة رقم 6. هذه الترويسات عبارة عن عناوين ولكل ترويسة يوجد تنسيق خاص بها موجود في ملف الستايل. مثلاً الترويسة (1) تنسيقها في ملف الستايل كالتالي:
تنسيق الترويسة في ملف الستايل
  • السطر 89 – نوع الخط Arial
  • السطر 90 – حجم الخط 30 بيكسل
  • السطر 91 – الخط عريض (bold)
  • السطر 92 – هامش العنوان
  • السطر 93 – لون الخط
لنشاهد أمثلة على الترويسات في لوحة التحكم:
أمثلة على الترويسات في لوحة التحكم
لاحظ بالصورة أعلاه أنّ كل ترويسة “أخذت” التنسيق الخاص بها الموجود في ملف الستايل. انتبه أنّ ما يظهر في لوحة التحكم لا يظهر بالضرورة بعد نشر التدوينة. ما يظهر في لوحة التحكم هو فقط للتوضيح حتى تميّز خط العنوان من خط النص العادي. تعال نشاهد كيف ستكون النتيجة بعد نشر التدوينة:
الترويسات - النتيجة بعد نشر التدوينة
نشاهد بالصورة أعلاه أنّ الترويسة (4) لها خلفية صفراء بينما إذا أردت ترويسة مع إطار خفيف سأختار الترويسة (6). إذا أردت ترويسة تحتها خط أسود سأختار الترويسة (2). إذاً عليك أن تنسق العناوين مسبقاً في ملف الستايل وعندما تقوم بكتابة تدوينة جديدة ستعرف أن لكل ترويسة يوجد تنسيق خاص بها وعليك أن تستعمل الترويسات على حسب أهميّة العنوان فالعنوان الرئيسي نعطيه عادة الترويسة (1). عنوان فرعي كبير نعطيه عادة الترويسة (2). عنوان فرعي بمستوى أقل نعطيه عادة الترويسة (3) … الخ. مهّم جداً أن تستخدم الترويسات بشكل صحيح لأن محرك البحث يعطي الترويسة (1) وزناً أكبر من الترويسة (2) ويعطي الترويسة (2) وزناً أكبر من الترويسة (3) … الخ ولهذا الأمر تأثير كبير على أرشفة المواضيع في مدونتك.

النصوص

بعد أن فهمنا طريقة تنسيق واستعمال العناوين (الترويسات) نأتي للنص العادي والمقصود هو الخط الذي نستعمله لكتابة التدوينة. بنظري الخط Tahoma بحجم 11 حتى 13 بيكسل (بدون أن يكون في حالة Bold) هو أفضل وأرقى خط وشخصياً أستعمله في جميع مواقعي. اهتم أن تستعمل نفس الخط في جميع التدوينات حتى تحافظ على الأحادية. بالصورة التالية يظهر جزء من ملف الستايل المسئول عن الخط الذي سأستعمله في النصوص. لاحظ أنني اخترت الخط Tahoma بحجم 13 بيكسل. اقرأ في هذا السياق [الخطوط العربية : قواعد ، أفكار و حيل].
تنسيق النص في ملف الستايل

فقرات

اهتّم أن تتكوّن التدوينة من مجموعة فقرات وكل فقرة تنقل فكرة معيّنة. إذا أردت أن تبدأ فقرة جديد اضغط على (Enter) بينما إذا أردت أن تبدأ سطر جديد في نفس الفقرة اضغط في نفس اللحظة على زر (Enter) + زر (Shift). لنشاهد المثال التالي من لوحة التحكم:
تنسيق الفقرات
نلاحظ بالصورة أعلاه أنني كتبت فقرتين ونلاحظ وجود مسافة بسيطة بين كل فقرة وفقرة. تعال نشاهد النتيجة بعد النشر:
تنسيق الفقرات
نلاحظ بالصورة أعلاه أنني حصلت على النتيجة التي أريدها بالضبط. البعض يواجهون مشكلة عند الضغط على (Enter) لبدء فقرة جديدة ويتذمرون من عدم ظهور مسافة بين كل فقرة وفقرة. طبعاً الخلل في ملف الستايل. يجب أن تضع أمر في ملف الستايل وتخبره أنك تريد مسافة معينة بين الفقرات وهناك تستطيع أن تحدّد كم هي المسافة الفاصلة التي تريدها. في المثال أعلاه توجد مسافة 20 بيكسل بين الفقرة الأولى والفقرة الثانية ونشاهد بالصورة التالية الأمر المسئول عن ذلك في ملف الستايل:
تنسيق الفقرة في ملف الستايل
بهذا نكون فهمنا كيف نكتب سطر جديد في نفس الفقرة وفهمنا أيضاً كيف نبدأ فقرة جديدة بحيث يكون بينها وبين الفقرة السابقة مسافة بسيطة.

استعمال القوائم والترقيم

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

الاقتباس

هناك زر خاص في لوحة التحكم للإشارة إلى النص المقتبس:
زر الاقتباس
ونشاهد هنا مثال على نص مقتبس في المدونة:
نتيجة الاقتباس بعد نشر التدوينة
وهذا الكود المسئول عن تنسيق طريقة عرض النص في ملف الستايل:
تنسيق الاقتباس في ملف الستايل
طبعاً يمكنك تنسيق الاقتباس حسب الطريقة التي ترغب بها وهناك أفكار ممتازة تجدها في هذا [الموضوع].

لا تنسَ أيضاً …

  • أن يكون القالب المستخدم في مدونتك مخصّص للكتابة من اليمين لليسار. الكثير من المدونات تستعمل قوالب أجنبية غير معرّبة بشكل سليم وكثيراً ما نجد أنّ العبارات تبدأ من اليسار بالرغم من كونها مكتوبة باللغة العربية وأحياناً نجد أنّ النقطة تظهر في بداية الجملة بدلاَ من نهايتها.
  • أن تمتنع قدر المستطاع عن تلوين النصوص والعبارات. لإبراز كلمة أو عبارة استخدم الزر (B) في لوحة التحكم. التدوينات التي تحتوي على نصوص وعبارات بألوان مختلفة تعطي المدوّنة جو مفعم بالصبيانية – الأمر الذي لن يفيدك خصوصاً إذا كان محتوى المدونة موّجه للبالغين أو المثقفين.
  • أن تتجنّب الأخطاء الإملائية. صحيح، اللغة العربية ليست سهلة خصوصاً عندما تتورّط مع الهمزة. (اقرأ هنا الملاحظة رقم 7).

لا أفهم شيء بملف الستايل

قد يأتي الآن زائر ويقول شرحك جميل لكنني لا أعرف كيف أتعامل مع ملف الستايل ولا أعرف أصلاً أين يتواجد هذا الملف. صحيح، المستخدم العادي يريد أن يدوّن لا أن يعبث بملف الستايل لكن للأسف لا توجد حلول سحرية وأمامك الخيارات التالية:
  1. تعلّم ألـ CSS. هناك مصادر كثيرة في النت متخصصّة بهذا المجال وللأسف لا يمكن شرح كل ما يتعلق بألـ CSS في تدوينة واحدة.
  2. دع الخبز لخبازه – ابحث عن مصمّم متقن لعمله واستثمر وقتك في كتابة محتوى جديد.


شكرا لتعليقك