Đoạn code sau đây sử dụng công nghệ Ajaxtab để thu gọn các Mod hiển thị ngoài Forumhome của diễn đàn, nhằm thu gọn và bài trí lại cách hiển thị cho diễn đàn của bạn.
Demo Online: http://sinhvienthamdinh.com
Đầu tiên bạn tải file đính kèm về giải nén và upload thư mục svtd lên thư mục root của forum.
Sau đó mở Teample Forumhome, chèn đoạn code sau phía trên thẻ <head>
Tiếp theo là đến công đoạn thu gọn các Mod hiển thị ngoài trang chủ diễn đàn như Mod thống kê, mod chatbox, mod tin tức, mod Musicbox...
Để làm được việc này các bạn làm như sau, cũng trong Teample Forumhome, bạn tìm đoạn
Và thêm vào bên dưới đoạn sau
Để thêm các tab khác các bạn chèn thêm các dòng
<li><a href="#" rel="country4">Tên của tab</a></li>
Với thẻ rel là id của tab
ví dụ: country1,country2,country3....
Và thêm tương ứng các thẻ
<div id="country4" class="tabcontent">
<!-- Nội dung hiển thị của tab, ở đây là đoạn mã hiển thị mod như minh họa ở trên -->
</div>
với id là các id đã khai báo trong thẻ rel như: country1,country2,country3...
Chúc các bạn thành công, nếu không làm được thì pm lại mình tại chuyên mục này.
Demo Online: http://sinhvienthamdinh.com
Đầu tiên bạn tải file đính kèm về giải nén và upload thư mục svtd lên thư mục root của forum.
Sau đó mở Teample Forumhome, chèn đoạn code sau phía trên thẻ <head>
Mã:
<link rel="stylesheet" type="text/css" href="svtd/ngocanh.css" />
<script type="text/javascript" src="svtd/ngocanh.js">
/***********************************************
Với đoạn mã này các bạn có thể chèn Script vào khi load forum
***********************************************/
</script>Để làm được việc này các bạn làm như sau, cũng trong Teample Forumhome, bạn tìm đoạn
Mã:
{vb:raw navbar}
Mã:
<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="country1" class="selected">Tên mod thứ 1</a></li>
<li><a href="#" rel="country2">Tên mod thứ 2</a></li>
<li><a href="#" rel="country3">Tên mod thứ 3</a></li>
</ul>
<div style="border:1px solid gray; width: autox; margin-bottom: 1em; padding: 10px">
<div id="country1" class="tabcontent">
<!-- Chèn vào đoạn mã hiển thị mod cho tab thứ 1 (ví dụ "{vb:raw mrkm_img}" mã hiển thị mod show hình ảnh bài viết là ngoài forumhome) -->
{vb:raw mrkm_img}
</div>
<div id="country2" class="tabcontent">
<!-- Chèn vào đoạn mã hiển thị mod cho tab thứ 2 (ví dụ "{vb:raw ad_location.vietv2b_topx}" mã hiển thị mod thống kê diễn đàn) -->
{vb:raw ad_location.vietv2b_topx}
</div>
<div id="country3" class="tabcontent">
<!-- Chèn vào đoạn mã hiển thị mod cho tab thứ 3 (ví dụ "{vb:raw $template_hook.hqth_music}" mã hiển thị mod quà tặng âm nhạc) -->
{vb:raw $template_hook.hqth_music}
</div>
<script type="text/javascript">
var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()
</script><li><a href="#" rel="country4">Tên của tab</a></li>
Với thẻ rel là id của tab
ví dụ: country1,country2,country3....
Và thêm tương ứng các thẻ
<div id="country4" class="tabcontent">
<!-- Nội dung hiển thị của tab, ở đây là đoạn mã hiển thị mod như minh họa ở trên -->
</div>
với id là các id đã khai báo trong thẻ rel như: country1,country2,country3...
Chúc các bạn thành công, nếu không làm được thì pm lại mình tại chuyên mục này.
