Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>HTML WYSIWYG EditorNew to Visual Studio Code? Get it now.
HTML WYSIWYG Editor

HTML WYSIWYG Editor

Muataz Khataan

|
536 installs
| (0) | Free
A fast visual HTML editor with bidirectional sync, RTL/LTR, and table and image tools
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

HTML WYSIWYG Editor for VS Code / Cursor

محرر HTML مرئي سريع لـ VS Code و Cursor. يفتح لوحة بجانب الملف مع تزامن ثنائي الاتجاه، ويدعم RTL وLTR وأي لغة في المحتوى.

الميزات

  • تزامن ثنائي الاتجاه بين المحرر المرئي وملف HTML مع الإبقاء على <head> وملفات CSS.
  • اتجاه المستند من dir أو lang، وأزرار لاتجاه الفقرة والمستند.
  • واجهة عربية أو إنجليزية حسب لغة VS Code.
  • جداول: إدراج بشبكة، صفوف وأعمدة، ترويسة، دمج وتقسيم الخلايا.
  • صور: إدراج، تغيير الحجم بالسحب، محاذاة، وخصائص alt/title/الأبعاد.
  • تنسيق: عناوين، قوائم، روابط، اقتباس، كود، ألوان، حجم خط، مرتفع/منخفض.
  • حفظ الصور في مجلد assets/ بجانب الملف.

التثبيت

Cursor

  1. Ctrl+Shift+P
  2. Extensions: Install from VSIX
  3. اختر ملف .vsix ثم أعد تحميل النافذة

VS Code

code --install-extension vscode-html-wysiwyg-0.1.0.vsix

الاستخدام

  1. افتح ملف HTML
  2. Ctrl+Shift+P ثم WYSIWYG: Open HTML Visual Editor أو Ctrl+Shift+V
  3. يمكن أيضاً استخدام أيقونة المحرر في شريط عنوان الملف

عيّنات للتجربة في samples/: rtl-ar.html وltr-en.html وno-dir.html.

الإعدادات

  • wysiwyg.defaultDirection: auto | ltr | rtl — يُستخدم عندما لا يحتوي الملف على سمة dir

التطوير

npm install
npm run build
npm test
npx @vscode/vsce package --no-dependencies

للتشغيل من المصدر: تكوين Run Extension في VS Code / Cursor.

الترخيص

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft