تراجع إلى الخلف   :: TRAIDNT FORUM :: > قسم تطوير المنتديات > ركن تطوير منتديات vb3.8.0

ركن تطوير منتديات vb3.8.0 :: يمنع منعاً باتا ً .. كتابة اي موضوع يهتم بمشاكل المنتديات (( يمنع وضع نسخ vBulletin ))

[Ajax] لمســـة جمــآلية للمنتدى عرض الاقسام بتقنية الاجاكس شرح كامل بالصور

السلام عليكم ورحمة الله وبركاته ان شاء الله الجميع بخــير اليوم موعدنا شوي مع الاجاكس أول شيء المثال اترك الصفحة تحمل براحتها وتمسكهاش رعص على

اضافة رد
  #1  
قديمة 27 - 09 - 2009, 16:28 alg4h.com غير متواجد حاليآ بالمنتدى
:: عضو فعال ::
بيانات موقعي
اصدار المنتدى: لا أملك منتدى
 





alg4h.com يستحق التميز

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

ان شاء الله الجميع بخــير

اليوم موعدنا شوي مع الاجاكس


أول شيء المثال

اترك الصفحة تحمل براحتها وتمسكهاش رعص على الاقسام قبل نهاية تحميل الصفحة كليا

http://www.univ-dz.net/forums/index.php?styleid=8


بعض الشباب ما فهمو هذا فديو يوضح عمل لموضوع المتمثل في استعراض الاقسـآم بتقنية
الاجاكس

الرجاء الدخول هنا لمشاهدة العرض


http://www.univ-dz.net/forums/testajax

عجبك ||| ~~~~ يعني تكمل معنا ~~~~||||||


الخطوة 1 رفع الملفات
من مجلد upload
مجلد tab -> ــ clientscript/tabs/
ملف tabforumhome.php->مجلد المنتدى الرئيسي

ثانيا

من لوحة التحكم -> Product الهاكات Plugins ->تنزيل / رفع الإضافات Plugins

قم بستيراد الملف tfh-wol-plugins.xml تراه Plugins وليس Product


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

هي 3 قوالب مش اكثر

اول شيء اختر الاستايل لي بدك تعمل عليه الاجاكس

نبدا عالبركة


نفتح قالب forumhome ونقوم بالبحث على

رمز PHP:
</head




نضيف فوقه
رمز PHP:
<!-- Tabbed Forum Home Header Code -->    
    <
link rel="stylesheet" type="text/css" href="clientscript/tabs/ajaxtabs.css" /> 
    <
script type="text/javascript" src="clientscript/tabs/ajaxtabs.js"</script>
<!-- /Tabbed Forum Home Header Code --> 
ثانيا نبحث عن
رمز PHP:
 <!-- main --> 
اعمل سلكت من بداية الوسم الى نهايته وق بحفظه فملف نصي باسم FORUMHOMETAB.txt (نحتاج الكود هذا بعدين )

الصورة







الان استبدل الكود المحدد بهذا الكود

رمز PHP:
<!-- main -->
<!-- 
Tabbed Forum Home -->

<
div id="ajaxTFH" class="TFHmenu2">
    <
ul>
        <
li class="selected"><a href="tabforumhome.php?tabcat[]=IDforum" rel="ajaxTFHcontentarea">forum name </a></li>


    </
ul>
</
div>

<
br style="clear: left" />

<
div class="TFHmenu2line"></div>

<
div id="ajaxTFHcontentarea" style="border:0px solid gray; width:100%; height: 100%; background-color: white; padding: 0px"></div>

<
script type="text/javascript">
    var 
mytabs=new ddajaxtabs("ajaxTFH""ajaxTFHcontentarea")
        
mytabs.setpersist(true)
        
mytabs.setselectedClassTarget("link"
        
mytabs.init()
</script>

<!-- /Tabbed Forum Home  -->
<!-- /main --> 





خطوة 4.1 تعديل قالب forumhome_forumbit_level1_post




اظف اعلى القالب الكود التالي

رمز PHP:
<if condition="(THIS_SCRIPT == 'tabforumhome' AND in_array($forum['forumid'], $GLOBALS[tabcats])) OR THIS_SCRIPT == 'forumdisplay'"
واظف اسفل القالب
رمز PHP:
 </if> 


خطوة 4.2 تعديل قالب forumhome_forumbit_level1_nopost





اظف اعلى القالب الكود التالي

رمز PHP:
<if condition="(THIS_SCRIPT == 'tabforumhome' AND in_array($forum['forumid'], $GLOBALS[tabcats])) OR THIS_SCRIPT == 'forumdisplay'"
واظف اسفل القالب
رمز PHP:
 </if> 
انتهينا من التعديل << تعبنـــآ ..

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




نعطه اسم
رمز PHP:
 FORUMHOMETAB 
والمحتوى هو الكود لي قمنا بحفضه فالملف النصي
<<< لا تقولي فقدته





الحين خطوة اخيرة

نرجع الى قالب forumhome

ابحث عن
رمز PHP:
 <!-- Tabbed Forum Home --> 

لو تلاحظ معي عزيزي هذا الكود
رمز PHP:
<li class="selected"><a href="tabforumhome.php?tabcat[]=IDforum" rel="ajaxTFHcontentarea">forum name </a></li
فمكان IDforum حط رقم القسم مثال
قسم تطوير المنتديات
http://traidnt.net/vb/forumdisplay.php?f=9

اذا ID هذا القسم في ترايدنت هو 9 بسيطة الفكرة

في مكان forum name حط اسم القسم مثلا قسم تطوير المنتديات

يصير الكود هيك
رمز PHP:
<li class="selected"><a href="tabforumhome.php?tabcat[]=9" rel="ajaxTFHcontentarea">قسم تطوير المنتديات  </a></li

الحين كله تمام باقي تعمل كوبي كولي للكود لكل قسم لاني فالمثال حاط قسم واحد فقط

بسيطة كوبي كولي وبعدها غير رقم القسم واسم القسم فقط


لمحـــه
طيب لو بدك تعرض اكثر من قسم في tab واحد مثلا بالاضافة الى قسم تطوير المنتديات بدي احط معه قسم قسم تطوير المواقع

فقط اضف tabcat[]=idforum& اخرى الى الرابط
مثال
اذا كان اي دي قسم تطوير المواقع هو 10 الكود بيصير

رمز PHP:
<li class="selected"><a href="tabforumhome.php?tabcat[]=9&tabcat[]=10" rel="ajaxTFHcontentarea">القسم الجديد  </a></li
فهمت الفكرة < فقط تاخذ رقم القسم وتضيف tabcat[]=idforum& فكل مرة وبكذا تقدر تحط

المنتدى كله تحت tab واحد >


طيب حبيبي وش باقي الحين


امممم لي ما تعجبهم الالوان تقدر تغيرها من ملف css طبعا



الصورة بعد لاني مغيرها تقدر تغيرها حسب ذوقك


فائدة العملية طبعا العملية جيدة جدا لتسريع المنتدى لان وضيفة الاجاكس الفعلية هي no-refresh لا

تحديث للصفحات واخيرآ لمســه جمالية للمنتدى عندك

تقدر مثلا تعرض كل الاقسام في tab وتحط امور اخرى فباقي tab ودي يبيلها تعديل على القسم وهذه يمكن استعمالها مع الشرط if لرقم المنتدى ........ فكرة فقط انا مالي خبرة كبيرة بها



العمل طبعا مجهود شخصي قد اخطئ وقد اصيب

اي استفسار ان شاء الله موجودين


وفالاخير اصلي واسلم على هادي الامم وحبيب القلوب محمد عليه افضل الصلاة وازكى التسليم
الملفات المرفقة
نوع الملف : zip ajax tab forums 1.5.zip (429.4 كيلوبايت, عدد مرات المشاهدة 196 مرة)
توقيع alg4h.com
www.alg4h.com


الاستضافة الجزائرية للمواقع


اختيارك الاول فالجزائر

طلب استضافة http://www.alg4h.com/

www.alg4h.com/

للاتصال بنا او الماسنجر

alg4halg4h.com

الهاتف

00213771502360

تلميذ في معهد ترايدنت

المادة : لغة PHP
التعديل الأخير كان بواسطة alg4h.com; 27 - 09 - 2009 الساعة 19:08
اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 2 ]
قديمة 27 - 09 - 2009, 17:45 SAEEDR غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 
صورة 'SAEEDR' الرمزية
 


SAEEDR يستحق التميز
بيانات موقعي
اسم الموقع: عهود الشوق
اصدار المنتدى: 3.8.2
افتراضي
ما فهمت شيء ... ياليت توضح
SAEEDR
توقيع SAEEDR
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 3 ]
قديمة 27 - 09 - 2009, 19:05 BhMaster غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 


BhMaster يستحق التميز
بيانات موقعي
اصدار المنتدى: VB 3.6.8
افتراضي
جهدك كبير تشكر عليه

بس

احسه يبطئ المنتدى لو كان سريع !
BhMaster
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 4 ]
قديمة 27 - 09 - 2009, 19:26 m-7ob.com غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 


m-7ob.com يستحق التميز
أرسل رسالة بواسطة MSN إلى m-7ob.com
بيانات موقعي
اسم الموقع: مملكة الحب
اصدار المنتدى: 3.8.4
افتراضي
مشكوور

ويعطيك العافيه
m-7ob.com
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 5 ]
قديمة 27 - 09 - 2009, 19:29 عبـد العزيـز غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 
صورة 'عبـد العزيـز' الرمزية
 


عبـد العزيـز على طريق الابداععبـد العزيـز على طريق الابداععبـد العزيـز على طريق الابداع
بيانات موقعي
اسم الموقع: ترايدنت
اصدار المنتدى: 3.8.4
افتراضي
شي حلو والله

ابصراحه ابداع

ما قصرت الغالي
عبـد العزيـز
توقيع عبـد العزيـز
سبحانك اللهم بحمدك لا اله الا انت سبحانك اني كنت من الظالمين
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 6 ]
قديمة 27 - 09 - 2009, 20:30 نور الشرقية غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 


نور الشرقية على طريق الابداعنور الشرقية على طريق الابداعنور الشرقية على طريق الابداع
بيانات موقعي
اسم الموقع: موبايلي عالم من اختياري
اصدار المنتدى: 4.1.5
افتراضي
كثرة الاجاكس يلعب في سرعة التصفح في المنتدى
الي منتداه ثقيل لايفكر يحطها
ماقصرت على الطرح
نور الشرقية
توقيع نور الشرقية
ولا شي
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 7 ]
قديمة 28 - 09 - 2009, 00:12 alg4h.com غير متواجد حاليآ بالمنتدى
:: عضو فعال ::
 


alg4h.com يستحق التميز
بيانات موقعي
اصدار المنتدى: لا أملك منتدى
افتراضي
اقتباس
 مشاهدة المشاركة المشاركة الأصلية أضيفت بواسطة : SAEEDR
ما فهمت شيء ... ياليت توضح


تم اضافة المثال فديو للفهم

اقتباس
 مشاهدة المشاركة المشاركة الأصلية أضيفت بواسطة : BhMaster
جهدك كبير تشكر عليه

بس

احسه يبطئ المنتدى لو كان سريع !

الاجاكس وظيفته الاساية يمنع تحديث الصفحة

في بعض الاحيان نظطر لتحديث الصفحات مع تغيير بسيط فيها

الاجاكس يغير من دون تحديث الصفحة فرايك منو الاسرع

اقتباس
 مشاهدة المشاركة المشاركة الأصلية أضيفت بواسطة : m-7ob.com
مشكوور

ويعطيك العافيه



الله يعافيك حبيبي
توقيع alg4h.com
www.alg4h.com


الاستضافة الجزائرية للمواقع


اختيارك الاول فالجزائر

طلب استضافة http://www.alg4h.com/

www.alg4h.com/

للاتصال بنا او الماسنجر

alg4halg4h.com

الهاتف

00213771502360

تلميذ في معهد ترايدنت

المادة : لغة PHP
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 8 ]
قديمة 28 - 09 - 2009, 00:20 شاعرة غير متواجد حاليآ بالمنتدى
:: عضو فعال ::
 


شاعرة يستحق التميز
بيانات موقعي
اسم الموقع: شبكة العربية
اصدار المنتدى: 3.8.4
افتراضي
شكرا
بس الفكرة تطبيقهاصعب شوي ومعقدة

بالتوفيق للجميع
شاعرة
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 9 ]
قديمة 28 - 09 - 2009, 11:10 alg4h.com غير متواجد حاليآ بالمنتدى
:: عضو فعال ::
 


alg4h.com يستحق التميز
بيانات موقعي
اصدار المنتدى: لا أملك منتدى
افتراضي
اقتباس
 مشاهدة المشاركة المشاركة الأصلية أضيفت بواسطة : شاعرة
شكرا
بس الفكرة تطبيقهاصعب شوي ومعقدة

بالتوفيق للجميع

لا مو معقدة ولا اي شيء
مشروحة بالتفصيل فقط

تحياتي لك
توقيع alg4h.com
www.alg4h.com


الاستضافة الجزائرية للمواقع


اختيارك الاول فالجزائر

طلب استضافة http://www.alg4h.com/

www.alg4h.com/

للاتصال بنا او الماسنجر

alg4halg4h.com

الهاتف

00213771502360

تلميذ في معهد ترايدنت

المادة : لغة PHP
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 10 ]
قديمة 29 - 09 - 2009, 09:41 GARFIELD غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 
صورة 'GARFIELD' الرمزية
 


GARFIELD مبدعGARFIELD مبدعGARFIELD مبدعGARFIELD مبدع
بيانات موقعي
اصدار المنتدى: :: مجتمع ترايدنت ::
افتراضي
سبق طرح ابوراشد الهاك في المنتدى باسم ( تاب للاقسام ) او شي مشابه بدون تعديل اي قوالب !

سلمت الايادي !
GARFIELD
توقيع GARFIELD
Follow Me : @xDa7oMx
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 11 ]
قديمة 29 - 09 - 2009, 15:41 ramallah-land غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 


ramallah-land يستحق التميز
بيانات موقعي
اسم الموقع: رام الله لاند
اصدار المنتدى: 3.8.2
افتراضي
جاري التطبيق

تسلم يا كبير
ramallah-land
توقيع ramallah-land
نتائج امتحانات التوجيهي 2011 + امتحانات سنوات سابقة وحلول الاسئلة


اضخم تجمع طلابي فلسطيني
رام الله لاند
www.ramallah-land.com

اينما وجد الابداع ، انها رام الله لاند
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 12 ]
قديمة 06 - 10 - 2009, 17:39 ahmedipa غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 


ahmedipa على طريق الابداعahmedipa على طريق الابداع
أرسل رسالة بواسطة MSN إلى ahmedipa أرسل رسالة بواسطة Skype™ إلى ahmedipa
بيانات موقعي
اصدار المنتدى: :: مجتمع ترايدنت ::
افتراضي
روعة تبعدن عن تركيب البرودكت
ahmedipa
توقيع ahmedipa
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 13 ]
قديمة 15 - 10 - 2009, 16:50 ثعلب الصحراء غير متواجد حاليآ بالمنتدى
:: عضو جديد ::
 


ثعلب الصحراء يستحق التميز
أرسل رسالة بواسطة MSN إلى ثعلب الصحراء
بيانات موقعي
اسم الموقع: منتديات بنت المغرب
اصدار المنتدى: 3.8.2
افتراضي
كثرة الاجاكس يلعب في سرعة التصفح في المنتدى
الي منتداه ثقيل لايفكر يحطها
ماقصرت على الطرح
ثعلب الصحراء
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 14 ]
قديمة 15 - 10 - 2009, 17:27 uaebuy غير متواجد حاليآ بالمنتدى
:: عضو فعال ::
 


uaebuy يستحق التميز
بيانات موقعي
اسم الموقع: الامارات للشراء الالكتروني
اصدار المنتدى: 3.8.7
افتراضي
بارك الله فيك


جهد تشكر عليه
uaebuy
توقيع uaebuy
سبحان الله وبحمدة
  اضافة رد مع اقتباس نص هذه المشاركة
  رقم المشاركة : [ 15 ]
قديمة 15 - 10 - 2009, 17:30 Tknion.CoM غير متواجد حاليآ بالمنتدى
:: عضو نشيط ::
 
صورة 'Tknion.CoM' الرمزية
 


Tknion.CoM يستحق التميز
بيانات موقعي
اسم الموقع: .:: تـقـنـيـون ::.
اصدار المنتدى: منتج اخر
افتراضي
يسلمو حبيبى
Tknion.CoM
  اضافة رد مع اقتباس نص هذه المشاركة
اضافة رد

العلامات المرجعية

أدوات الموضوع
طرق العرض

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

رمز [IMG] : متاحة
رمز HTML : معطّلة
المراجع : معطّلة
Refbacks are متاحة




الساعة معتمدة بتوقيت جرينتش +3 . الساعة الآن : 12:39.
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسئولية نفسه إتجاه مايقوم به من بيع وشراء وإتفاق وأعطاء معلومات موقعه
التعليقات المنشورة لا تعبر عن رأي معهد ترايدنت ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر)


Powered by vBulletin® Version 3.8.7
.Copyright ©2000 - 2012, Jelsoft Enterprises Ltd

SEO by vBSEO 3.6.0 ©2011, Crawlability, Inc.