سجل في المعهد لتفعيل روابط التحميل

للتسجيل اضغط على الزر التسجيل
ندعم منتديات vBulletin بتقنية Css3
A L 6 W E R

[ BBcode ] شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام

رقم الموضوع : 5305

اكواد منتديات vBulletin 3.x.x

 

   [ 1 ]
21-01-2012, 12:20 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تواصل معي مباشرة
الصورة الرمزية لـ AlM6weR
AlM6weR
متواجد
[ مؤسس معهد المطوّر ]

اسمي : فخري الحاتم - أبو محمد , من : الرياض , أهتم بـ البرمجة - تطوير المواقع .
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات7,902 تقييم المستوى17920 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 289   تم شكره 749 مرة في 570 مشاركة
افتراضي شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام





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

سبق شرحت شرح مبسط لفكرة التأطير الرباعي لقالب الاعلانات في الرئيسية
http://www.alm6wer.com/vb/showthread.php?t=4503
واليوم سأشرح طريقة تأطير الصفحة الرئيسية + الاقسام في الرئيسية

الطريقة سهله جدا بس تحتاج شوي تركيز

في البداية وعند الانتهاء من تصميم الشكل المناسب للتأطير وليكون بهذا الشكل مثال :



كما ترون في الصورة السابقة تم تصميم الشكل وتم التقطيع بهذة الطريقة ليكون التأطير رباعي كما يسمى .

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

اولا يجب ان تكون الزوايا العلوي [ اليمين واليسار ] بنفس المقاس في العرض والارتفاع
وايضا يجب ان تكون الزوايا السفلية [ اليمين واليسار ] بنفس المقاس العرض والارتفاع
كما يمكن جعل الزوايا الاربعه بنفس المقاس اذا اردت ..

ولكن يهمنا الزوايا العلوية تكون بنفس المقاس والسفلية بنفس المقاس حتى لا يكون هناك اختلاف في عمل الكود .
من ثم نقوم باعادة تسمية الصورة قبل الحفظ وذلك باستخدام اداة التقطيع كما في الصور التالية :





وبعد ذلك نقوم بالضغط على زر File في برنامج الفوتوشوب ونختار save for web كما في الصورة :





ونقوم بحفظها في مجلد مستقل ..

الآن نجي للكود ، الكود بالشكل التالي :

HTML & CSS

<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
 <
tr>
  <
td height="40" width="10"><!-- عرض وارتفاع صورة الزاوية اليمين العلوية -->
  <
img alt="" height="40" src="folder/right-top.gif" width="10" /></td><!-- رابط الصورة العلوية اليمين عرض وارتفاع الصورة -->
  <
td align="center" class="top"></td><!-- CSS حقل الصورة الي فوق باستخدام الخلفية بخاصية الكلاس في خصائص -->
  <
td height="40" width="10"><!-- عرض وارتفاع صورة الزاوية اليسار العلوية -->
  <
img alt="" height="40" src="folder/left-top.gif" width="10" /></td><!-- رابط الصورة العلوية اليسار عرض وارتفاع الصورة -->
 </
tr>
 <
tr>
  <
td class="right"></td><!-- CSS حقل الصورة اليمين باستخدام الخلفية بخاصية الكلاس في خصائص -->
  <
td>
  <!-- 
نهاية الكود العلوي -->
 
  <!-- 
القالب المراد تأطيره -->
 
  <!-- 
بداية الكود السفلي -->
  </
td>
  <
td class="left"></td><!-- CSS حقل الصورة اليسار باستخدام الخلفية بخاصية الكلاس في خصائص -->
 </
tr>
 <
tr>
  <
td height="30" width="10"><!-- عرض وارتفاع صورة الزاوية اليمين السفليه -->
  <
img alt="" height="30" src="folder/right-bottom.gif" width="10" /></td><!-- رابط الصورة العلوية اليسار عرض وارتفاع الصورة -->
  <
td class="bottom"></td><!-- CSS حقل الصورة الي تحت باستخدام الخلفية بخاصية الكلاس في خصائص -->
  <
td height="30" width="10"><!-- عرض وارتفاع صورة الزاوية اليسار السفلية -->
  <
img alt="" height="30" src="folder/left-bottom.gif" width="10" /></td><!-- رابط الصورة السفلية اليسار عرض وارتفاع الصورة -->
 </
tr>
</
table
صورة للكود في برنامج اكسبريشن ويب :



الكود مشروح بحذافيره والي ما راح ينجح في الطبيق يؤسفني اقوله هاردلك لن تتمكن من تأطير قوالب منتداك .

يتبع [ شرح طريقة تأطير الصفحة الرئيسية والاقسام في الرئيسية ]




كلمات البحث - معهد المطور

ارشفة, ستايل, كود, هاك, html, css, java, BBcode, seo, php, JavaScript, Product, Style


أبوعبدالله, بندر العيسى, Shaimaa   [ 3 ] معجبون بمشاركة AlM6weR


توقيعي



عَنْ جُوَيْرِيَةَ بنت الحارث، أم المؤمنين رضي الله عنها؛ أَنَّ النَّبِيَّ صلى الله عليه وسلم خَرَجَ مِنْ عِنْدِهَا بُكْرَةً، حِينَ صَلَّى الصُّبْحَ وَهِيَ فِي مَسْجِدِهَا، ثُمَّ رَجَعَ بَعْدَ أَنْ أَضْحَى، وَهِيَ جَالِسَةٌ، فَقَالَ:
((مَا زِلْتِ عَلَى الْحَالِ الَّتِي فَارَقْتُكِ عَلَيْهَا؟)) قَالَتْ: نَعَمْ، قَالَ النَّبِيُّ صلى الله عليه وسلم: ((لَقَدْ قُلْتُ بَعْدَكِ أَرْبَعَ كَلِمَاتٍ، ثَلَاثَ مَرَّاتٍ، لَوْ وُزِنَتْ بِمَا قُلْتِ مُنْذُ الْيَوْمِ لَوَزَنَتْهُنَّ:
سُبْحَانَ اللهِ وَبِحَمْدِهِ عَدَدَ خَلْقِهِ، وَرِضَا نَفْسِهِ وَزِنَةَ عَرْشِهِ، وَمِدَادَ كَلِمَاتِهِ)).



   [ 2 ]
21-01-2012, 12:41 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تواصل معي مباشرة
الصورة الرمزية لـ AlM6weR
AlM6weR
متواجد
[ مؤسس معهد المطوّر ]

اسمي : فخري الحاتم - أبو محمد , من : الرياض , أهتم بـ البرمجة - تطوير المواقع .
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات7,902 تقييم المستوى17920 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 289   تم شكره 749 مرة في 570 مشاركة
رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


لكي تتمكن من تأطير الصفحة الرئيسية للمنتدى وكذلك الاقسام في الرئيسية وايضا احصائيات المنتدى في الاسفل .

اذا كانت الاقسام غير مفصولة [ افتراضي ] سيتم التعديل على قالب الـ FORUMHOME فقط .
ننسخ محتوى قالب FORUMHOME ونضعه في برنامج اكسبريشن ويب

في بداية القالب ستجد كود الترحيب بالزائر كما في الصورة :



ليتم تأطيره بهذا الشكل ابحث عن :

HTML & CSS

<!-- guest welcome message --> 
ضع اسفله مباشرة الكود العلوي للتأطير

ثم ابحث عن :

HTML & CSS

<!-- / guest welcome message --> 
وضع اسفله مباشرة كود التأطير السفلي

انتهينا من تأطير قالب الترحيب بالزوار ..

الآن تاطير الاقسام في الرئيسية
ابحث عن :

HTML & CSS

<!-- main --> 
ضع اسفله مباشرة الكود العلوي للتأطير

ثم ابحث عن :

HTML & CSS

<!-- /main --> 
وضع اسفله مباشرة كود التأطير السفلي

انتهنيا من تأطير الاقسام ..

الآن تأطير احصائيات المنتدى الي تحت الاقسام
ابحث عن :

HTML & CSS

<!-- what's going on box --> 
ضع اسفله مباشرة الكود العلوي للتأطير

ثم ابحث عن :

HTML & CSS

<!-- end what's going on box --> 
وضع اسفله مباشرة كود التأطير السفلي

هذا بالنسبة للاستايل الافتراضي بالاقسام الغير مفصولة أو المنفصلة .

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

اما اذا كانت الاقسام مفصولة سيتم التعديل على قالبين هما :
FORUMHOME
forumhome_forumbit_level1_nopost

[ قالب FORUMHOME بنفس الشرح السابق لكن بدون وجود كود الاقسام ]

اما في قالب forumhome_forumbit_level1_nopost
نضع كود التأطير العلوي في بداية القالب .
ونضع كود التأطير السفلي في نهاية القالب .

انتهينا من الشرح ، وأي استفسارات اخرى أنا حاضر ..

يرجى عدم نقل الموضوع الا بذكر المصدر




   [ 3 ]
21-01-2012, 01:16 AM
11
عضو معهد المطور
ندعم جميع منتديات
الجيل الثالث بتقنية CSS3
بندر العيسى
غير متواجد
[ مطوّر مشارك ]

تاريخ الإنضمام09-06-2010 عدد المشاركات128 تقييم المستوى169 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 8   تم شكره 9 مرة في 9 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


تسلم يمينك ابو محمد شرح صراحه وافي وكافي ومبسط ويوصل معلومه وطريقه مهمه ومرغوبه في تحسين شكل المنتديات
تقبل تحياتي




   [ 4 ]
21-01-2012, 02:56 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
تجربتي
2
الصورة الرمزية لـ أبوعبدالله
أبوعبدالله عضو موثوق في معهد المطور
غير متواجد
[ المستشار ]

اسمي : AbuAbdullah , من : بيشة , أهتم بـ البرمجة - الشعر - القراءة .
عضو لدية أكثر من 2000 مشاركةعضو لدية أكثر من 2000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات2,334 تقييم المستوى3476 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 235   تم شكره 130 مرة في 107 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


ما شاء الله

زادك الله من فضله وعلمه


فعلا زكاة العلم نشره...

لن نجد أفضل منك يا أبو محمد في الشروحات
والإلمام بكل التفاصيل صغيرها وكبيرها.

جعل الله التوفيق دائما حليفك...




   [ 5 ]
21-01-2012, 01:51 PM
2687
عضو معهد المطور
ندعم جميع منتديات
الجيل الثالث بتقنية CSS3
Shaimaa
غير متواجد
[ مطوّر مشارك ]

عضو لدية أكثر من 200 مشاركة
تاريخ الإنضمام11-08-2011 عدد المشاركات435 تقييم المستوى535 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 64   تم شكره 36 مرة في 24 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


اهنيئك ع ابداعك الششرح واافي وواضح ابدعت والله
شئ مب جديد علييك الابداع والتمييز شئ معروف عن ابومحمد
جعل ـآيادينك سسالمة ي’رب
ودى




   [ 6 ]
25-01-2012, 02:59 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تواصل معي مباشرة
الصورة الرمزية لـ AlM6weR
AlM6weR
متواجد
[ مؤسس معهد المطوّر ]

اسمي : فخري الحاتم - أبو محمد , من : الرياض , أهتم بـ البرمجة - تطوير المواقع .
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات7,902 تقييم المستوى17920 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 289   تم شكره 749 مرة في 570 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


تسلم يمينك ابو محمد شرح صراحه وافي وكافي ومبسط ويوصل معلومه وطريقه مهمه ومرغوبه في تحسين شكل المنتديات
تقبل تحياتي
يا هلا بمشرفنا الفاضل اخوي بندر ، سعدت بمرورك يالغالي ..




   [ 7 ]
25-01-2012, 03:00 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تواصل معي مباشرة
الصورة الرمزية لـ AlM6weR
AlM6weR
متواجد
[ مؤسس معهد المطوّر ]

اسمي : فخري الحاتم - أبو محمد , من : الرياض , أهتم بـ البرمجة - تطوير المواقع .
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات7,902 تقييم المستوى17920 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 289   تم شكره 749 مرة في 570 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


ما شاء الله

زادك الله من فضله وعلمه


فعلا زكاة العلم نشره...

لن نجد أفضل منك يا أبو محمد في الشروحات
والإلمام بكل التفاصيل صغيرها وكبيرها.

جعل الله التوفيق دائما حليفك...
ولك بالمثل اخوي ابوعبدالله
سعدت بهذا الرد الجميل والمثلج للصدر
واشكرك ع المرور الرائع ..




   [ 8 ]
25-01-2012, 03:02 AM
تابعني على facebook
تابعني على twitter
تابعني على google plus
تابعني على youtube
معهد المطوّر
1
تواصل معي مباشرة
الصورة الرمزية لـ AlM6weR
AlM6weR
متواجد
[ مؤسس معهد المطوّر ]

اسمي : فخري الحاتم - أبو محمد , من : الرياض , أهتم بـ البرمجة - تطوير المواقع .
عضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركةعضو لدية أكثر من 6000 مشاركة
تاريخ الإنضمام07-06-2010 عدد المشاركات7,902 تقييم المستوى17920 الدولةsaudi arabia
الإعجابات التي قدمها للأعضاء 289   تم شكره 749 مرة في 570 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


اهنيئك ع ابداعك الششرح واافي وواضح ابدعت والله
شئ مب جديد علييك الابداع والتمييز شئ معروف عن ابومحمد
جعل ـآيادينك سسالمة ي’رب
ودى
هلا بالغالية اختنا شيماء ، مرورك زاد الموضوع بريقا
وهذا من ذوقك ، سعدت بهذا الرد الجميل
اشكرك ع المرور ..




   [ 9 ]
25-01-2012, 08:38 PM
3616
الصورة الرمزية لـ احمدمحمدحسين
احمدمحمدحسين
غير متواجد
[ مطوّر مشارك ]

اسمي : الفقير الى الله ,
عضو لدية أكثر من 200 مشاركة
تاريخ الإنضمام05-11-2011 عدد المشاركات404 تقييم المستوى435 الدولةegypt
الإعجابات التي قدمها للأعضاء 8   تم شكره 4 مرة في 4 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


شكرا لك ابومحمد




   [ 10 ]
01-07-2012, 10:06 AM
4444
الصورة الرمزية لـ صلاح عبد الغنى
صلاح عبد الغنى
غير متواجد
[ مطوّر مشارك ]

اسمي : ابو حبيبة ,
تاريخ الإنضمام01-07-2012 عدد المشاركات33 تقييم المستوى57 الدولةegypt
  تم شكره 6 مرة في 2 مشاركة
افتراضي رد: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام


بارك الله فيك





مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)
للصفحة, التأطير, الرباعي, الرئيسية, والاقسام, طريقة

أدوات الموضوع إبحث في الموضوع
إبحث في الموضوع:

البحث المتقدم


المواضيع المتشابهه للموضوع: شرح طريقة التأطير الرباعي للصفحة الرئيسية والاقسام
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
[ طلب ] طريقة جعل الصفحة الرئيسية للمنتدى مثل ترايدنت 2015 theprincedz طلبات و مشاكل منتديات vBulletin 3.x.x 5 25-02-2015 06:30 PM
[ BBcode ] طريقة توسيط مسميات الاقسام الرئيسية AlM6weR اكواد منتديات vBulletin 3.x.x 2 27-06-2013 10:14 PM
[ BBcode ] طريقة عرض أيقونة التغذية جانب كل قسم في الرئيسية AlM6weR اكواد منتديات vBulletin 3.x.x 3 10-05-2013 06:47 PM
طريقة الغاء خانة المراقبين في الصفحة الرئيسية AlM6weR تطوير المواقع والمنتديات 2 28-03-2013 08:47 PM
[ استفسار ] ممكن طريقة تغير الصورة الرئيسية للمنتدى shahab طلبات و مشاكل منتديات vBulletin 3.x.x 3 08-06-2011 06:31 PM


الساعة الآن 02:57 PM

RSS RSS 2.0 XML Sitemap1 Sitemap2 HTML Tags اتصل بنا بيان الخصوصية

Powered by vBulletin@Version 3.8.7 .Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
المشاركات والمواضيع تعبر عن رأي كاتبها وليس بالضرورة رأي المطوّر
وجميع الحقوق محفوظة لاصحابها