Softonic

معاينة Markdown

خطوة 1 / 2
التالي

اكتب على اليسار، وشاهد تصيير HTML على اليمين. تدعم المعاينة صيغة Markdown على طراز GitHub: الجداول، وقوائم المهام، وكتل الكود المسيَّجة مع إبراز الصياغة، والشطب، وروابط URL التلقائية، وكود HTML المضمَّن. وهي مفيدة لإعداد ملف README قبل الالتزام (commit)، أو للتحقق من شكل تعليق على طلب سحب (PR)، أو ببساطة لتعلُّم صياغة Markdown عبر مشاهدة تصيير كل ضغطة مفتاح.

كيفية استخدام المعاينة

  1. 1

    اكتب Markdown

    تستقبل اللوحة اليسرى نص Markdown الخام. كل تغيير يُعيد تصيير اللوحة اليمنى فورًا.

  2. 2

    شاهد معاينة HTML

    تعرض اللوحة اليمنى الناتج المُصيَّر بتنسيق يشبه GitHub.

  3. 3

    بدّل الوضع

    عرض جنبًا إلى جنب، أو المعاينة فقط، أو المصدر فقط للكتابة دون تشتيت.

  4. 4

    انسخ HTML

    احصل على HTML المُصيَّر إذا احتجت إلى لصقه في برنامج بريد إلكتروني أو نظام إدارة محتوى (CMS).

ما تدعمه هذه المعاينة

  • CommonMark: العناوين، والفقرات، والتأكيد، والقوائم، والاقتباسات، وكتل الكود، والروابط، والصور، والخطوط الأفقية.
  • إضافات GFM: الجداول مع محاذاة الأعمدة، وقوائم المهام (- [ ] و- [x])، والشطب باستخدام ~~، وروابط URL التلقائية، وكتل الكود المسيَّجة مع تلميحات اللغة.
  • إبراز الصياغة: أكثر من 100 لغة عبر highlight.js، JavaScript وPython وGo وRust وSQL وYAML وغيرها.
  • HTML الخام: يُمرَّر HTML المضمَّن كما هو (مع تنقيته حفاظًا على الأمان).
  • الرياضيات (اختياري): $...$ مضمَّنة و$$...$$ ككتلة إذا فعّلت إضافة الرياضيات.

غير مدعوم

  • روابط الويكي المخصّصة على طراز Obsidian ([[Page]])، خاصة بـ Obsidian فقط.
  • عناصر div المسيَّجة الخاصة بـ Pandoc (:::)، خاصة بـ Pandoc فقط.
  • التضمينات على جانب الخادم (server-side includes) أو وسوم القوالب {% ... %}.

الاستخدامات النموذجية

  • إعداد ملف README خارج بيئة التطوير المتكاملة (IDE) ثم لصق النسخة النهائية.
  • التحقق من تنسيق تعليقات PR قبل النشر، فحقل التعليقات في GitHub لا يعاين كتل الكود بشكل صحيح.
  • تحويل الملاحظات إلى HTML عندما تحتاج إلى لصق محتوى منسَّق في بريد إلكتروني أو في نظام إدارة محتوى (CMS) يقبل HTML الخام.
  • تعليم Markdown، العرض جنبًا إلى جنب يجعل الصياغة واضحة.

الأداء

يستخدم التصيير مُحلِّل Markdown-it مع إضافة GFM، ويعمل بالكامل داخل المتصفح. تُصيَّر المستندات التي يبلغ حجمها بضع مئات من الكيلوبايتات في أجزاء من الثانية؛ أما الملفات الكبيرة جدًا (كتاب كامل في ملف واحد) فقد تتلعثم أثناء الكتابة، قسّمها إلى فصول إذا حدث ذلك.

التصدير

  • نسخ HTML يمنحك عنصر <div> مع المحتوى المُصيَّر، بما في ذلك فئات التنسيق.
  • تنزيل .md يحفظ المصدر.
  • الطباعة إلى PDF من مربع حوار الطباعة في متصفحك يُنتج نسخة PDF منسَّقة من العرض المُصيَّر.

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

يطبّق GitHub لغة CSS خاصة به فوق GFM. ينبغي أن يتطابق ناتج HTML؛ أما التنسيق (الخطوط والمسافات) فهو خاص بـ GitHub. للحصول على تطابق تام، استخدم مبدّل السمة “معروض على GitHub”.

نعم، إذا فعّلت إضافة الرياضيات، تُصيَّر $...$ المضمَّنة و$$...$$ ككتلة باستخدام KaTeX. وهي معطّلة افتراضيًا للحفاظ على خفة الصفحة.

تتم تنقيته، تمرّ الوسوم الآمنة مثل <div> و<span> و<table> و<img>، بينما يُحذف <script> ومعالِجات الأحداث المضمَّنة.

تعمل مئات الكيلوبايتات بسلاسة. للملفات الكبيرة جدًا، أوقِف التصيير المباشر وصيِّر عند الطلب.

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

أدوات ذات صلة

مولّد إعدادات Webpack

أنشئ ملف webpack.config.js لـ webpack 5 لمشاريع JavaScript الخالصة أو React أو Vue: مع TypeScript وBabel وCSS أو Sass والصور وHtmlWebpackPlugin وخادم التطوير وسطر npm install.

محوّل ترميز ملفات النصوص

حوّل النص بين UTF-8 وUTF-16 وLatin-1 وWindows-1252 وترميزات أخرى لإصلاح الأحرف المشوّهة.

مرجع جدول ASCII

جدول ASCII كامل من 0 إلى 127 مع التمثيل العشري والست عشري والثماني والثنائي والمرجع الرقمي في HTML لكل محرف، بما في ذلك أكواد التحكم مثل NUL وLF وDEL.

مولّد ملف .gitignore

اجمع قواعد استبعاد المشروع لـ Laravel وNode.js وPython وRails. انسخ الناتج أو نزّل ملف ZIP يحتوي على .gitignore، مع إبقاء القواعد الشخصية منفصلة.

مُحقق تنسيق XSD

قم بالتحقق من وثيقة XML وفقًا لمخطط XSD، وعرض أي اختلافات بين العناصر وأنواعها مع تحديد أرقام السطور بدقة.

مولد ملف tsconfig.json

أنشئ ملف tsconfig.json نظيفا باختيار target وmodule وmoduleResolution وJSX وأعلام الصرامة الشائعة، ثم انسخ الإعداد المولّد إلى مشروعك.

الأداة متاحة بلغات أخرى