تكنلوجيا المعلومات والاتصالات
الوحدة الثالثة: إنشاء صفحات موقع "قاموس مصطلحات الكمبيوتر المصور"
الموضوع الأول: لغة HTML و PHP وتطبيقات تصميم مواقع الويب
لغة HTML و PHP وتطبيقات تصميم مواقع الويب - تكنلوجيا المعلومات والاتصالات - ثاني ثانوي
الوحدة الأولى: أساسيات تصميم مواقع الويب
الوحدة الثانية متطلبات ومراحل إنتاج المشروع
الوحدة الثالثة: إنشاء صفحات موقع "قاموس مصطلحات الكمبيوتر المصور"
في نهاية الموضوع يتوقع أن يكون الطالب قادرا على أن يمارس خطوات إنشاء موقع باستخدام تطبيق Expression Web
إجراءات إعداد ملفات ومجلدات المشروع
عند تثبيت lnstall برنامج XAMPP يتم ذلك بشكل افتراضي داخل مجلد باسم XAMPP على مشغل الأقراص :C وبه مجموعة من المجلدات منها مجلد باسم htdocs
إنشاء صفحات الموقع
صفحة إدخال مصطلح
صفحة البحث عن مصطلح
صفحة تعديل بيانات مصطلح
صفحة حذف مصطلح
صفحة المساعدة
صفحة الاتصال بقاعدة Connection.php لفتح اتصال بقاعدة البيانات على جهاز الخادم
الصفحة الرئيسة Index.php وتعرض واجهة الموقع
أيا كان التطبيق المستخدم في إنشاء صفحات الموقع فإنه يعتمد على استخدام لغة الترميز HTML
الهيكل البنائي لبرنامج بلغة HTML
خصائص لغة الترميز HTML
لكل Tag وظيفة معينه يقوم بها
يبدأ الكود بـ <html> وينتهي بـ <html/> وبينهما الآتي
ملخص ما تقوم بعرضه الأقسام الرئيسة لكود HTML
حفظ كود لغة الترميز HTML
إنشاء صفحة ويب باسم Test1.html باستخدام كود HTML
ادرس الكود الخاص بالنشاط
إضافة عنوان لصفحة الويب
استخدام كود HTML في إنشاء صفحة ويب باسم test2.html
ادرس الكود الخاص بالنشاط
إليك طريقتين لعمل ربط بين صفحتي الويب test1.html و test2.html
الربط بين صفحات الويب بكود لغة الترميز HTML
الربط من خلال أحد تطبيقات إنشاء مواقع ويب
تحميل برنامج Expression Web
مكونات الشاشة الرئيسة لبرنامج Expression Web
كما يمكن عرض كود HTML الخاص بصفحة الويب والتعديل فيه
الربط بين صفحات الويب باستخدام برنامج Expression Web
إنشاء موقع المشروع باستخدام تطبيق Expression Web
إنشاء صفحة "Header.php"
ادرس الشكل السابق وحدد الأجزاء المتكررة في جميع صفحات الموقع
النصوص السابقة تظهر على شاشة المستعرض مجرد كلمات غير مرتبطة بصفحات الموقع أي أنها لم تصبح بعد روابط تشعبية Hyperlink
نافذة كود صفحة "Header.php"
نلاحظ في الكود الذي تم إنشاؤه ما يلي
إنشاء صور Banner وضبط خصائصها
المقطع الثاني
جزء الكود الخاص بعناوين صفحات الموقع
من دراسة كود HTML السابق نلاحظ ما يلي
بداية الـ"Tag"
يمكن ربط كل نص أسفل صورة Banner بالصفحة الخاصة بها من خلال النشاط التالي
يمكنك إنشاء صفحة header.php باستخدام برنامج Expression Web كما يلي
المتغيرات في لغة PHP
المتغيرات والثوابت في لغة PHP
إنشاء صفحة الاتصال بقاعدة البيانات Connection.php
نلاحظ من تنفيذ الكود السابق ما يلي Double quotation
عند تنفيذ الكود السابق تكون نتيجته على شاشة مستعرض الإنترنت كما يلي
وهناك صيغة أخرى لطباعة قيمة المتغير كما يتضح من المثال التالي
اسم المتغير يفضل أن يكون معبرا عن محتواه أو ما يشير إليه
يمكن استعراض بعض أنواع المتغيرات في لغة PHP من خلال الجدول التالي
بينما تم اعتبار المتغير بين علامتي التنصيص المفردة Single quotation نص وطبع بالشكل التالي
الثوابت في لغة PHP
ناتج تنفيذ الكود طباعة نوع المتغير U_name$ على صفحة مستعرض الإنترنت بأنه String ثم يترك سطر ويطبع رسالة الترحيب Welcome to PHP
التعامل مع قاعدة البيانات
والجدير بالذكر أن المتغيرات والثوابت تتأثر بحالة الأحرف كبيرة أو صغيرة
كود صفحة الاتصال بقاعدة البيانات
اسم قاعدة البيانات يخصص للمتغير database$
إنشاء صفحة الاتصال بقواعد البيانات connect.php
الشرط يسأل عن قيمة المتغير connect$ فإذا كانت "True" فإنه يتم الاتصال بقاعدة البيانات المسماة Database$ من خلال الدالة mysql_select_db أو عرض رسالة حال وجود مشكلة