السلام عليكم ورحمة الله وبركاتة
والصلاة والسلام على أشرف خلق الله سيدنا محمد بن عبد الله علية أفضل الصلاة والسلام
الرجاء قرائة الموضوع كاملاً وعدم القفز بين السطور لتوضيح ما قد يغيب عنك والإستفادة من إستخدام الشرح لأقصى درجة
الدرس الأول
الدرس الأول من دورة التكويد لعشرين قالب فى واحد ثانية
بسم الله نبدأ الدرس الثانى من درس تكويد تصميم 20 قالب فى واحد ثانية
ولكن أقتبست الدرس الأول كى يكون مرجع شامل أمامكم
الدرس اليوم
فكرة متواجدة منذ إنشاء نسخ المنتديات الحديثة
ولا أكذبكم القول إحتكرت الفكرة لعملى فقط ولكن بمرور الوقت قررت شرح سلسلة دروس لمعرفة ما هى فكرة
توزيع 20 قالب فى أقل من واحد ثانية
حيث فيما مضى وأيام العمل السريع كنت أخرج فى اليوم أكثر من 20 تصميم جاهزين للتركيب على المواقع العربية
فكان لابد من تواجد طريقة لإنجاز عامل الوقت
لا أطيل عليكم فى الحديث
الدروس التى سوف أقوم بشرحها
ليست متخصصة لفئة محددة
ولكن مفيدة للهواه ولموزعين تصاميم المنتديات الذين يعملون مع شركات أو يقدمون تصاميم مجانية
الفكرة فقط تقتضى فى تعب بعض الوقت وراحة تامة حتى يصدر نسخة محدثة كما تعودنا فى ترقية المنتديات
وبما أن أخر إصدارات لجيل الثالث تحتوى على نفس فكرة الدرس
فختاماً نختم دروسنا أجمع بهذا الدرس القيم بإذن الله
ولا ننسى توجية الشكر لأخواتنا فى الله
أخى الحبيبي ثامر ناصر الصعيدى الملقب بالمتميز السعودى
وأخونا الحبيب الحاضر الغائب أبو راشد
نبدأ على بركة الله
كل تعبنا فى تجهيز تصميم ديفولت Default مجهز للتوزيع والتكويد الفوري
فتعبنا هيكون فى تجهيز التصميم من ناحية الخطوط فصل الأقسام تحديد عدد القوالب الذى سوف يتم توزيع الصور عليها
فسوف أبدأ بفكرة ندر شرحها أو لا توجد فى الأصل
وهى طريقة البحث والإستبدال السليم
يوجد طريقتان للبحث والإستبدال
1- البحث والإستبدال الثابت .
2- البحث والإستبدال المتغير وهذا هو درسنا
وتصل للجزء الخاص بدرسنا
فعلينا تفعيل متغير أولاً ولشرح وضع متغير
توجة للوحة تحكم المنتدى ثم
التحكم بالإستايلات
خيارات جميع الإستيلات ثم تختار من القائمة
متغيرات الإستبدال
مع الذهاب للمسار الذى أشرنا إلية أعلاه
سوف يظهر لنا الصورة التالية فارغة
كل ما علينا إضافة متغير جديد كما موضح بالضغط على رقم واحد
سوف يظهر أمامنا كما بالصورة التالة
وهنا أضفنا المتغير
علينا إجراء نفس الخطوات لإضافة المتغيرات التالية بالتتابعكود:<!-- UP -->
وهنا كما شاهدتو فى الصورةكود:<!-- UP --> <!-- DW --> <!-- header --> <!-- footer -->
تم إضافة أربع رموز أو كما قلنا متغيرات للإستبدال
الصورة التالية توضح
أكتفى بهذا القدر ونلتقى فى التجهيز للدرس الثانى
لأهم المناطق
وسوف يتم التوزيع على أكثر من عشرين قالب
ولكنى لن أقوم بشرح العشرين قالب وسوف أقوم بالتعديل وشرح الفكرة فى قالب الفورم هوم
والتطبيق من الأعطاء والمتدربين والخبراء على كافة القوالب الموضوعة ويمكن الإزادة كما تريد
مرفق ملف إستايل إفتراضى طبقت علية درسنا اليوم
الملفات المرفقة الحالية
ديفولت خاص بدرس التكويد الجزء الأول.zip
والأن جاء دور التجهيز والتعب الحقيقي
تجهيز التصميم للعملوالتلائم للغة العربية
وسوف أضع درس كمرجع لحفر الجدول كمثال
حفر الجدول لكافة المتصفحات ولاكن اكثر من كود تفضل وتعلم الطريق إلى الإحتراف
تغير أكواد سي اس اس ومعرفة كل جزء منها
إدارة الستايلات - ..:: losha.net ::.. - vBulletin لوحة تحكم المشرف العام
وهنا قمت بشرح لقالب ولكن بطرسقة أشمل وأوسع وضعت الدرس للتذكرة
{ حصري } شرح تأطير جدول SHOWTHREAD+ postbit مع تغير طريقة عرض الموضوع
ومن ما طرحت أعلاه هو تنثيق للتصميم لكون مجهز كامل مكمل لم يتنبقى سوى توزيع اللأوان والصور
أول شئ القوالب الذى سوف نعدل عليهاوسوف أقوم بالتعديل وشرح الفكرة فى قالب الفورم هوم
كود:FORUMHOME FORUMDISPLAY forumhome_forumbit & forumbit_level1_nopostforumbit فى حالة فصل الأقسام footer header navbar newreply newthread pm_messagelist register register_rules SHOWTHREAD threadadmin_mergethreads threadadmin_moveposts threadadmin_movethread threadadmin_movethreadsthreadadmin USERCP visitormessage_editorvisitormessage WHOSONLINE postbit_legacylegacy postbit
والتطبيق من الأعطاء والمتدربين والخبراء على كافة القوالب الموضوعة ويمكن الإزادة كما تريد
الأن الفكرة تقتضى فى تجهيز التصميم
ومعرفة بداية ونهاية كل جدول كما تعلمنا فى توزيع التصميم على قوالب المنتدى
ويمكن الإستعانة بهذا الدرس
أو إتباع الصورة التالية للتذكير فقط
أول درس من نوعه تعلم تأطير الجداول ونبدأ بالناف بار navbar
{ حصري } شرح تأطير جدول SHOWTHREAD+ postbit مع تغير طريقة عرض الموضوع
(شرح + حصري) توزيع الهيدر +الفوتر+ الأعمدة مختلفة المقاسات توزيع حر
والرموز التى سوف تضاف كما أشرنى فى الدرس السابق هنــــــــــــــــــــــــــا
سنبدأ بتوزيع الوسمان أو الرمزان
والوسم up يرمز للتوزيع العلوى أو التقطير العلوى أى كان تستخدم سواءكود:<!-- up --> <!-- dw -->
هنا لا يهم تقنية الإستخدام سواء إستخدمت table أو div
بالله ركز فى هذه النقطة 100%
الوسم كما وضعناه فى متغيرات الإستبدال لابد أن يوضع كما وضعتناه هناك
ففى درسى الأول وضعت فى الشرح الوسم <!-- UP --> وفى هذا الشرح وضعت الوسم <!-- up -->
وهنا الإختلاف مابين الكابتل والسمول ركزو بالله أنا قاصد هذا للتنبية على حساسية الكتابة والمسافات
الأن أتبعى معى
التحكم بالإستايلات
ثم إتبع معى الخطوات التالية المصورة لإظهار كافة القوالب
ثم الضغط مرة أخرة لظهور كافة القوالب
ومن هنا نضغط فقط على أول حرف من إسم القالب F ونخرج القالب غلى برنامج التكويد
وبدون صور
فى قالب الفورم هوم FORUMDISPLAY
نبحث عن
نضيف أسفلةكود:<!-- sub-forum list -->
وهو الرمز المخصص لتوزيع العلوىكود:<!-- up -->
نبحث عن
نضيف أعلاةكود:<br /> <!-- / sub-forum list -->
وهو الجزء المخصص لتوزيع السفلىكود:<!-- dw -->
ولا زلنا فى قالب
نبحث عن
نضيف أسفلةكود:<!-- / controls above thread list -->
[CODE]
<!-- up -->
[/CODE
]وهو الرمز المخصص لتوزيع العلوى
نبحث عن
نضيف أعلاةكود:<!-- controls below thread list -->
وهو الجزء المخصص لتوزيع السفلىكود:<!-- dw -->
نبحث عن
نضيف أسفلةكود:<!-- Active Users in this Forum (and sub-forums) and Moderators --> <form action="forumdisplay.php" method="get"> <input type="hidden" name="s" value="$session[sessionhash]" /> <input type="hidden" name="f" value="$forumid" /> <input type="hidden" name="page" value="$pagenumber" /> <input type="hidden" name="pp" value="$perpage" />
وهو الرمز المخصص لتوزيع العلوىكود:<!-- up -->
نبحث عن
نضيف أعلاةكود:</form> <!-- End Active Users in this Forum (and sub-forums) and Moderators -->
وهو الجزء المخصص لتوزيع السفلىكود:<!-- dw -->
سجل العمل وأحفظ القالب
القالب التالى FORUMHOME فروم هوم رئيسية المنتدى
ما تم شرحو من قبل ما هو إلا لمعرفة كيفية توزيع الوسم أو الرمز المخصص أعلى مناطق التوزيع
التى تقوم بوضع المناطق التجميلية عليها علوية وسفلية وهيدر وفوتير
نأتى الأن للتوزيع
فقد قمنا بتجهيز تصميم كامل مكمل لم يبقى سوى شيئان فقط توزيع الصور + الألوان
لا نستطيع في كل موضوع أن نشرح الأسس والتفاصيل الصغيرة هناك اشياء مفهومة ضمناً لكن يمكن فتح موضوع منفصل للاستفسار عن هذه الأمور .
الدرس القادم والنهائى
سوف يكون الإستبدال النهائى
وكما واضح من هذا الدرس أننى لم أرفق تطبيق لهذا الدرس فعلى أمل وضع تطبيقاتكم
وفى الدرس النهائى سوف يتم وضع الإستايل الديفولت مجهز للعمل بإذن الله مباشرة وسوف يكون هدية لكل المكودين
والله ولى التوفيق
الدروس برعاية :لوشا لخدمات وتطبيقات الويب
وفي ختام هذا الشرح أدعوا الله لي ولكم ولوالدينا ولمن أحببناه في الدنيا
بالهداية والصلاح في الدنيا وأن يجمعنا جميعاً في الفردوس الأعلى ....
سبحانك اللهم وبحمدك , أشهد أن لا اله إلا أنت أستغفرك وأتوب إليك
أخوكم فى الله
Ali Losha