الرئيسيةالرئيسية  س .و .جس .و .ج  بحـثبحـث  قائمة الاعضاءقائمة الاعضاء  التسجيلالتسجيل  المجموعاتالمجموعات  دخولدخول  

آلسلآم عليگم ورحمة آلله وپرگآتة
 
گيف آلحآل وگيف آلچميع آن شآء آلله پخير
 
الكود المنتظر اعتذر ع التأخر في انزالة
قالب صندوق الفئات
 
الشكل الأول

الشكل الثاني


وسيتم بأذن الله انزال بقية الاشكال من صندوق الفئات  

معلومآت آلگود :
 
آلنسخة : phpbb2
 
آلنوع : تومبيلات
 
طريقهّ آلترّگيّپ :


لوحة الادارة - مظهر المنتدى - التومبيلات القوالب





نعدل على
قالب index_box

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

الرمز:
<!-- www.haya-m.net --><!-- BEGIN catrow --><!-- BEGIN forumrow -->
<div class="Hbox"><div class="Hstyle"></div>
 <div class="Hbox1" align="center">
 <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
 <h{catrow.forumrow.LEVEL} class="hierarchy">
 <span class="forumlink">
 <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
 </span>
 </h{catrow.forumrow.LEVEL}>      
           </div>

                     <div class="Hbox2"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
 <span class="gensmall">
 <!-- BEGIN switch_moderators_links -->
 {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
 <!-- END switch_moderators_links -->
 {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
 </span></div>
                        <div class="Hbox3"> 
                  <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
                          </div>      
            
                     <div class="Hbox4"><center><strong>المواضيع</strong> {catrow.forumrow.TOPICS} | <strong>المشاركات</strong> {catrow.forumrow.POSTS} </center></div>
                    
                     </div>
 <!-- END forumrow -->
 <!-- BEGIN tablefoot -->
<!-- END tablefoot --><!-- END catrow --><!-- www.haya-m.net -->




هذا قالب الشكل الثاني

الرمز:
    <!-- www.haya-m.net --><!-- BEGIN catrow --><!-- BEGIN forumrow -->
<div class="Hbox"><div class="Hstyle"><img src="http://illiweb.com/fa/subsilver/empty.gif" alt="{catrow.forumrow.U_VIEWFORUM}" /></div>
    <div class="Hbox1" align="center">
            <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
          <h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
                  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                </span>
            </h{catrow.forumrow.LEVEL}>         
              </div>

                        <div class="Hbox2"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
            <span class="gensmall">
                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->
                {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
            </span></div>
                            <div class="Hbox3">&nbsp;
                      <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
                              </div>     
               
                        <div class="Hbox4"><center><strong>المواضيع</strong> {catrow.forumrow.TOPICS} | <strong>المشاركات</strong> {catrow.forumrow.POSTS} </center></div>
                       
                        </div>
      <!-- END forumrow -->
      <!-- BEGIN tablefoot --> 
    <!-- END tablefoot --><!-- END catrow --><!-- www.haya-m.net -->




ثم نسجل

ومن لوحة الادارة - عناصر اظافية

ننزل للأسفل  



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







مهم جدا وضع علامة صح على الصفحة الرئيسية والمنتديات الثانوية



ونضيف الكود



الرمز:
var copyright ="www.haya-m.net - haya @ Rights Reserved";
// Avatar in index by mastersly phpbb2
    $(document).on('ready', function() {
        $(' .Hbox  .Hbox3').prepend('<div class="avatar-index"><div>');
        $(' .Hbox  .Hbox3  .avatar-index ').each(function () {
            var profileUser = $(this).parent().children('span').children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUser + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUser + ' .forumline .row1.gensmall[align="center"]:eq(0) img:eq(0)');
        });
    });
document.writeln("<style>.avatar-index { float: right; }.avatar-index img { width: 40px; height: 40px; padding: 1px; border: 1px solid #DDD; margin: 0 1px; }</style><script type='text/javascript' src='http://js.haya-m.net/box.js'></script>");


والآن نذهب إلى



ننزل للأسفل







ونظيف الكود التالي

قالب css لشكل الأول

الرمز:
/*----- www.haya-m.net تنسيق الفئات  ---*/

.Hbox{width:250px; height:340px; border:0px ; margin:5px;padding:0px; }
.Hstyle{
  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/911.png);
 width:250px;
 height:180px;}
a.forumtitley{color:#FFF;padding:4px;margin-bottom:0;font-family:arial;
       font-size:16px;
       font-weight:bold;}
.Hbox1{background:#FFFFFF;color:#FFF;padding:4px;margin-bottom:0; }
.Hbox2{ background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1010.gif); }
.Hbox3{ background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1010.gif); }
.Hbox4{  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1110.gif);
  color:#000000;padding:4px;margin-bottom:0 }

قالب css لشكل الثاني

الرمز:
/*----- www.haya-m.net تنسيق الفئات  ---*/

.Hbox{width:250px; height:340px; border:0px ; margin:5px;padding:0px; }
a.forumtitley{color:#FFF;padding:4px;margin-bottom:0;font-family:arial;
      font-size:16px;
      font-weight:bold;}
.Hbox1{background:#FFFFFF;color:#FFF;padding:4px;margin-bottom:0; }
.Hbox2{ background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1010.gif); }
.Hbox3{ background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1010.gif); }
.Hbox4{  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/1110.gif);
  color:#000000;padding:4px;margin-bottom:0 }


.Hstyle img[alt^="/f1"]{
  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/99000010.png);
   width:250px;
   height:180px;}

.Hstyle img[alt^="/f2"]{
  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/untitl10.png);
   width:250px;
   height:180px;}

.Hstyle img[alt^="/f3"]{
  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/untitl11.png);
   width:250px;
   height:180px;}

ملاحظة مهمة : في الشكل الثاني لتخصيص صورة لكل فئة نضع هذا الكود مع تغير رقم الفئة ( alt^="/f0"] )

الرمز:
.Hstyle img[alt^="/f0"]{
  background-image:url(http://i19.servimg.com/u/f19/18/46/95/67/untitl11.png);
   width:250px;
   height:180px;}

وانتهينا ومبروك عليكم الشكل الجديد للفئات

آن شآء آلله يعچپگم آلگودّ

إي أستفسآأإرآت أو مشآأإگل آستقپلهآ في هذآأإ آلموضوع

وآلسلآم عليگم ورحمة آلله وپرگآته  

نُشرت في 25 05 2015   بواسطة  [ღ]هيآء محمدَ..


مُساهمة في 27.05.15 6:11 من طرف M!ss Asakura
السلام عليكم ور حمة الله وبركاته
ماشاء الله تبارك الله ماشاء الله تبارك الله
ما كنت اتوقع انك تضعي هذا الكود جميل جدًا هياء ^^
كل ما تقدمينه رائع ...مسبقًا ، قبل ان تعملي هذا الكود
شفت مرة منتدى في بي عامل شبه هيك و كنت بدي مثله
بس ماشاء الله تفاجئت لما شفتك عملتي مثله من جد ماشاء الله
الله يوفقك هياء رائع ما تقدمينه ...حاليًا لن استخدمه

مُساهمة في 28.05.15 20:56 من طرف ShahaDesign
أخيييييييييييييرًا الكُود الرههههههههههههههههههههههيب Very Happy
وقسم من زمان أتشحت ادور عليه x'DDDDDDD
واخيرًا جت ذي اللحظه وحطيتيه :$
شكرًا لكِ هياء ،
بس عندي استفسار ،
هل بالأمكان التعديل ع الكود بحيث اخلي ع كل فئة صورة خاصه بها ؟

مُساهمة في 30.05.15 0:28 من طرف [ღ]هيآء محمدَ..
وعليكم السلام ورحمة الله وبركاتة
شكرا على مروركم الاكثر من رائع  Crying or Very sad
وردودكم الجميلة وانتم تستاهلون اكثر من هذا
نأتي لاستفسار غاليتي شهد No  alien
نعم بالامكان وضع لكل فئة صورة خاصة بها  @
تمت اظافة الكود في الاعلى No

مُساهمة في 30.05.15 4:02 من طرف M!ss Asakura
ماشاء الله التعديل الثاني يهبل والله ...كتير حلو
الله يسعدك والله مجهوداتك رائعة
مش عارفة كيف راح يكون وضع المنتديات
بدونك هياء و بدون كل واحد مثلك ^^

مُساهمة في 09.06.15 8:09 من طرف رامي كاتي
واو روعه
تسلمي يا هيا محمد

مُساهمة في 14.06.15 7:11 من طرف ShahaDesign
أوه شكرًا هياء التعديل الثاني رهيب 3333333333333333>

مُساهمة في 24.06.15 5:42 من طرف D O D O - S A M A
هلآـآ حببتي
أنن شاء الله تمـآم
بارك الله فيك و ربنا سعدك على الكوؤد
لكنن للأسف ما اشتغل معـآي
هِيك ظهر
http://im45.gulfup.com/r7W4OO.png

مُساهمة في 24.06.15 22:58 من طرف D O D O - S A M A
مرحبآ
حبيت اسألك
المنتديات الي بالفئات بعدد تظهر بالرئيسية
يعني موبس الفئات
متال
http://im45.gulfup.com/yrFzmp.png

مُساهمة في 26.06.15 4:10 من طرف [ღ]هيآء محمدَ..
اقتباس :
مرحبآ
حبيت اسألك
المنتديات الي بالفئات بعدد تظهر بالرئيسية
يعني موبس الفئات
متال
http://im45.gulfup.com/yrFzmp.png

مافهمت عليك ؟؟
ممكن توضحي ؟!!

مُساهمة في 26.06.15 21:53 من طرف D O D O - S A M A
الي بيطلع بالمربع
الفئات بي أو كل منتدى يطلع بذاك المربع ؟؟