KeroTools

تحويل Markdown إلى HTML مع معاينة حية

حوّل نص Markdown إلى كود HTML نظيف مع معاينة مباشرة أثناء الكتابة.

الإدخال
0 حرف
HTML

مستندك يبقى على جهازك

لا شيء يُحذف لاحقاً

آمن للتوثيق الداخلي

يعمل في كل متصفح حديث

كيف تعمل

  1. 1

    الصق Markdown

    ملف README أو صفحة توثيق أو مقالاً أو ملاحظات تريدها HTML.

  2. 2

    افحص المعاينة

    أكّد أن البنية خرجت كما قصدت قبل أن تنظر في الترميز.

  3. 3

    انسخ HTML

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

لماذا تستخدم هذه الأداة

CommonMark وامتدادات GitHub

الجداول والشطب وقوائم المهام والروابط التلقائية — اللهجة التي يُكتب بها معظم Markdown فعلاً.

المعاينة والترميز معاً

شاهد النتيجة المصيَّرة وHTML الذي أنتجته، فتفحص الاثنين قبل لصق أيّهما.

مخرجات دلالية

عناوين وقوائم وجداول حقيقية لا جداراً من ‎div‎ منسّقة، فيكون للترميز معنى.

سلوك فاصل الأسطر باختيارك

قرّر أيصير السطر الجديد المفرد فاصلاً أم ينضمّ إلى الفقرة — وهو الإعداد الذي يريده الناس دائماً.

لا شيء يُرفع

التحويل يجري في متصفحك — والتوثيق غير المنشور لا يصل إلى خادم أبداً.

مجاني بلا حساب

بلا تسجيل، وبلا علامة مائية، وبلا حدّ لكمّ ما تحوّله.

لا يوجد شيء اسمه Markdown — بل عدة

هذه هي الحقيقة وراء معظم المفاجآت. فالوصف الأصلي سنة 2004 كان مستنداً قصيراً وسكربت Perl، بلا قواعد نحوية رسمية ولا مجموعة اختبارات، ما ترك قدراً كبيراً غير معرَّف فعلاً. فملأت التطبيقاتُ الفجواتِ على نحو مختلف، فأنتج المدخل الواحد مخرجات مختلفة بحسب ما استعملت. وCommonMark موجود لإصلاح ذلك بالضبط: مواصفة دقيقة بمجموعة مطابقة، وهو الآن ما يستهدفه معظم المحلّلات الجادّة. لكن CommonMark يستبعد عمداً أشياء يستعملها الناس باستمرار، فيضيف GitHub Flavored Markdown فوقه الجداول والشطب وقوائم المهام والروابط التلقائية. والنتيجة العملية أن مستنداً فيه جدول يُصيَّر جدولاً في GitHub وحروفَ أنبوب حرفية في محلّل CommonMark صارم. فقبل أن تلوم Markdown عندك، افحص أيّ لهجة تتكلّم الوجهة.

السطر الجديد المفرد ليس فاصل سطر

هذا هو السلوك الذي يربك من الناس أكثر مما يربكهم كل ما عداه مجتمعاً، وهو ليس عطباً. فـMarkdown يعامل الأسطر المتتالية فقرةً واحدة ويصلها بمسافة، لأن الصيغة صُمِّمت كي لا يغيّر لفُّ الفقرة يدوياً في محرر نصوص المخرجاتِ. فسطرا عنوان مكتوبان على سطرين منفصلين يخرجان على سطر واحد. والعلاج الكلاسيكيّ مسافتان في نهاية السطر، وهو عرف رديء حقاً لأنه غير مرئيّ والمحرّرات تجرّده. والشرطة المائلة العكسية في نهاية السطر تفعل الشيء نفسه في CommonMark وهي مرئية على الأقل. والسطر الفارغ يبدأ فقرة جديدة، وهو غالباً ما أراده الناس فعلاً. وقد غيّر GitHub الافتراضيّ في حقول التعليقات فصار السطر الجديد فاصلاً هناك، ولهذا يسلك النصّ نفسه سلوكاً مختلفاً في تذكرة وفي README.

Markdown يمرّر HTML عمداً، وهذا قرار أمنيّ

وجود HTML خام داخل Markdown ميزةٌ لا سهوٌ: فالتصميم الأصلي افترض أنك ستنزل إلى HTML كلما عجز Markdown عن التعبير عمّا تحتاج. وهذا يعني أن محوّل Markdown إلى HTML مسموح له، بحكم المواصفة، بتمرير وسم ‎<script>‎ مباشرة إلى مخرجاته. ولمستنداتك أنت هذا بالضبط ما تريد. أما لأي شيء أرسله مستخدم — تعليق أو تقييم أو نبذة ملف شخصيّ أو تذكرة دعم — فهو ثغرة برمجة نصية عابرة للمواقع مخزَّنة تنتظر الحدوث، وخطوة التحويل هي حيث تُبنى. والقاعدة الجديرة بالحمل بسيطة: تصيير Markdown موثوق آمن، وتصيير Markdown غير موثوق يقتضي تعقيم HTML الناتج بعده مقابل قائمة وسوم مسموحة. ولا تعتمد أبداً على محلّل Markdown نفسه ليجعل مدخل المستخدم آمناً، لأنه لم يُصمَّم لذلك.

ما لا يستطيع Markdown فعله عمداً

Markdown لغة تنسيق للنثر لا لغة تخطيط، وحدوده مقصودة لا ميزاتٌ ناقصة. فلا صيغة لوضع صنف أو معرّف على عنصر، ولا سبيل لضبط عرض صورة، ولا لإضافة سمة من أي نوع. ومحاذاة الجداول هي الاستثناء الوحيد، وحتى هي محصورة في اليمين واليسار والوسط. وحين تحتاج شيئاً من ذلك، فالجواب داخل Markdown أن تكتب HTML مضمَّناً — وهو يعمل، ويغادر فوراً المجموعة الجزئية القابلة للنقل، لأن تلك القطعة لن تُصيَّر في سياق يجرّد HTML. وهذه هي المقايضة في قلب الصيغة: تبقى مقروءة نصّاً عادياً تحديداً لأنها ترفض أن تكبر. فإن وجدت نفسك تكتب HTML أكثر من Markdown، فقد تجاوز المستند الصيغةَ.

وجهة المخرجات تغيّر ما ينبغي أن تُبقيه

HTML الخارج عارٍ عمداً — عناوين وفقرات وقوائم وروابط، بلا ‎div‎ مغلِّفة وبلا أصناف — لأن هذا ما يرث ورقة أنماط نظيفاً. ولصفحة تتحكم بها هذا صحيح تماماً. والبريد هو الاستثناء الجدير بالتخطيط، إذ يجرّد معظم العملاء كتل ‎<style>‎ ويتجاهلون أوراق الأنماط الخارجية، فما يجب أن يبدو مصمَّماً في صندوق بريد يحتاج تضمين CSS في كل عنصر بعد التحويل. ونظام إدارة المحتوى هو الحالة الأخرى: كثير من المحرّرات تعقّم HTML الملصوق وتُسقط السمات بصمت، فالصق في عرض المصدر لا المرئيّ. وإن كانت الوجهة تقبل Markdown مباشرة — كما تفعل معظم مولّدات المواقع الساكنة والويكيات ومنصات التوثيق — فالتحويل أولاً خطوة إلى الوراء، لأنك تفقد المصدر الذي كان أسهل تحريراً.

لماذا يهمّ التحويل المحلي في هذا النوع من النصّ

تأمّل ما يوجد عادةً في محرّر Markdown. توثيقٌ داخليّ يصف كيف يعمل نظام. وREADME لمستودع ليس علنياً بعد. ومقال مدوّنة قبل النشر. وملاحظات اجتماع فيها أسماء. ودليل تشغيل يسمّي مضيفات ويصف ما يُفعَل حين يفشل شيء. فMarkdown هو الصيغة التي يكتب بها الناس المعرفة الداخلية، ما يجعل مستنداً ملصوقاً وصفاً لكيفية عمل مؤسسة — نادراً ما يكون سرّياً بالمعنى الدراميّ، ونادراً ما يكون شيئاً تختار مناولته لغريب أيضاً. والمحوّل المستضاف يستقبل ذلك كله. أما هذه الأداة فتحوّل في الصفحة ولا ترسل شيئاً، وهو ما يمكنك التحقق منه في تبويب الشبكة بأدوات المطوّر.

أخطاء شائعة يجب تجنّبها

  • توقّع أن يكسر السطر الجديد المفرد السطرَ. Markdown يصل الأسطر المتتالية في فقرة واحدة بالتصميم — استعمل سطراً فارغاً لفقرة جديدة، أو شرطة مائلة عكسية في النهاية لفاصل صارم.
  • تصيير Markdown أرسله مستخدم دون تعقيم المخرجات. HTML الخام يمرّ بحكم المواصفة، فوسم `<script>` في تعليق يصير ثغرة برمجة نصية مخزَّنة عند خطوة التحويل.
  • افتراض أن كل محلّل يتكلّم اللهجة نفسها. الجداول وقوائم المهام والشطب امتدادات GitHub لا CommonMark، فقد يُصيَّر جدول حروفَ أنبوب حرفية في مكان آخر.
  • اللجوء إلى HTML مضمَّن لضبط صنف أو عرض صورة. يعمل ويغادر المجموعة الجزئية القابلة للنقل — تلك القطعة ستختفي في أي مكان يُجرَّد فيه HTML.
  • تحويل Markdown كانت الوجهة ستقبله مباشرة. مولّدات المواقع الساكنة والويكيات ومنصات التوثيق تأخذ Markdown عادةً، والتحويل أولاً يفقدك المصدر الأسهل تحريراً.

كيف تُقارن

الجانبهذه الأداةمحوّلات عبر الإنترنتمولّد مواقع ساكنة
إرسال المحتوى إلى خادملا يحدث أبداًغالباً نعملا
دعم امتدادات GitHubنعممتفاوتغالباً
المخرجات ترث CSS عندكنعممتفاوتنعم
إعداد مطلوبلا شيءلا شيءتثبيت وضبط
حساب أو تسجيلغير مطلوبمطلوب غالباًغير مطلوب
السعرمجانيمجاني / باقات مدفوعةمجاني

المزايا

جداول وقوائم مهام

امتدادات GitHub التي ليست في CommonMark الصارم لكنها في معظم Markdown الواقعيّ.

معاينة حيّة

المخرجات المصيَّرة تتحدّث وأنت تكتب، فتظهر الأخطاء فوراً.

كتل شفرة مسيَّجة

كتل العلامات الخلفية الثلاث تصير `pre` و`code` مع تسجيل اللغة صنفاً.

ترميز نظيف مقتصد

بلا ‎div‎ مغلِّفة ولا أسماء أصناف مولَّدة ولا أنماط مضمّنة — يرث HTML ورقة أنماطك.

يونيكود في كل الملف

النصّ العربي والتركي والمشكول يمرّ دون تغيير في الاتجاهين.

يتحمّل المستندات الطويلة

أدلة كاملة تُحوَّل دون رفع ولا سقف حجم.

بلا تثبيت

بلا مولّد مواقع ساكنة ولا بيئة تشغيل ولا اعتماديات — يعمل على صفحة الويب.

جاهز للعربية وRTL

واجهة كاملة بثماني لغات، منها العربية من اليمين إلى اليسار.

آمن افتراضياً

يُقدَّم عبر HTTPS، بلا تتبّع للمحتوى وبلا رفع إلى طرف ثالث.

من يستخدمها

كتّاب المحتوى التقني

إدخال توثيق إلى نظام إدارة محتوى يقبل HTML ولا يقبل Markdown.

المطوّرون

فحص كيف سيُصيَّر ملف README قبل دفعه إلى مستودع.

محرّرو المحتوى

تحويل مسودّة كاتب بـMarkdown إلى ترميز يستطيع نظام النشر أخذه.

كتّاب النشرات البريدية

إنتاج جسم HTML لرسالة من مسودّة كُتبت بـMarkdown عادي.

الأسئلة الشائعة

لا. كل شيء يعمل محلياً في متصفحك — نصّك لا يُرفع أو يُخزَّن أو يُشارَك أبداً.

نعم — مجاني تماماً، بلا حساب وبلا حدود.