PDA

View Full Version : Thu gọn các MOD trong 1 Tab - Làm gọn 4rum của bạn.



HTT.itvn
04-03-2012, 09:59 AM
Với những 4rum có cài nhiều MOD hiển thị ở Forumhome như topx, chatbox, Thông báo ... Những MOD này làm 4rum bị kéo dài thêm gây loãng 4rum. Nay mình hướng dẫn cách thu gọn các MOD vào một tab bằng JS đơn giản .

- Đầu tiên xem Demo tại đây (http://dwebvn.com/forum/forum.php)

- Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn Style >> Edit Tempaltes >> Forum Home Templates >> FORUMHOME , tìm code sau :


{vb:raw header}

{vb:raw navbar}

Chèn xuống dưới đoạn code sau :


<link rel="stylesheet" type="text/css" href="http://dwebvn.com/forum/images/DWEBVN/css/HTT_tab.css" />
<link rel="stylesheet" type="text/css" href="http://dwebvn.com/forum/images/DWEBVN/css/HTT_dtab.css" />
<script type="text/javascript" src="http://dwebvn.com/forum/images/DWEBVN/js/HTT_tab.js"></script>

<div class="HTT_NTNonline_tab">
<ul id="HTT_dwebvn_1" class="shadetabs">
<li><a href="javascript://" rel="country1" class="selected">&nbsp;&nbsp;&nbsp;Tiêu đề 1&nbsp;&nbsp;&nbsp;</a></li>
<li><a href="javascript://" rel="country2">&nbsp;&nbsp;&nbsp;Tiêu đề 2&nbsp;&nbsp;&nbsp;</a></li>
<li><a href="javascript://" rel="country3">&nbsp;&nbsp;&nbsp;Tiêu đề 3&nbsp;&nbsp;&nbsp;</a></li>
<div class="HTT_tabTL"></div>
<div class="HTT_tabTR"></div>
</ul>
<div id="country1" class="tabcontent">
<!---Chèn hook template 1--->
</div>
<div id="country2" class="tabcontent">
<!---Chèn hook template 2--->
</div>
<div id="country3" class="tabcontent">
<!---Chèn hook template 3--->
</div>
<script type="text/javascript">var countries=new ddtabcontent("HTT_dwebvn_1")countries.setpersist(true)countries.setselectedCl assTarget("link") //"link" or "linkparent"countries.init()</script>
</div>


Các bạn chèn các hook template theo tùy ý nhé. Chú ý là các MOD phải ở chế độ tự chèn thủ công hook template.

CHÚC BẠN THÀNH CÔNG !

BlogSoftvn
04-03-2012, 01:53 PM
Cái skin demo củng đẹp ghê, hihi

Cơn Gió
04-03-2012, 11:52 PM
share skin không anh thanh

banhkinhakdemi
05-03-2012, 06:01 PM
Làm thế nào để forum hiển thị như này ạ? và" Các bạn chèn các hook template theo tùy ý nhé. Chú ý là các MOD phải ở chế độ tự chèn thủ công hook template." hook template là gì ạ? e k hỉu chỗ này. Ai giải thích hộ e với

HTT.itvn
05-03-2012, 07:05 PM
Tức chế độ Auto Template của MOD là "No" . VÍ dụ như code của Top-x ( ITVNN đang dùng ) là : {vb:raw ad_location.vietv2b_topx} , cái này gọi là hook Template của MOD.

banhkinhakdemi
05-03-2012, 07:10 PM
vậy làm thế nào để có cái cột hiển thì như trang của anh ạ?(phần em khoanh đỏ trong ảnh đính kèm ý ạ)

HTT.itvn
05-03-2012, 07:25 PM
Cái này với người chưa từng có kinh nghiệm thiết kế Style thì khó mà hướng dẫn. Style anh đang dùng demo hầu như anh code lại toàn bộ các template của VBB và tự thiết kế MOD riêng ( không dùng các MOD có sẵn chỉ trừ MOD thank, Top-x , chatbox và dĩ nhiên cũng code lại MOD nó ) nên hướng dẫn qua đây cũng dài , phức tạp , vả lại chỉ hợp với 4rum kia thôi ( không phải 4rum của anh - anh chỉ quản lý tạm thời thôi ).

Mỗi diễn đàn phải có phong cách riêng biệt , nhất là 4rum chuyên về IT. Vì vậy anh không thể hướng dẫn phần này , mong em thông cảm.

banhkinhakdemi
05-03-2012, 07:40 PM
vậy style của anh có giống với cái này không ạ? Nếu khác thì a chỉ e cách làm dc cái giống như ở 4r này với ạ

HTT.itvn
05-03-2012, 08:03 PM
vậy style của anh có giống với cái này không ạ? Nếu khác thì a chỉ e cách làm dc cái giống như ở 4r này với ạ

Cái đó là Forum Sidebar and Block có sẵn của VBB4. Em làm theo cách sau :

1. Vào Admincp >> Settings >> Options >> Forum Sidebar and Block Options >> Phần Enable Forum Sidebar chọn " Yes " để kích hoạt

2. Vào AdminCP >> Forums & Moderators >> Forum Blocks Manager >> Add Block >> Custom HTML/PHP >> Continue >> Điền như sau :
- Title : Tiêu đề hiển thị
- Content Type : chọn HTML
- Content : Code HTML mà muốn hiển thị như quảng cáo , thời tiết ...

>> Nhấn Save và vào 4rum xem thành quả.

phanvanhai
06-03-2012, 04:31 PM
bạn có thể phát triển cái này thành mod tab forumhome được ko?
cái mod [YUI] Tabbed Forum Home có trên mạng nó load chậm quá

banhkinhakdemi
10-03-2012, 09:32 PM
Anh ơi sao em làm như hướng dẫn mà nó k ra nhỉ. Cái này có phân biệt bản suite và bản forum k?

HTT.itvn
10-03-2012, 09:35 PM
Anh ơi sao em làm như hướng dẫn mà nó k ra nhỉ. Cái này có phân biệt bản suite và bản forum k?

Không phân biệt đâu. Không hiển thị là do 4rum của em có JS trùng với với JS của code này. Em thử kiểm tra các MOD hiển thị ở FORUMHOME nhé.

banhkinhakdemi
10-03-2012, 09:46 PM
Anh có thể cho e Yh e gửi a user và pass a vào xem giúp e được k ạ?

HTT.itvn
10-03-2012, 09:52 PM
Anh có thể cho e Yh e gửi a user và pass a vào xem giúp e được k ạ?

Anh vừa gửi qua tin nhắn rồi đấy.

jamesblackvn
16-03-2012, 11:01 AM
<!--CUSTOM-->
{vb:raw ad_location.nnt_lm}




<link rel="stylesheet" type="text/css" href="http://dwebvn.com/forum/images/DWEBVN/css/HTT_tab.css" />
<link rel="stylesheet" type="text/css" href="http://dwebvn.com/forum/images/DWEBVN/css/HTT_dtab.css" />
<script type="text/javascript" src="http://dwebvn.com/forum/images/DWEBVN/js/HTT_tab.js"></script>


<div class="HTT_NTNonline_tab">
<ul id="HTT_dwebvn_1" class="shadetabs">
<li><a href="javascript://" rel="country1" class="selected">&nbsp;&nbsp;&nbsp;Tiêu đề 1&nbsp;&nbsp;&nbsp;</a></li>
<li><a href="javascript://" rel="country2">&nbsp;&nbsp;&nbsp;Tiêu đề 2&nbsp;&nbsp;&nbsp;</a></li>
<li><a href="javascript://" rel="country3">&nbsp;&nbsp;&nbsp;Tiêu đề 3&nbsp;&nbsp;&nbsp;</a></li>
<div class="HTT_tabTL"></div>
<div class="HTT_tabTR"></div>
</ul>
<div id="country1" class="tabcontent">
<!---Chèn hook template 1--->
{vb:raw ad_location.vietv2b_topx}
</div>
<div id="country2" class="tabcontent">
<!---Chèn hook template 2--->
{vb:raw changfcb}
</div>
<div id="country3" class="tabcontent">
<!---Chèn hook template 3--->
{vb:raw template_hook.news}
</div>
<script type="text/javascript">var countries=new ddtabcontent("HTT_dwebvn_1")countries.setpersist(true)countries.setselectedCl assTarget("link") //"link" or "linkparent"countries.init()</script>
</div>


<!--GOOGLE SEARCH -->
<div id="cse" style="width: 100%;">Loading</div>
<script src="//www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'vi', style : google.loader.themes.GREENSKY});
google.setOnLoadCallback(function() {
var customSearchControl = new google.search.CustomSearchControl('006343579908594 631194:us8ofydjjak');
customSearchControl.setResultSetSize(google.search .Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
customSearchControl.draw('cse', options);
}, true);
</script>
<!--GOOGLE SEARCH -->
<!--CUSTOM-->


Lỗi ko click dc qua tab mới và ko hiển thị nội dung luôn

nhocmt
25-03-2012, 10:18 PM
mình lại đang mắc vấn đề ngược lại đó là hiện tại nó là 3 tab trong 1 rồi. bây giờ mình muốn nó trải ra và hiển thị 3 mod luôn thì phải là thế nào đc . giúp mình với HTT.itvn ơi

nhocmt
26-03-2012, 11:24 PM
không ai giúp tui à :((

HTT.itvn
27-03-2012, 08:15 AM
không ai giúp tui à :((

Trong code này :


<div id="country1" class="tabcontent">
<!---Chèn hook template 1--->
{vb:raw ad_location.vietv2b_topx}
</div>
<div id="country2" class="tabcontent">
<!---Chèn hook template 2--->
{vb:raw changfcb}
</div>
<div id="country3" class="tabcontent">
<!---Chèn hook template 3--->
{vb:raw template_hook.news}
</div>

Ở mỗi khung em chèn 1 hay nhiều hook tùy ý , ví dụ :





<div id="country1" class="tabcontent">
<!---Chèn hook template 1--->
<!---Chèn hook template 2--->
<!---Chèn hook template 3--->
{vb:raw ad_location.vietv2b_topx}
</div>

nhocmt
27-03-2012, 09:22 AM
{vb:raw header}

{vb:raw navbar}

<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="country1" class="selected">Thống kê</a></li>
<li><a href="#" rel="country2">Chatbox</a></li>
<li><a href="#" rel="country3">Quà tặng âm nhạc</a></li>
</ul>



<div id="country1" class="tabcontent">
{vb:raw changstats}
</div>

<div id="country2" class="tabcontent">
{vb:raw show.vbshout_instance1}
</div>

<div id="country3" class="tabcontent">

{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>


của em nó thế này thì phải sửa lại thế nào ạ ????

nhocmt
31-03-2012, 04:21 PM
:(( của em nó thế này thì phải sửa lại thế nào ạ ????

crazytimes
04-04-2012, 05:39 PM
haizz! tình hình là vẫn làm ko đc. Nó chỉ hiện ra 3 cái tab, ko lick chuyển qua lại giữa các tab dc, chèn các hook template vào ko hiện được.

Mong AE nhiệt tình xem lại giúp ae với ...

crazytimes
16-04-2012, 05:32 PM
up cho admin thấy :D

HTT.itvn
17-04-2012, 10:08 PM
Bạn thay thế code :


<script type="text/javascript">var countries=new ddtabcontent("HTT_dwebvn_1")countries.setpersist(t rue)countries.setselectedClassTarget("link") //"link" or "linkparent"countries.init()</script>

Bằng code sau :


<script type="text/javascript">var countries=new ddtabcontent("HTT_dwebvn_1")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()
</script>