إنشاء صفحة الويب الآلي مع PHP

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

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

1. نحتاج أولاً إلى إنشاء قالب صفحة ويب أساسي.

هذا مجرد هيكل عظمي صفحة ويب قياسية. يمكنك إعطاؤه اسمًا مثل "pageBuilder.php" أو شيء ما. ليس عليك استخدام PHP لهذا. يمكنك استخدام لغة برمجة أخرى ، ولكن في هذا المثال ، سنبقي الأمور بسيطة وننفذها جميعًا في PHP.

لقطة الشاشة في 2016 05-30-1.56.52 AM

2. إضافة Bootstrap

سيساعد هذا على جعل النموذج يبدو أفضل بدون أي عمل إضافي. بالطبع سوف تحتاج إلى أن يكون Bootstrap لهذا العمل.

لقطة الشاشة في 2016 05-30-1.56.56 AM

3. قم بإعداد حاوية

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

لقطة الشاشة في 2016 05-30-1.56.48 AM

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

حدد نموذج ويب ، وسنضيف أيضًا عنوانًا مميزًا للنموذج ، وهو أمر اختياري ولكنه فكرة جيدة.

لقطة الشاشة في 2016 05-30-1.56.43 AM

5. أضف حقول النموذج

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

  • صورة الخلفية للصفحة
  • اسم الحدث الذي يتم الاحتفال به
  • عنوان رئيسي
  • البيان الافتتاحي
  • بعض اقتباس مبتذلة أو بيان إضافي
  • الإحالة لمقولة مبتذلة
  • نمط الخط لاستخدامه لكل عنصر من عناصر نص الإطارات الأربعة (فردي).
  • النطاق الزمني الذي ستصبح القسائم صالحة له
  • عرض 1 وعرض 2 الذي سيتم الإعلان عنه على القسائم.
  • رسائل قسيمة إضافية (شروط وأحكام ، على سبيل المثال)
  • بيانات عن رموز QR قسيمة التي سيتم إنشاؤها

إليك كيف يبدو ذلك:

لقطة الشاشة في 2016 05-30-1.56.00 AM

لقطة الشاشة في 2016 05-30-1.55.54 AM

لقطة الشاشة في 2016 05-30-1.55.36 AM

وبعد كل هذا الجهد ، سننتهي بصفحة تبدو كالتالي:

لقطة الشاشة في 2016 05-30-1.55.22 AM

والخبر السار هو أن نصف المهمة قد اكتملت الآن ، وكان النصف الأصعب والأكثر استهلاكًا للوقت. الباقي أسهل بكثير.

6. قم بإنشاء ملف معالج النموذج

بعد إنشاء نموذج ، تحتاج إلى بعض البرامج التي ستعالج البيانات المقدمة وتفعل شيئًا بها. في هذه الحالة ، سنستخدم البيانات المقدمة لإنشاء ملف جديد HTML الصفحة.

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

يجب تسمية الملف بنفس اسم الملف عمل قيمة السمة في إعلان النموذج ، لذلك في مثالنا الذي سيكون voucherGen.phpولأننا لم نحدد مسارًا ، فسيتعين تخزينه في نفس الموقع pageBuilder.php من أجل أن تعمل.

7. تهيئة المتغيرات

البيانات المقدمة من pageBuilder.php تمت إعادته كصفيف جمعي يسمى $ _ وظيفة، ويمكن الوصول إلى جميع قيم البيانات في المصفوفة عبر التحكم في نموذج HTML اسم الصفات. لذلك فإن تهيئة متغيراتنا في الواقع أمر سهل للغاية. إنه اختياري أيضًا ، ولكنه يجعل التعليمة البرمجية تبدو أكثر ترتيبًا وسهولة في القراءة. يمكنك بالتأكيد العمل مباشرة مع $ _ وظيفة القيم إذا كنت تفضل ذلك.

لقطة الشاشة في 2016 05-30-1.55.15 AM

8. استخدم الشروط الشرطية لتغيير الخطوط إلى قيمها الصحيحة

القيام بذلك مبكرا سيوفر الوقت والمشاكل في وقت لاحق. نحن فقط نتحقق من تحديد القيم ثم استبدالها بأسماء الخطوط الفعلية.

لقطة الشاشة في 2016 05-30-1.55.10 AM9. تبدأ بناء سلسلة المولدات

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

لقطة الشاشة في 2016 05-30-1.55.06 AM

ربما يمكنك أن ترى أين نحن ذاهبون مع هذا. لاحظ فاصلة منقوطة في النهاية. هذا مهم. كما يجب احتواء أي علامات شبه جزئية داخل النص (كجزء من إعلان CSS أو نص برمجي من جانب العميل) داخل علامات اقتباس.

10. ابدأ في إضافة نص الصفحة إلى سلسلة المولدات

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

لقطة الشاشة في 2016 05-30-1.55.00 AM

11. اكتب سلسلة المولد إلى HTML

في هذه الحالة ، نحن بصدد ترميز اسم الملف ، ولكن يمكنك (وربما ينبغي) جعل هذا الحقل في نموذج pageBuilder الخاص بك.

لقطة الشاشة في 2016 05-30-1.54.55 AM

12. أضف رابط اختبار

عندما تنقر على الزر إنشاء ، لأنه لا يعيد التوجيه إلى صفحة ويب مثل برنامج PHP العادي ، فإنك تحتاج إلى إضافة رابط أو شيء ما للذهاب ورؤية ما كانت النتيجة.

لقطة الشاشة في 2016 05-30-1.54.50 AM

13. قم بإنشاء ملف CSS مخصص

يمكنك تخزين تعليمات تصفيف إضافية في هذا الملف ، ولكن الآن المهم الوحيد هو تعليمات التصميم الخاصة بـ رئيسي شعبة.

لقطة الشاشة في 2016 05-30-1.54.45 AM

14. إنشاء وتحميل wrap.png

لكي يعمل هذا بشكل صحيح ، تحتاج إلى إنشاء صورة بكسل شفافة واحدة وتسميتها wrap.png ثم تحميله على المسار الذي حددته في custom.css ملف.

15. قم بتحميل بعض صور الخلفية المناسبة واختبر الصفحة الخاصة بك

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

Picture1

مما يؤدي إلى إنشاء شيء مشابه تمامًا لما يلي:

لقطة الشاشة في 2016 05-30-1.54.11 AM

لقد خمّنت بالفعل أنك لا تريد كتابة كل هذا من الصفر ، لذا يمكنك تنزيل شفرة المصدر للصفحة pageBuilder.php و voucherGen.php في هذا ملف مضغوط.

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

كاتالين زورزيني

أنا مدون تصميم مواقع ويب وبدأت هذا المشروع بعد أن قضيت بضعة أسابيع تكافح من أجل معرفة ما هو أفضل منصة التجارة الإلكترونية لنفسي. تحقق من بلدي الحالية أعلى بناة موقع التجارة الإلكترونية 10.