ازاى اعمل واجهه للمنتدى

اخوانى اريد اعرف ازاى اعمل واجهه لمنتددى زى الموجوده فى ماى ايجى مع صنع ازرار للدخول الى المنتدى والدردشه وغيره مع العلم انى على استضافه مجانيه
اسم المنتدى www.as4ev.hostwq.net

الطريقة

اولا

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

خل الصور تكون طالعات عشان تسهل عليك الربط


الان مثال انا بشرحه على صوره





الي مو طالع له الشريط الثالث

هنا شرح اظهار الشريط الارتباط


مثال



اختر بنفس الي بالصورة

وراح يظهر الشريط

مثال




الان

نربط مثلا زر التحميل برابط

مثال


نظغط عالصوره المربع الي مأشر عليه

وراح الماوس يتحمل على اداه قلم

وتروح كأنك تبي تقطع الزر واذهب حدد عالزر التحميل

مثال




لما تحطط راح يطلع لكم نافذه لوضع رابط بالزر

مثال




وهكذا

وكرر العملية لكل الازرار الي عندك في البنر

يعني تضغط مربع وتروح تحدد وتضع الرابط وهكذا

ومن ثم تنسخون الكود وتستبدلونه بالقالب الهيدر



قبل المغامره انسخوا نسخوا نسخه من القالب


وان شاء الله فهمتوا الشرح البسيط


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

===================================


و اجهة مجانية رائعة مفتوحة المصدر لمواقعكم بمناسبة حلول شهر رمضان المبارك


واجهات جميلة لأصحاب المواقع مفتوحة المصدر ( متجدد )


واجهة رائعة لأصحاب مواقع الاستضافات السلفية


و الا فيمكنكم تصميمها بنفسكم

و هاهي الواجهة التي اخترناها لدرسنا مع التعديل :

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 713 * 526 و حجم 211KB.


نقوم بفتحها بالبرنامج الشهير لتحرير الصور : adobe photoshop

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

ثم نذهب الى الآداة لتقطيع تصميمنا كما هو موضح في الصورة :


ملاحظة : كل قطعة تعينها تمثل رابط لصفحة أخرى في موقعك

مثلا : المنتدى رابطه www.salafsoft.com/vb

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 864 * 548 و حجم 248KB.

و نعين المناطق بالاداة التي نريد تقطيعها

مثلا الجهة العليا اين مكتوب شيكة الحاسوب السلفية

بعد تعيينها نضغط بالزر اليمن كما هو موضح في الصورة





edit slice Option

ثم تظهر لنا بينات القطعة كما في الصورة :


و ندخل فيه الرابط الذي تؤدي اليه الجهة العليا مع عنوان الرابط

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 793 * 658 و حجم 190KB.

نفس الشيء مع الأزرار الأخرى مثلا زر المنتدى

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 816 * 586 و حجم 244KB.

ثم نكتب الرابط مع العنوان

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 823 * 667 و حجم 177KB.


و نطبق على جميع القطع التي عينها

ثم نحفظ العمل كما في الصورة :
بالضغط على save for the web

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 681 * 595 و حجم 177KB.

و نواصل كما في الصورة مع ان يكون صيغة الحفظ html and images

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 997 * 719 و حجم 142KB.


و نحصل على ملفات الصور بهذه الطريقة :


تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 778 * 624 و حجم 72KB.


نذهب الى ملف html و نفتحه بال Front page كما في الصورة :

تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 788 * 692 و حجم 56KB.


و نذهب الى زر Design في الأسفل :

فتظهر لنا الصورة فنضغط مثلا على المنتدى بالز الأيمن كما هو موضح


page propety :
تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 886 * 642 و حجم 219KB.
ثم يظهر لنا العنوان و نضغط على ok
تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 700 * 528 و حجم 119KB.

ثم نذهب الى Hyperlink proprety لرؤية رابط الزر




ثم ندخل رابط المنتدى :


تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 808 * 694 و حجم 153KB.

و نتأكد من سمك الزر بالضغط على picture propretie يجب ان يكون 0
تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 643 * 516 و حجم 114KB.

و نقوم بهذا التطبيق على جميع الأزرار
ثم ننقر على code في برنامج الفرونت بيج :



يظهر لنا كود التصميم فنقوم بتغيير الروابط :

مثلا رابط :

/images/ wajiha4_01
الي www.ttt.com/images/wajiha4_01

مع تغيير ttt الى مسار موقعك


تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 804 * 546 و حجم 111KB.


ثم نقوم بحفظ العمل



و في الأخير نغير ملف Html الى index.html

كما في الصورة :


تم تصغير هذه الصورة. إضغط هنا لمشاهدة الصورة كاملة. الصورة الأصلية بأبعاد 823 * 667 و حجم 177KB.


و بعد ذلك ارفع مجلد images و index.html

عبر ftp الى موقعك

و سيكون رابط صفحتك الرئيسية

www.ttt.com/index.html


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

واضح شرح