إنشاء موقع باستخدام "دريم ويفر"

عزيزي القارئ···في الحلقتين السابقتين أنشأنا مجلداً على الكومبيوتر الخاص بنا، وأنشأنا في داخله موقعاً، وأنشأنا صفحة داخل الموقع، وهذه الصفحة كانت كاملة التصميم، وحفظناها باسم Index، وتعرفنا إلى طرق عرضها، وفي هذا العدد سنبدأ التعديل في هذه الصفحة، فتابع معنا· أولاً: إزالة بعض الروابط من أعلى الصفحة لقد كان الشكل الذي توصلنا إليه في العدد السابق كما في الشكل رقم (1) وهو كما ترى يوجد بأعلاه سبعة روابط Links . من المفترض أن الزائر لموقعك كلما نقر على أحدها ظهرت له صفحة خاصة بالرابط، ولكنك الآن إن نقرت على أي منها لن يظهر شيء لأننا لم ننشئ شيئاً بعد· سنقوم الآن بحذف رابط من الروابط السبعة لأننا سنستخدم ستة روابط فقط في مشروعنا، وهذا الحذف يتم كالآتي: ·1حدد النص Global link المكتوب فوق أحد الروابط بسحب الماوس فوقه كما في الشكل رقم (2) ثم اضغط مفتاح Delete أو backspace من لوحة المفاتيح فيتم الحذف· ·2اضغط مفتاح F21 لتستعرض الصفحة من خلال مستعرض الإنترنت فتظهر رسالة تطلب منك حفظ التعديلات، فاختر منها (نعم Yes) لتنتقل إلى المتصفح، وتجد الروابط أصبحت ستة فقط· ثانياً: كتابة أسماء صفحات الموقع (الروابط) بداية انقر السهم الخاص بمجموعة اللوحات (يمين النافذة) كي تختفي وتتسع مساحة العمل، ثم نفذ التالي: ·1اسحب الماوس فوق نص أول رابط، ليتم تحديده كما بالشكل رقم (2) السابق· ·2اضغط مفتاحي Alt+Shift من يمين لوحة المفاتيح كي تكتب باللغة العربية· ·3اكتب اسم الرابط الأول (الصفحة الرئيسية) · ·4حدد باقي الروابط واكتب (أخبار وتحليلات، أحكام وفتاوى، قصص إسلامية، علوم وصحة، مشاكل وحلول)· ثالثاً: كتابة اسم الصفحة واسم الموقع وروابط التنقل navigation ·5حدد اسم الموقع site name واسم الصفحة Page Name واكتب بدلاً منهما بيانات موقعك، ولا تنس أنك هنا في الصفحة الرئيسية، فقد حفظناها سابقاً باسم index. ·6 كرر الأمر نفسه بالنسبة لروابط التنقل Navigation (الموجودة بيمين الصفحة) فتصبح الصفحة الرئيسية كما بالشكل رقم (3) ·6 انقر بالماوس على أسماء روابط التنقل Navigation ثم انقر رمز (توسيط النص Align Center) من جزء خصائص النص كما بالشكل السابق ( إن لم يكن ظاهراً انقر كلمة خصائص properties الموجودة بأسفل النافذة) ، وذلك كي يتم توسيط النص وسط روابط التنقل Navigation، بالطبع ما زلنا نحتاج العديد من التنسيقات على النصوص ولكننا سنؤجلها قليلاً حتى ننتهي من تصميم الصفحة بإذن الله، ولكن بشكل مبدئي إذا واجهتك مشكلة في الكتابة باللغة العربية، نفذ الآتي: ·1افتح قائمة (تعديل Modify) ثم اختر (خصائص الصفحة (Page Properties . فيظهر مربع حوار · ·2من قسم (الفئات Category) اختر Title/Encoding. ·3افتح قائمة Encoding في يمين المربع، واختر منها (العربية Windows) فيظهر المربع كما بالشكل رقم ( 4) لتختار منه الأمر موافق Ok. رابعاً: إدراج صورة في منطقة الصورة Placeholder بداية ما هي منطقة الصورة Placeholder ؟ ارجع إلى الشكل رقم (1) فستجد أن المنطقة الموجودة تحت كلمة عنوان الصفحة Page Name منطقة بيضاء فارغة لا يوجد بها سوى حرف X أحمر ليدل على وجود صورة هنا ولكنها ليست ظاهرة في المستعرض Browser. وإذا رجعت إلى الشكل رقم (2) ستجد أن هذه المنطقة نفسها عبارة عن مربع رصاصي اللون فارغ، فما هي هذه المنطقة؟ ولماذا نستخدمها؟ هذه المنطقة هي (منطقة الصورة Image Placeholder) وهي عبارة عن منطقة مؤقتة يستخدمها المصمم عند تصميم الصفحة ليحدد بها مكان الصورة التي سيضعها عندما ينتهي من إعدادها أو تعديلها، وهذه المنطقة تظهر كمربع رصاصي اللون (افتراضياً) ويمكنك تغيير لونه إن أردت، وتظهر فوقها أرقام تعبر عن مساحتها عرضاً وارتفاعاً، وبالطبع كل ذلك يمكنك تغييره· حتى إذا ما انتهيت من تصميم الصفحة، قمت بإحلال الصورة محل منطقة الصورة، لتظهر للزائرين في مستعرض الإنترنت· وبما أننا في مثالنا أنشأنا الصفحة جاهزة التصميم، وكان فيها مكان (منطقة الصورة) فسوف نقوم الآن بإحلال الصورة موقعها، وذلك كالتالي: ·1انقر منطقة النص نقراً مزدوجاً، أو انقرها نقرة واحدة، وفي جزء الخصائص انقر الخانة الموجودة أمام أمر (مصدر Scr )، في كلتا الحالتين سيظهر مربع حوار كما بالشكل رقم (5): ·2افتراضياً سيعرض المربع كل الصور الموجودة داخل المجلد المشتمل على الموقع، فإذا كنت قد نسخت صورتك إلى هذا المجلد سابقاً ستظهر فيه· ·3أما إذا كانت الصورة غير منسوخة لموقع المجلد، فافتح خانة (بحث في Look In ) لتحدد القرص الصلب والمجلد الموجود به الصورة التي تريد إدراجها بالموقع فتظهر الصور كلها لتنقر منها الصورة التي تريدها ، ثم تنقر (موافق (Ok فتظهر رسالة كما بالشكل رقم (6): ·4في هذا الشكل يخبرك البرنامج أن هذه الصورة ليست مدرجة بالمجلد (رحاب الإسلام) ويمكن عدم الوصول إليها وقت النشر، ويسألك إن كنت تريد نسخها للمجلد أم لا؟ ·5 اختر (نعم yes) ليظهر مربع آخر يتيح لك اختيار اسمها، وموقعها داخل المجلد فدع الأمر كما هو باسمها القديم وبالموقع الذي اختاره دريم ويفر، وانقر (حفظ Save) فتظهر الصورة بالموقع، ولكنها قد تكون أكبر أو أصغر من منطقة النص، فتابعنا في الحلقة القادمة كي تعرف كيف تتحكم في حجمها، ونتعرف إلى المزيد من التعديلات على الموقع· إعداد- رحاب زناتي rehab_zanaty@hotmail.com