ضع إعلانك هنا

طريقة وضع أقسام المنتدى بشكل أفقي

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف keko_ferkeko في الجمعة فبراير 12, 2016 8:23 am

بسم الله الرحمن الرحيم
السلام عليكم و رحمة الله و بركاته


منتديات أحلى منتدى تعتمد على ترتيب أقسام المنتديات بشكل رأسي مثل معظم شركات المنتديات الأخرى، لكن مؤخراً رأينا كيف أن بعض المنتديات تبع شركة أحلى منتدى قد كسرت هذه القاعدة و قامت بوضع الأقسام بشكل أفقي جذاب جداً في الحقيقة، حتى أننا جربنا هذه الطريقة هنا لبعض الوقت و لاقت نجاحاً لا بأس به.
أضع لكم هنا الطريقة بالتفصيل و كذلك الأكواد المطلوبة.

هذا مثال للتصميم المقصود



و إليكم الخطوات

1. اذهب إلى لوحة الإدارة
إدارة عامة
المنتديات و الفئات

2. اضغط على العلامة  بجوار القسم المراد تحويله.

3. في وصف المنتدى، ادخل الكود التالي:

الرمز:
<span style="float: left; margin: 15px 0px 0px 20px; width: 75%;"><table align="center" width="95%"><tr><td rowspan="2" width="36px">
 
<!-- Forum #1 Image -->
<img src="http://icons.iconarchive.com/icons/designcontest/vintage/48/Sketch-Book-icon.png"></td><td align="left" width="28%">
 
<!-- Forum #1 Link and Name -->
<a href="FORUM-URL"><b>Forum 1</b></a>
 
</td><td rowspan="2" width="36px">
 
<!-- Forum #2 Link and Name -->
<img src="http://icons.iconarchive.com/icons/iconshock/real-vista-social/48/gifts-icon.png"></td><td align="left" width="28%">
<a href="FORUM-URL"><b>Forum 2</b></a></td>
 
<td rowspan="2" width="36px">
 
<!-- Forum #3 Link and Name -->
<img src="http://icons.iconarchive.com/icons/mayosoft/azullustre/48/medal-icon.png"></td><td align="left" width="28%">
<a href="FORUM-URL"><b>Forum 3</b></a></td></tr>
 
<!-- Forum Descriptions -->
<tr><td align="left">
FORUM #1 DESCRIPTION</td>
<td align="left">
FORUM #2 DESCRIPTION</td><td align="left">
FORUM #3 DESCRIPTION</td></tr></table></span>
<div style="float: right; margin-right: 10px">
 
<!-- Icon which appears at the right of the forums -->
<img src="http://icons.iconarchive.com/icons/iconshock/super-vista-business/72/trophy-icon.png" border="0" alt="" /></div><span style="float: left; margin: 25px 0px 0px 10px; width: 75%;">
 
<!-- Text under all three forums -->
Text which will appear under the forums.</span>

4. الآن تستطيع حفظ التغييرات و مشاهدتها.

5. لتعديل الكود، إليكم شرحه

الرمز:
<!-- Forum # Image -->
<img src="أيقونة المنتدى"

<!-- Forum # Link and Name -->
<a href="FORUM-URL">
ضع رابط المنتدى بدلاً من FORUM-URL

<b>Forum (#)</b>
ضع اسم المنتدى بدلاً من Forum (#)

<!-- Forum Descriptions -->
<td align="left">FORUM # DESCRIPTION</td>
ضع وصف المنتدى بدلاً من FORUM # DESCRIPTION

<!-- Icon which appears at the right of the forums -->
<img src="الصورة على يمين المنتديات"

<!-- Text under all three forums -->
السطر الموجود أسفل المنتديات الثلاثة


خالص تحياتي


________________________________________
.::الَّلهُمَّـ اجعَلْـ عَمَلَنَا خَالِصًا لِوَجهَكَـ الكَرِيمِـ::.


keko_ferkeko
عضو محترف
عضو محترف

البلد :
السن : 24
تاريخ التسجيل : 16/08/2007
المشاركات : 3254
الاهتمامات : القراءة-التصميم-بناء المواقع-النت
الوظيفة : طالب جامعي
الأوسمة :


معاينة صفحة البيانات الشخصي للعضو http://nf-son.forumotion.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف keko_ferkeko في الجمعة فبراير 12, 2016 8:27 am

و هذا كود أبسط لتعديل أي منتدى


الرمز:
<div style="float: right; margin-right: 10px">
 <!-- Forum Image -->
<img src="http://www.johnmayer.it/forum/images/icons/presentazioni.png" border="0" alt="" />
</div>
 <!-- Forum Description Text -->
<span style="float: left; margin: 25px 0px 0px 10px; width: 75%;">
This is the section where you will find the rules and regulations of the forum, the various FAQ, rules and regulations of the chatbox, and a guide on becoming the perfect user.</span>


مثال للتصميم



الرمز:
[center][/center]
[center]<!-- Forum Image -->
<img src= "رابط الصور"
Text - الوصف[/center]
[center][/center]

________________________________________
.::الَّلهُمَّـ اجعَلْـ عَمَلَنَا خَالِصًا لِوَجهَكَـ الكَرِيمِـ::.


keko_ferkeko
عضو محترف
عضو محترف

البلد :
السن : 24
تاريخ التسجيل : 16/08/2007
المشاركات : 3254
الاهتمامات : القراءة-التصميم-بناء المواقع-النت
الوظيفة : طالب جامعي
الأوسمة :


معاينة صفحة البيانات الشخصي للعضو http://nf-son.forumotion.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف Abdallah.BeraYda في الأحد يوليو 03, 2016 8:40 pm

السلام عليكم و رحمة الله و بركاته
ما شاء الله تبارك الله 
طرحت فأبدعت ، و إخترت فتوفقت 
هذا بالفعل هو التعديل الذي ينتظره الكل و جاري تجريبه و العمل 
الشكر موصول لك ، دمت مبدعا 
و شكرا

Abdallah.BeraYda
عضو جديد
عضو جديد

البلد :
السن : 21
تاريخ التسجيل : 03/07/2016
المشاركات : 10
الاهتمامات : الويب ، التصمم ، البرمجة ...
الوظيفة : طالب
الأوسمة :


معاينة صفحة البيانات الشخصي للعضو http://itkanaraby.riadah.org

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف keko_ferkeko في الأحد يوليو 03, 2016 8:43 pm

عليكم السلام و رحمة الله و بركاته

العفو... شكراً على مرورك.
أرجو أن تكون قد استفدت.

________________________________________
.::الَّلهُمَّـ اجعَلْـ عَمَلَنَا خَالِصًا لِوَجهَكَـ الكَرِيمِـ::.


keko_ferkeko
عضو محترف
عضو محترف

البلد :
السن : 24
تاريخ التسجيل : 16/08/2007
المشاركات : 3254
الاهتمامات : القراءة-التصميم-بناء المواقع-النت
الوظيفة : طالب جامعي
الأوسمة :


معاينة صفحة البيانات الشخصي للعضو http://nf-son.forumotion.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف MSCFC في السبت يوليو 16, 2016 4:50 pm

روعة

________________________________________
المعهد العربي للبرمجة http://arabi.123.st
أول منتدى عربي على أحلى منتدى يختص بالبرمجة

MSCFC
عضو مشارك
عضو مشارك

البلد :
السن : 16
تاريخ التسجيل : 01/07/2016
المشاركات : 188
الوظيفة : Programmer - Coder

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طريقة وضع أقسام المنتدى بشكل أفقي

مُساهمة من طرف keko_ferkeko في الأحد يوليو 17, 2016 8:22 am

الأروع مرورك و تعليقك.
أرجو أن تكون قد استفدت يبتسم

________________________________________
.::الَّلهُمَّـ اجعَلْـ عَمَلَنَا خَالِصًا لِوَجهَكَـ الكَرِيمِـ::.


keko_ferkeko
عضو محترف
عضو محترف

البلد :
السن : 24
تاريخ التسجيل : 16/08/2007
المشاركات : 3254
الاهتمامات : القراءة-التصميم-بناء المواقع-النت
الوظيفة : طالب جامعي
الأوسمة :


معاينة صفحة البيانات الشخصي للعضو http://nf-son.forumotion.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

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


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى