برنامج تعليمي Bluefish Text HTML Editor

click fraud protection

بلو فيش محرر الكود هو تطبيق يستخدم لتطوير صفحات الويب والنصوص. إنه ليس محرر WYSIWYG. Bluefish هي أداة تستخدم لتحرير الكود الذي يتم إنشاء صفحة الويب أو البرنامج النصي منه. إنه مخصص للمبرمجين الذين لديهم معرفة بكتابة HTML و CSS كود ولديه أوضاع للعمل مع لغات البرمجة النصية الأكثر شيوعًا مثل PHP و Javascript ، بالإضافة إلى العديد من اللغات الأخرى. الغرض الرئيسي من محرر Bluefish هو تسهيل الترميز وتقليل الأخطاء. بلوفيش مجاني و برمجيات مفتوحة المصدر والإصدارات متوفرة لأنظمة Windows و Mac OSX و Linux والعديد من الأنظمة الأساسية الأخرى الشبيهة بـ Unix. الإصدار الذي أستخدمه في هذا البرنامج التعليمي هو Bluefish على Windows 7.

01

من 04

واجهة Bluefish

واجهة Bluefish

لقطة شاشة مقدمة من جون موران

واجهة Bluefish مقسمة إلى عدة أقسام. القسم الأكبر هو جزء التحرير وهذا هو المكان الذي يمكنك فيه تعديل التعليمات البرمجية الخاصة بك مباشرةً. على الجانب الأيسر من جزء التحرير توجد اللوحة الجانبية ، التي تؤدي نفس وظائف مدير الملفات ، مما يسمح لك باختيار الملفات التي تريد العمل عليها وإعادة تسمية الملفات أو حذفها.

يحتوي قسم الرأس الموجود أعلى نوافذ Bluefish على العديد من أشرطة الأدوات ، والتي يمكن إظهارها أو إخفاؤها عبر قائمة العرض.

instagram viewer

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

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

02

من 04

استخدام شريط أدوات HTML في Bluefish

استخدام شريط أدوات HTML في Bluefish

لقطة شاشة مقدمة من جون موران

يتم ترتيب شريط أدوات HTML في Bluefish بواسطة علامات تبويب تفصل الأدوات حسب الفئة. علامات التبويب هي:

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

سيؤدي النقر فوق كل علامة تبويب إلى ظهور الأزرار المتعلقة بالفئة ذات الصلة في شريط الأدوات أسفل علامات التبويب.

03

من 04

استخدام قائمة Snippets في Bluefish

استخدام قائمة Snippets في Bluefish

لقطة شاشة مقدمة من جون موران

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

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

يؤدي النقر فوق هذا العنصر إلى فتح مربع حوار يطالبك بإدخال العلامة التي ترغب في استخدامها. يمكنك إدخال "pre" (بدون أقواس الزاوية) ويقوم Bluefish بإدراج علامة فتح وإغلاق "pre" في المستند:

.

04

من 04

ميزات أخرى للسمك الأزرق

ميزات أخرى للسمك الأزرق

لقطة شاشة مقدمة من جون موران

بينما Bluefish ليس محرر WYSIWYG، لديه القدرة على السماح لك بمعاينة التعليمات البرمجية الخاصة بك في أي متصفح قمت بتثبيته على جهاز الكمبيوتر الخاص بك. كما أنه يدعم الإكمال التلقائي للكود ، وإبراز بناء الجملة ، وأدوات تصحيح الأخطاء ، وصندوق إخراج البرنامج النصي ، المكونات الإضافية والقوالب التي يمكن أن تمنحك بداية سريعة لإنشاء المستندات التي تعمل بها بشكل متكرر مع.

instagram story viewer