Skip to main content

كيفية إضافة نموذج مع KompoZer

تصميم صفحات الإنترنت (2) : تزيين النصوص (قد 2025)

تصميم صفحات الإنترنت (2) : تزيين النصوص (قد 2025)
Anonim

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

قم بإنشاء نموذج جديد

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

  1. ضع المؤشر في الموقع الذي ترغب في أن يظهر النموذج فيه على الصفحة.
  2. انقر على شكل زر على شريط الأدوات. يفتح مربع الحوار خصائص النموذج.
  3. أضف اسمًا للنموذج. يتم استخدام الاسم في رمز HTML الذي تم إنشاؤه تلقائيًا لتحديد النموذج وهو مطلوب. تحتاج أيضًا إلى حفظ صفحتك قبل أن تتمكن من إضافة نموذج. إذا كنت تعمل مع صفحة جديدة غير محفوظة ، فسوف يطالبك KompoZer بالحفظ.
  4. أضف عنوان URL إلى النص البرمجي الذي سيعالج بيانات النموذج في حقل عنوان URL الإجراء. عادة ما تكون معالجات النماذج مكتوبة بلغة PHP أو لغة مماثلة من جانب الخادم. بدون هذه المعلومات ، لن تتمكن صفحة الويب الخاصة بك من عمل أي شيء مع البيانات التي أدخلها المستخدم. سيطالبك KompoZer بإدخال عنوان URL لمُعالج النموذج إذا لم تقم بإدخاله.
  5. اختر طريقة تستخدم لتقديم بيانات النموذج إلى الخادم. الخياران هما GET و POST. سوف تحتاج إلى معرفة الطريقة التي يتطلبها البرنامج النصي.
  6. انقر حسنا ويتم إضافة النموذج إلى صفحتك.

أضف حقل نص إلى نموذج

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

  1. اختر المكان الذي تريد أن يذهب إليه حقل النص في منطقة النموذج المحددة. إذا كنت ترغب في إضافة تسمية ، فقد ترغب في كتابة النص في البداية.
  2. انقر على السهم لأسفل بجانب شكل على شريط الأدوات واختر "حقل النموذج" من القائمة المنسدلة.
  3. سيتم فتح نافذة خصائص حقل النموذج. لإضافة حقل نص ، اختر نص من القائمة المنسدلة المسماة نوع الحقل.
  4. أعط اسمًا إلى حقل النص. يتم استخدام الاسم لتعريف الحقل في تعليمات HTML البرمجية ويحتاج النص البرمجي لمعالجة النموذج إلى اسم لمعالجة البيانات. يمكن تعديل عدد من السمات الاختيارية الأخرى في مربع الحوار هذا عن طريق تبديل المزيد خصائص / خصائص أقل أو بالضغط على الزر تحرير متقدم ، ولكن في الوقت الحالي ، سنقوم فقط بإدخال اسم الحقل.
  5. انقر حسنا ويظهر حقل النص على الصفحة.

إضافة منطقة نص إلى نموذج

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

  1. ضع المؤشر داخل الشكل التفصيلي للنموذج حيث تريد أن تكون منطقة النص الخاصة بك. إذا كنت تريد كتابة تسمية ، فغالبًا ما تكون فكرة جيدة لكتابة نص التسمية ، وضرب مفتاح الإدخال للانتقال إلى سطر جديد ، ثم إضافة حقل النموذج ، نظرًا لأن حجم مساحة النص على الصفحة يجعلها غير ملائمة التسمية على اليسار أو اليمين.
  2. انقر على السهم لأسفل بجانب شكل زر على شريط الأدوات واختيار نص منطقة من القائمة المنسدلة. سيتم فتح نافذة خصائص منطقة النص.
  3. أدخل اسمًا لحقل مجال النص. يعرّف الاسم الحقل في رمز HTML ويستخدمه برنامج معالجة النصوص لمعالجة المعلومات التي يرسلها المستخدم.
  4. أدخل عدد الصفوف والأعمدة التي تريد أن تعرضها منطقة النص. تحدد هذه الأبعاد حجم الحقل في الصفحة ومقدار النص الذي يمكن إدخاله في الحقل قبل أن يحدث التمرير.
  5. يمكن تحديد خيارات أكثر تقدماً مع عناصر التحكم الأخرى في هذه النافذة ، ولكن في الوقت الحالي ، يكفي اسم الحقل ومكوناته.
  6. انقر حسنا وتظهر منطقة النص في النموذج.

إضافة زر "إرسال" و "إعادة تعيين" إلى نموذج

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

  1. ضع المؤشر داخل منطقة النموذج المحددة التي تريد أن يكون زر الإرسال أو إعادة التعيين بها. في أغلب الأحيان ، سيكون موجودًا أسفل باقي الحقول في نموذج.
  2. انقر على السهم لأسفل بجانب شكل زر على شريط الأدوات واختيار تعريف زر من القائمة المنسدلة. ستظهر نافذة خصائص الزر.
  3. اختر نوع الزر من القائمة المنسدلة المسمى Type. اختياراتك هي إرسال ، إعادة تعيين ، وزر. في هذه الحالة ، سوف نختار خضع نوع.
  4. حدد اسمًا للزر الذي سيتم استخدامه في شفرة HTML ومعالجة النموذج لمعالجة طلب النموذج. يدرج مطورو الويب عادة هذا الحقل "إرسال".
  5. في المربع المسمى القيمة، أدخل النص الذي يجب أن يظهر على الزر. يجب أن يكون النص قصيرًا ولكن وصفيًا لما سيحدث عند الضغط على الزر. شيء مثل "إرسال" أو "إرسال نموذج" أو "إرسال" هي أمثلة جيدة.
  6. انقر فوق "موافق" ويظهر الزر في النموذج.

ال إعادة تعيين يمكن إضافة الزر إلى النموذج باستخدام نفس العملية ، ولكن اختر إعادة تعيين من نوع مجال بدلا من خضع.

تحرير نموذج مع KompoZer

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