حصريًا .. دورة تصميم موقع شخصي

21. من القائمة العلوية نختار insert ثم Inline frame




و نضغط زر


new page





22. نرجع إلى مجلدنا My site و نفتح مجلد



images






23. الصورة التي حذفناها نبحث عنها و نضع مؤشر الفأرة على الصورة لأخذ الطول والعرض الخاص بها




و نسجله في note pad أو أي شيء مناسب لك ..


24. نرجع للفرونت بيج و نضغط ضغطتين على Inline frame ليظهر لنا صندوق الحوار الخاص به ..





و فيه سنوضع الأبعاد بالترتيب كما هو موضح .. مع ازالة علامة الصح من

Show border

ليظهر بالشكل هذا





25. هذه الخطوة سنقوم بعمل صفحات الموقع الفرعية .. افتح صفحة جديدة خالية





26. اول صفحة هي صفحة الإضافات و الاخبار الخ .. , اكتب ماتريد فيه و غير خلفية الصفحة الى خلفية الكتابة الزرقاء




يمكنك اخذ كود اللون من وضع صورة من البرواز في الصفحة الجديدة التي عملناها و اخذ لونها بأداة الالتقاط


و هناك طرق كثيرة اخرى .. كأخذ الكود من برنامج Smart color او بالفرونت بيج ..


28 . بعد ذلك نقوم بحفظ الصفحة داخل مجلدنا My site { لا تحفظه داخل images }




سم الصفحة updates.htm و احفظها بعد ذلك ..





29. ارجع لـ Inline frame و اضغط مرتين عليه ثم اضغط

browse





و اختر الصفحة updates.htm التي عملناها كي تظهر في كاول صفحة في الموقع ثم موافق





30. انظر النتيجة




31. نكمل عمل الصفحات الفرعية ..{ من أنا }..


نفتح صفحة جديدة





32. لأخذ كود الخلفية اذهب الى صفحة updates بالأسفل و اضغط Code كما هو موضح




و انسخ الكود المحدد باللون الأخضر .. الى الصفحة الجديدة من أنا







33. اكتب ماتريد





34. احفظ الصفحة كالتالي ..





سم الصفحة me.htm و احفظه في نفس المجلد






35. وصلنا الى صفحة تصاميمي .. و سنتعلم ادراج ايقونة تصميم في حال النقر عليها

سيظهر التصميم بالكامل عند المشاهد ..



36. افتح الفوتوشوب بهذه المعايير { كـأيقونة }





37. افتح تصميمك و ادرجه في الايقونة ليظهر جزء منه فقط ..


38. قبل حفظ الأيقونة ارجع لمجلد My site ثم images

و انشأ ملف جديد بإسم designs لكي نضع التصاميم و الأيقونات داخله

{ خطوة لترتيب العمل لا غير }





39. احفظ الأيقونة داخل مجلد designs الجديد ..




و قم بنسخ تصميمك الكامل الى المجلد السابق designs أيضا



{ كرر الخطوات من 36 الى 39 } في حال ادراج اكثر من تصميم ..


40. الآن افتح صفحة فرعية جديدة بنفس لون الخلفية الزرقاء كما تعلمنا


و اكتب ما تريد ثم ادرج الأيقونة التي صممتها كالتالي








41. قم بـ عمل رايت كلك على الصورة و اختر اخر خيار


hyperlink





42. ماهو التصميم الذي تريد ان يظهر لو نقر المتصفح لموقعك على الأيقونة ؟


اختر هذا التصميم الخاص بك { بحجمه الأصلي } والموجود في مجلد
designs




43. اذهب للمحدد في الصورة







44. اختر هذا الخيار لفتح نافذة جديدة عند النقر على الايقونة







45.و موافق .. احفظ التصميم بإسم designs.htm داخل مجلد

my site






46

. قم بعمل صفحة جديدة كالسابقات و اعمل صفحة الموسيقى







47

. كـ مثال للارتباط التشعبي قمت بوضع { للاستماع } و سنتعلم كيف نعمله



ظلل كلمة للاستماع و رايت كلك من الفأرة





و اختر hyperlink .. و ضع وصلة الموسيقى التي تريدها ..






48. احفظ الصفحة بإسم music.htm بنفس المجلد






49. الصفحات التالية { أصدقائي - سجل الزوار - اتصل بي } قم بعملها و حفظها




مثال لحفظ أصدقائي








سجل الزوار







اتصل بي






50. الصورة المحددة اضغط بداخلها مرة واحدة




51. و نظهر هذا الشريط و اسمه


Pictures




من


veiw - tools - pictures



52. نختار الأداة المحددة




و نحدد كلمة من أنا فقط { اذا لم يتحدد الكلام فيعني انك لم تقم بالضغط على الصورة }




53. عملنا سابقا صفحة من انا و اسمها me.htm و الآن سنربطها بالكلام ! جميل ..؟



54. اتبع الصور ..



ثم نختار new window



55. نفس الخطوات نتبعها مع الكلمات الأخرى وبكل سهول وبساطة !



تصاميمي







ثم نختار new window

الموسيقى


ثم نختار new window

اصدقائي




ثم نختار new window

سجل الزوار





ثم نختار new window

اتصل بنا




ثم نختار new window



انتهينا من الصفحات و ربطها ..





56. في حال ان الصورة التي عملنا بها قد تحددت باللون الأزرق يمكننا ازالته بسهولة بالنقر مرتين عليها






ثم نغير قيمة التحديد 2 الى 0



57. الصور الجانبية نستطيع عمل hyperlink لها بالنقر عليها بالزر الأيمن واختيار

hyperlink




58. و اختيار الصورة .. اتبع الصورة




انتهينا و بحمد الله من اعداد و اخراج الموقع بالفرونت بيج


----------------------------------------------------------------------------------------------------------------------------------------------------


• ملاحظات و خطوات هامة

يعطيك العافية يا غالي

جهد عظيم في ميزان حسناتك بإذن الله

والله جهد بالفعل عضيم وتستاهل عليه احلى تقيم

ربنا يغفر لوالديك ويوفقق للخير ويعطيك لحتا يرضيك يا رب

تحياتي الحاره الك

اخوك حسام خضر

اخوي مب شكلك نسيت تكتب " منقول " ؟

و بالتوفيق لصاحب الدرس

جزاك الله خيرا يا غالي
مجهود جبار

سلمت يداك

تسلم و يعطيك العافيه

اخوك

محمود

شرح متكامل جدا ومميز جدا

الله يوفقك في دينك واخرتك ويبارك فيك وفي علمك وعيالك

الله يجزاك خير والله ماوفيتك حقك اخوي الطيب

جزاك الله الف خير على هدا الجهد

ربي يوفقك ويجزاك كل خير حبيبي
والشكر موصل لصاحب الموضوع

بجد شرح سهل و مفيد جدا ربنا يوافقك يا محمود

جوزيت خيراً على هذا الشرح الرائع

الصراحة تسلم الايادى فعلا جهد وعمل مميز

حقيقه مجهود تشكرعليه ماقصرت استاذ بمعنى الكلمه

الف شكرررررررررررررررررررر
شرح روعه