قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه

الأربعاء ديسمبر 05, 2018 2:05 pm

قالب index_box تحويل الفئات لثلاث اقسام مربعه
قالب صندوق الفئات
الشكل الأول

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Mempxzfelw2k

الشكل الثاني
قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Aer3ej607hbj

معلومآت آلگود :

آلنسخة : phpbb2

آلنوع : تومبيلات

طريقهّ آلترّگيّپ :

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

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Kquy4puw743g

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Kquy4puw743g

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه E7bsxqb1qu58

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

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

الكود:نسخ الكود

الكود::  <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">  {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}  {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>

الشكل الثاني

الكود:نسخ الكود

الكود::  <div class="Hbox"><div class="Hstyle"><img src="http://2img.net/i/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">  {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}  {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>

ثم نسجل

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

ننزل للأسفل

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه V73to6m3bx1a

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

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه 17zfnn2fqfgg

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Xxliivu7g7v7

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Y8g4vvoiby2i

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

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه 7gqyqllek1x4

ونضيف الكود

الكود:نسخ الكود

الكود:: 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>");

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

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Kquy4puw743g

ننزل للأسفل

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه Quygv8jb5ydi

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه 0swi7lnyh3mc

قالب INDEX_BOX تحويل الفئات لثلاث اقسام مربعه 5adq9hjzykyn

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

قالب 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;}