السلام عليكم و رحمة الله و بركاته
اليوم بمشيئة الله تعالى سنشرح طريقة تعديل الاستايل ليلائم اسلوب منتداك
و لكن سيكون الشرح مع نسخة الجيل الرابع ( vBulletin® v4.0.0 )
ملحوظه : الشرح مقتبص من كتاب تم طرحه و لكن باللغه الانجليزيه و قمت بتعريبه بحمد الله تعالى
لنلقى نظره اولا على الاستايل الافتراضى الذى يأتى مع النسخه
بسم الله نبدأ الشرح
1- الخطوة الاولى : تغيير شعار المنتدى ( اللوجو )
بالطبع كل شخص يريد تغيير الشعار او اللوجو الى لوجو منتداه الخاص و لكن ما هى الخطوات اللازمة لذلك
اولا : توجة الى لوحة تحكم المنتدى
ثم نضغط على Styles & Templates
ستظهر قائمه نختار منها Style Manager
ثم نختار الاستايل الذى نريد التعديل عليه طبعا انا انشأت استايل و اعطيته اسم D3M-VB Style v.4.0
كما بالصورة التاليه :
و من القائمه المنسدله بجانب اسم الاستايل نختار كما بالصوره StyleVars
ستفتح لنا قائمة فى الجهه اليسرى منها ستجد اسماء المتغيرات كما هو واصح بالصورة التاليه
و نختار منها المتغير titleimage
و نضع رابط الصوره و امتدادها طبعا بعد رفعها للمنتدى ثم نضغط حفظ
بالفعل تم تغيير اللوجو
و لكن طبعا الخلفيه غير ملاءمه لللوجو و لهذا سيتم تغيير لونها الى اللون الملائم و هذه هى الخطوة التاليه .
2- الخطوة الثانيه تغيير خلفية اللوجو ( Header ) :
من نفس القائمة اليسرى نختار المتغير header_background
ثم نختار اللون المناسب للهيدر و نضغط حفظ
تم تغيير لون الهيدر الان ننتقل للخطوة الثالثه و هى :
3- الخطوة الثالثه : تغيير خلفية النافبار ( navbar background )
نختار من القائمة اليسرى المتغير navbar_background
ستفتح لنا فى الجهة اليمنى لون النافبار او الصورة الموضوعه كخلفية له
طبعا بامكانك عمل خلفية بالفوتوشوب او اى برنامج و لكن يجب مراعاة ان تكون الخلفيه بلا اى حدود
انا وضعت صوره كخلفية للنافبار
ملحوظه : يجب عمل اول مربع transparent ( شفاف ) حتى لا يؤثر على شكل الخلفية و عند وضع صوره يجب ايضا وضع امتدادها .
نضغط حفظ
تم التغيير بنجاح
اليوم بمشيئة الله تعالى سنشرح طريقة تعديل الاستايل ليلائم اسلوب منتداك
و لكن سيكون الشرح مع نسخة الجيل الرابع ( vBulletin® v4.0.0 )
ملحوظه : الشرح مقتبص من كتاب تم طرحه و لكن باللغه الانجليزيه و قمت بتعريبه بحمد الله تعالى
لنلقى نظره اولا على الاستايل الافتراضى الذى يأتى مع النسخه
بسم الله نبدأ الشرح
1- الخطوة الاولى : تغيير شعار المنتدى ( اللوجو )
بالطبع كل شخص يريد تغيير الشعار او اللوجو الى لوجو منتداه الخاص و لكن ما هى الخطوات اللازمة لذلك
اولا : توجة الى لوحة تحكم المنتدى
ثم نضغط على Styles & Templates
ستظهر قائمه نختار منها Style Manager
ثم نختار الاستايل الذى نريد التعديل عليه طبعا انا انشأت استايل و اعطيته اسم D3M-VB Style v.4.0
كما بالصورة التاليه :
و من القائمه المنسدله بجانب اسم الاستايل نختار كما بالصوره StyleVars
ستفتح لنا قائمة فى الجهه اليسرى منها ستجد اسماء المتغيرات كما هو واصح بالصورة التاليه
و نختار منها المتغير titleimage
و نضع رابط الصوره و امتدادها طبعا بعد رفعها للمنتدى ثم نضغط حفظ
بالفعل تم تغيير اللوجو
و لكن طبعا الخلفيه غير ملاءمه لللوجو و لهذا سيتم تغيير لونها الى اللون الملائم و هذه هى الخطوة التاليه .
2- الخطوة الثانيه تغيير خلفية اللوجو ( Header ) :
من نفس القائمة اليسرى نختار المتغير header_background
ثم نختار اللون المناسب للهيدر و نضغط حفظ
تم تغيير لون الهيدر الان ننتقل للخطوة الثالثه و هى :
3- الخطوة الثالثه : تغيير خلفية النافبار ( navbar background )
نختار من القائمة اليسرى المتغير navbar_background
ستفتح لنا فى الجهة اليمنى لون النافبار او الصورة الموضوعه كخلفية له
طبعا بامكانك عمل خلفية بالفوتوشوب او اى برنامج و لكن يجب مراعاة ان تكون الخلفيه بلا اى حدود
انا وضعت صوره كخلفية للنافبار
ملحوظه : يجب عمل اول مربع transparent ( شفاف ) حتى لا يؤثر على شكل الخلفية و عند وضع صوره يجب ايضا وضع امتدادها .
نضغط حفظ
تم التغيير بنجاح
- الخطوة الرابعه : تغيير خلفية المنتدى كله .
نختار من القائمة اليسرى المتغير doc_backgroundColor
نختار اللون المناسب ثم نضغط حفظ
تم تغيير لون الخلفية كما واضح بالصورة السابقه
- الخطوه الخامسه : تغيير لون حدود الجدول ليتوافق مع الخلفيه .
نذهب الى المتغير navbar_border
و نختار اللون المناسب لحدود جدول النافبار
ثم نضغط حفظ
6- الخطوة السادسة : تغيير اللون او الصورة اعلى الاقسام ( رأس الجدول ).
نذهب الى المتغير blockhead_background
ملحوظه :
1- اذا وضعت الخلفيه كصوره ينصح بعرض 935 * طول 50
2- اهم خطوه ان تجعل لون الخلفيه شفاف ( transparent )
ثم تضع رابط الصوره و لا تنسى امتدادها ثم حفظ
نختار اللون المناسب ثم نضغط حفظ
تم تغيير لون الخلفية كما واضح بالصورة السابقه
- الخطوه الخامسه : تغيير لون حدود الجدول ليتوافق مع الخلفيه .
نذهب الى المتغير navbar_border
و نختار اللون المناسب لحدود جدول النافبار
ثم نضغط حفظ
6- الخطوة السادسة : تغيير اللون او الصورة اعلى الاقسام ( رأس الجدول ).
نذهب الى المتغير blockhead_background
ملحوظه :
1- اذا وضعت الخلفيه كصوره ينصح بعرض 935 * طول 50
2- اهم خطوه ان تجعل لون الخلفيه شفاف ( transparent )
ثم تضع رابط الصوره و لا تنسى امتدادها ثم حفظ
7- الخطوة السابعة : تغيير اللون او خلفية الفوتر .
نذهب الى المتغير footer_background
و نفس الخطوات كما بالخطوة السابقة .
8- الخطوة الثامنه : تغيير لون خطوط الفوتر .
نذهب الى المتغير footer_link_color
و نختار اللون المناسب للاستايل
طبعا انا اخترت اللون الاحمر للتوضيح فقط
نذهب الى المتغير footer_background
و نفس الخطوات كما بالخطوة السابقة .
8- الخطوة الثامنه : تغيير لون خطوط الفوتر .
نذهب الى المتغير footer_link_color
و نختار اللون المناسب للاستايل
طبعا انا اخترت اللون الاحمر للتوضيح فقط
- تغيير لون او شكل خلفية الاقسام .
نذهب الى المتغير body_background
ثم تغير لون خلفية الاقسام باللون المناسب لك و يمكنك ايضا وضع صوره
تم تغيير لون الخلفية الى اللون الاصفر
ثم حفظ
10- تغيير لون خلفية اسفل الاقسام ( الفوتر ) .
نذهب الى المتغير blockfoot_background
ثم نضع رابط الصورة لتظهر كخلفية اسفل الجدول
تم التغيير بنجاح
الى هنا انتهى الدرس و بأمكانك ايضا التعديل على كل ما تراه من متغيرات و بنفس الطرق السابقه
إقرأ المزيد...
