[IMG][/IMG]الحين نجي لتركيب خلايا التمدد للستايل ... سهله جدا (( تابع ))
في الستايل الاحترافي عندنا 4 خلايا تمدد:
1- في الهيدر 2- في الفوتر 3- العمود الايمن 4- العمود الايسر
الان تابع معي عشان نركب الي في الهيدر :
ضع مؤشر الماوس في الخليه الوسطى الي في الهيدر واضغط بيمين الماوس واختار
( خصائص الخليه)
http://www.k4n4.net/3/dora1/52.png
داخل خصائص الخليه نختار تحت (استعراض ) امام خانة الخلفيه
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/53.png
.... شرح للخطوه السابقه :- السالفه ومافيها اننا بنضع خلفيه للخليه والخلفيه هذي هي منطقة التمدد وطبعا الصوره المستخدمه لازم تكون متساويه في التصميم مثل الصوره الي بنضعها عند تكرارها تعطينا شكل واحد بدون اي تشويه. وهذي هي ( خلية او منطقة التمدد )
الان تظهر لنا رساله الاستعراض بحيث نختار الصوره التي تكون خلية التمدد للهيدر وهي الصوره الي عطيناها الرقم 3 اثناء تقطيع الهيدر
اذهب لمجلد الصور واختار الصوره التاليه :
اعتذر وبشده عن اطالة شرح هذه النقطه وهذا ماهو شك في ذكائكم لاكن هذه اهم خطوه وكان يجب ان اشرحها واطيل فيها عشان يكون فهمها جدا سهل والي صعبت عليه يقولي عشان اعيد شرحها بالصور
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/54.png
الان بعد تركيب خلية التمدد نسحب الخليه الوسطى لأقصى اليمين واقصى اليسار
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/55.png
ثم نضع مؤشر الماوس داخل الخليه الوسطى ونضغط يمين الماوس ونختار (تقسيم الخليه) عشان نقسمها الي 3 خلايا
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/56.png
نختار من رسالة التقسيم ( تقسيم الى اعمده) ... عدد(3) اعمده
http://www.k4n4.net/3/dora1/57.png
تم التقسيم الى 3 خلايا الحين صار عندنا 5
خلايا في الهيدر
الحين ضع مؤشر الماوس في الخليه الثانيه اليمنى
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/58.png
نضغط هذه الايقونه عشان ندرج صوره ثابته
http://www.k4n4.net/3/dora1/49.png
الان نحتار الصوره الي عطيناها الرقم 2 اثناء تقطيع الهيدر
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/59.png
الان نضع باقي الصور الثابته بأتباع نفس الطريقه السابقه ..طبعا شغلنا الان على الهيدر ..
ترتيب الصور في الهيدر ..
قلنا قبل كذا ان الهيدر فيه 5 خلايا اليك ترتيب الصور :
(ارقام الصور حسب مارقمناها اثناء تقطيع الهيدر )
1- الخليه 1 الصوره 1
2- الخليه 2 الصوره2
3- الخليه 3 الصوره 4
4- الخليه 4 الصوره 5
5- الخليه 5 الصوره 6
,,ِ.,.,.,.,.ً.,.,.,.ِ ,, - ,,ِ.,.,.,.,.ً.,.,.,.ِ ,, - ,,ِ.,.,.,.,.ً.,.,.,.ِ ,,
الحين نعطي الصور المحاذات شوف الصوره وطبق
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/60.png
-----------------------------------------------------------------------
هذه حاله نادره وانا صارت معي يعني يمكن تحدث عند البعض والبعض لا : بعد اعطاء كل صوره المحاذاه المطلوبه تلاحظ ان الصور فيها تشويه كيف تحل هذه المشكله تابع معي.
روح للصوره التي فيها تشويه مثلا الصوره اليمنى العلويه
واضغط عليها بيمين الماوس واختار خصائص الصوره
http://www.k4n4.net/3/dora1/61.png
داخل خصائص الصوره عدل الاتي :-
الخلل يكمن في خانة( التباعد الافقي ) : اي عدد تجده داخل هذه الخانه امسحه وضع بداله العدد صفر ثم ok
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/62.png
----------------------------------------------------------
طيب كذا انتهينا من الهيييييييييييييدر يله الهمه وحوسو في الفووووووووووتر ابخليه لكم<< نذااااااااااااااااااله
طبعا نفس طريقة الهيدر مافيه اي اختلاف
--------------------------------------------------------
الحين نركب الاعمده ... سهل جدا
ضع المؤشر في خلية العمود الايمن
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/63.jpg
اضغط يمين الماوس واختار (خصائص الخليه )
داخل خصائص الخليه اضغط على استعراض لأختيار صورة العمود الايمن
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/64.png
اختار صورة العمود الايمن ... طبعا كلنا عارفين ان الاعمده صورتين صوره للعمود الايمن وصوره للعمود الايسر
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/65.png
وبكذا انتهينا من تركيب الصور ... باقي علينا بعض الخطوات المهمه قبل نقل الستايل من القرونت بيج الى المنتدى
وان شاء الله نشرحها قريب ... تابعونا
الفوائد :
1- تهيئة صفحة الستايل في الفرونت بيج
2- انشاء جدول لتركيب الستايل الاحترافي
3- كيفية جلب الصور الثابته
4- كيفية وضع خلفيه للخليه وتسمى الخلايا المتمدده
5- حل مشكله في تشويه صور الستايل بعد المحاذاه
نستأنف الباقي من الدوره
الحين ياشباب انتهينا من ترتيب الصور بقي علينا خطوتين مهمه جدا قبل نقل الستايل من الفرونت بيج الى المنتدى
الخطوه الاولى : اعطاء الصور الروابط مثل: تسجيل ولوحة التحكم ..... الخ
اضغط ع الصوره مثلا اليمنى الي فيها رابط التسجيل ..
واضغط بزر الماوس الايمن تظهر لك قائمه منسدله اختار منها (اظهار شريط التحكم بالصور )
لأظهار شريط التحكم بالصور طبعا الخطوه هذي اذا لم يكن شريط التحكم بالصور ظاهر عندك .
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/66.png
هذا شكل ( شريط التحكم بالصور) فيه ادوات كثيره لاكن الي يهمنا الصف الاخير
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/67.png
لوضع رابط منطقه محدده في الصوره .. اتبع الاتي :
1- اختار الصوره بالنقر عليها بزر الماوس الايسر نقره واحد
2- اختار الشكل المربع من شريط الصور لتحديد الرابط
http://www.k4n4.net/3/dora1/68.png
الحين ارسم مربع حول المنطقه الي بتعطيها رابط
http://www.k4n4.net/3/dora1/69.png
تلقائيا راح تظهر لك هذه الرساله :
اكتب تحت في العنوان الرابط طبعا انا سأضع رابط التسجيل اذا سأضع هذا الرابط
التسجيل :
رمز PHP:
register.php
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/70.png
وهذه قائمه بالروابط :
اقتباس
الروابط:
http://www.w7ye.net/vb/images/future...t-top-left.gifاقتباس
http://www.w7ye.net/vb/images/future...-top-right.gifhttp://www.w7ye.net/vb/images/future...p-right-10.gifاقتباس
الرئيسيه
index.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
التسجيل
register.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
لوحة التحكم للاعضاء
usercp.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
المشاركات الجديده
search.php?do=getdaily
,,,,,,,,,,,,,,,,,,,,,,,,,,
البحث
search.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
لوحة تحكم المدير العام
admincp/index.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
لوحة تحكم المشرفين
modcp/index.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
اتصل بنا
sendmessage.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
الارشيف
archive/index.php
,,,,,,,,,,,,,,,,,,,,,,,,,,
الاعلى
#top
,,,,,,,,,,,,,,,,,,,,,,,,,,
http://www.w7ye.net/vb/images/future...t-bot-left.gifhttp://www.w7ye.net/vb/images/future...-bot-right.gif
اقتباس
..... توقف....
راح تظهر لك مشكله وهو تشوه الستايل طبعا هذي المشكله تظهر نادرا
اصلا هي ماهي بمشكله والستايل لم يتشوه والدليل اختار الستعراض وراح تشوف الستايل سليم
يعني هذا التشويه طبيعي
شكل التشوه :
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/71.png
اختار نمط استعراض :
http://www.k4n4.net/3/dora1/73.png
---------------------------------
الان شوف هذا شكل الستايل بعد وضع الروابط عليه
مشوووووووووووووووووووووه في نمط التصميم :
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/74.png
وهنا سلييييييييييييييم في نمك الاستعراض :
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/75.png
....::...:::...:::..:..::..:.....:..::::...:.:.:.. ....
وبكذا انتهينا من الخطوه الاولى
الخطوه الثانيه: مهمه جدا وفيها تعديل لمسارات الصور
تابع معي اذهب الى نمط التعليمات البرمجيه او code
ركز معي :
شوف مسار الصور تجده بهذا الشكل
C/AppServ1/www/vb/k4Gr/k4G_06.gif
طبع انا عندي سيرفر شخصي وفيه ناس ماحطوه تحت سيرفر شخصي طبعا الخطوه ماتختلف
تابع معي واعرف المطلوب منك بالزبط
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/76.png
المطلوب منك هو :
تحديد المسار الملون بالازرق
C/AppServ1/www/vb/k4Gr/k4G_06.gif
واحذفه تماما عشان يسير معك المسار كذا وهذا هو المطلوب:
k4Gr/k4G_06.gif
حيث هذا (k4G_06.gif) اسم الصوره ويختلف من صوره لأخرى
وهذا (k4Gr) اسم المجلد الي وضعت فيه صور الستايل وتجده في مسار جميع الصور
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/77.png
وهذا شكل الستايل بعد تعديل مسارات الصور : الصور تختفي وهذا شي طبيعي جدا
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/78.png
الان بقي علينا نقل الستايل من الفرونت بيج للمنتدى
راح اتطرق لها في الخطوه التاليه .... تابعونا ولاتروحوا بعيد
الفوائد :
1- كيفية وضع روابط لمناطق معينه في الصور في برنامج الفرونت بيج
2- تعديل مسارات الصور لتظهر في الستايل عند رفعه في المنتدى
الله نبدأ الخطوه الاخيره هي نقل الستايل من الفرونت بيج للمنتدى
بعد مانتهينا من تعديل مسارات الصور ضع مؤشر الماوس في الخليه التي في منتصف التصميم
وعطها محاذاه للوسط
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/79.png
الان انتقل لنمط البرمجيات التعليميه او code
شوف المؤشر فين ......
الكود الي فوق المؤشر هذا ... كود الهيدر
والكود الي تحت المؤشر هذا .. كود الفوتر
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/80.png
..... تعرفنا ع الاكواد
الحين روح للمنتدى حقك وادخل ع لوحة تحكم المنتدى
وختار من الااستايلات والقوالب
التحكم بالااستايلات
http://www.k4n4.net/3/dora1/81.png
اختار الاستايل الافتراضي
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/82.png
ستدخل على صفحة القوالب القوالب الشائعه
الان ركز معي الخطوه سهله جدا .....
روح لقالب الهيدر وانسخ جميع الكود ماعدا الثلاث سطور الاخيره
او هذا الكود
كود:
$spacer_open
كود:
كود
$_phpinclude_output $ad_location[ad_header_end]
بعد التحديد احذف الكود بالضغط على delete
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/83.png
الان ارجع للفرونت بيج
وادخل ع التعليمات البرمجيه او code
وحدد كود الهيدر .. وانسخه بالضغط على Ctrl +C
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/84.png
ثم ارجع للوحة تحكم المنتدى وتحديدا الى قالب الهيدر للصق الكود فيه
ضع الكود فوق هذا الكود تماما ....
كود:
$spacer_open
كود:
كود:
$_phpinclude_output $ad_location[ad_header_end]
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/85.png
....انتهينا من الهيدر ....
الحين ارجع للفرونت بيج وانسخ كود الفوتر
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/86.png
ثم ارجع للمنتدى وتحديدا الى قالب الفوتر للصق الكود فيه
انزل اسفل قالب الفوتر ستجد اخر كلمه وهي كلمة
</script>
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/87.png
الصق كود الفوتر تحت كلمة
</script>
شوف هذا الكود بعد لصقه
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/88.png
الان انزل الى اخر الصفحه واضغط حفظ
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/89.png
الان اذهب للمنتدى لمعاينة الستايل
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/90.png
مبرووووووووووووووووووووك
لاكن بقي خطوه عشان تكبر الفرحه
لاحظ وجود مسافه بين الستايل والمتصفح ... تابع نعي لحلها
اذهب للوحة التحكم وتحديدا لخيارت الستايل
http://www.k4n4.net/3/dora1/81.png
ثم
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/82.png
ثم انزل حتى تجد هذا الاعداد
خلفية المنتدى افعل مثل ماهو موضح بالصوره
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/91.png
الان عاين الستايل
http://www.w7ye.net/vb/images/statusicon/wol_error.gifاضغط هنا لمشاهدة الصورة كاملة.
http://www.k4n4.net/3/dora1/92.png
مبروووووووووك عليك الستايل
تحياتي اخوكم وحي القلم
أٍيد فقط كلمة شكرا
وشكرا