تنسيق الاكواد فى المشاركات

بسم الله و الحمد لله و الصلاة و السلام على خير خلق الله محمد الأمين. إخواني الكرام السلام عليكم و رحمة الله.
أما بعد، فقد وصلتني بعض الاستفسارات حول طريقة وضع أكواد مصدرية في التدوينات دون أن تختفي أو يحذف جزء منها نتيجة ترجمة المتصفح لها. أقول الطريقة سهلة و يسيرة و يمكن الوصول إليها انطلاقا من محرر التدوينات في لوحة التحكم. و أضعها كالآتي:

أولا : إدخال الكود عبر محرر المدونة

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

ثانيا: تنسيق الكود

تمثيلا لما سبق سأدرج هذا الكود

type="text/javascript">

document.write("Hello World!")

</script>

بعد إدخال الكود ستلاحظ أنه موجه جهة اليمين و الأصح أن يوجه إلى اليسار، حدده إذا ثم اضغط أيقونة التوجيه من أدوات المحرر و سيصبح كما يلي:

<script type="text/javascript">
document.write("Hello World!")
</script>

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

<div style="text-align: left;">

تجعله هكذا بإضافة ما لون بالأحمر

<div dir="ltr" style="text-align: left;">

بعد ذلك سيصبح الكود الذي أدخلت هكذا
تلاحظ الآن كيف أصبح تنسيقه حسنا :)

<script type="text/javascript">
document.write("Hello World!")
</script>

ثالثا: خلفية الكود

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

<script type="text/javascript">
document.write("Hello World!")
</script>

و أشير إلى أن شكل الإطار و لون الخلفية سيبدو حسب قالب مدونتك و كما هو محدد في أكواد css فيه و ليس بالضرورة كما يبدو هنا.