Tổng hợp những thủ thuật chỉnh sửa style mặc định cho VBB4.1.x

10- Xóa chữ usergroup ( dưới nick thành viên )

10- Xóa chữ usergroup ( dưới nick thành viên ) ( Hỏi bởi : zkenji )

http://itvnn.net/attachment.php?atta...7&d=1312378681

Vào AdminCP >> Styles & Templates >> Style manager >> Chọn style >> Edit Templates >> Postbit Templates >> postbit_legacy , tìm code sau :

Trích:

<span class="usertitle"> {vb:raw post.usertitle}
</span>

Xóa đi hoặc sửa thành :

Trích:



Link Topic : http://itvnn.net/showthread.php?3295...ght=#post66096

11- Tạo Ranks tự động

11- Tạo Ranks tự động ( hỏi bởi VNSAF )

1- Usertitle với Username khác nhau , không hoàn toàn phụ thuộc vào nhau . Usertitle là danh hiệu của thành viên . Thành viên có thể tùy chỉnh ở khung thông tin cá nhân có thể tích vào ô " không dùng " trong phần danh hiệu cá nhân . Username là tên tài khoản đăng nhập , màu sắc thay đổi phụ thuộc vào Usergroup .
2- User Ranks và Usertitle cũng không phụ thuộc vào nhau , Ranks thay đổi khi thành viên thuộc nhóm Usergroup nào đó hoặc đủ điều kiện tự động thay đổi ranks .
3- Usergroup thì không thể tự động lên nhóm mới khi viết đủ bài viết theo yêu cầu mà phải do nhóm admin set lên . User group không có ý nghĩa hiển thị ở user ranks .

Từ câu hỏi của cậu , tớ nghĩ rằng :

1. Rank có thể tự động thay đổi , nhưng thành viên lên nhóm quản trị cao hơn không tự động mà phải do nhóm admin set lên . Hình ảnh rank không nói lên thành viên thuộc nhóm nào mà nó chỉ là biểu tượng hình ảnh thể hiện khi thành viên thỏa điều kiện tối thiểu nào đó . Rank có biểu tượng admin không có nghĩa là thành viên đó thuộc nhóm admin . Tớ giải thích cụ thể phần tạo user Ranks nhé :

- Number of times to repeat rank: Là số lần hiển thị ranks .
- Usergroup : nhóm cần hiển thị rank này . Nghĩa là nếu thành viên thuộc nhóm MOD , khi không có điều kiện thì khi thành viên lên nhóm MOD sẽ tự động có rank , còn nếu có điều kiện thì thành viên lên nhóm MOD phải thỏa mãn điều kiện như đủ 100 bài viết thì mới xuất hiện rank .
- Minimum Posts : Điều kiện bài viết tối thiểu để hiển thị rank trong nhóm thiết lập . Đến đây các bạn tự đặt câu hỏi cho mình nhé : " Tại sao nhiều forum cài rank cho nhóm khác nhau đều để ô này là 0 ( như ITNN ) mà khi thành viên đăng ký không được lên rank admin luôn ? Họ vẫn thỏa mãn mà ." Câu trả lời các bạn đọc ở trên sẽ hiểu .

2. Câu thứ 2 của cậu không thành viên nào được tự động set lên nhóm mà do ai đó set thành viên đó lên nhóm mới .

Cách tạo rank tự động thay đổi khi thỏa mãn điều kiện bài viết tối thiểu :

Là tạo nhiều rank trong 1 nhóm nào đó .

- Vào AdminCP >> User Ranks >> Add New User Rank ( ở đây tạo các ranks cho nhóm thành viên và rank thể hiện là các ngôi sao ) :+ Number of times to repeat rank: điền 1 ( hiển thị 1 lần )
+ Usergroup : Chọn nhóm thành viên
+ Minimum Posts : chọn 0 ( thành viên mới đăng ký )
+ Display Type : If displaygroup = This group
+ User Rank File Path : Chọn rank là hình 1 ngôi sao

Save lại

- Tiếp tục tạo rank thứ 2 cho nhóm thành viên >> Tương tự như trên và thay đổi 2 mục :
+ Minimum Posts : chọn 100 ( hoặc tùy các bạn chọn )
+ User Rank File Path : Chọn rank là hình 2 ngôi sao

Save lại .

Tương tự khi tạo các rank khác cho nhóm thành viên . Và cũng tượng tự khi tạo các ranks cho nhóm khác .

Sao khi thiết lập xong các bạn cập nhập lại >> update user titles and ranks >> update user titles and ranks . Vào forum sẽ thấy thành quả .

Link topic : http://itvnn.net/showthread.php?3404...ll=1#post69786

Kéo dài thanh Forumhead

12 - Kéo dài thanh Forumhead ( t-cat ) ( hỏi bởi : babylovevt )

http://itvnn.net/attachment.php?atta...6&d=1313379278

Do bản forum không có forumhead_width như bản suite nên dùng style của bản suite sang forum của VBB415 là lỗi .

Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn style >> Edit Templates >> CSS Templates >> forumbits.css , tìm code sau :

Trích:

.forumhead { background: {vb:stylevar forumhead_background};
_background-image: none;
padding: 0;
font:{vb:stylevar forumhead_font};
color:{vb:stylevar forumhead_color};
clear:both;
margin-top: 8px;
float: {vb:stylevar left};
border: {vb:stylevar forumhead_border};
width: {vb:stylevar forumhead_width};
-moz-border-radius-top{vb:stylevar right}: {vb:stylevar forumhead_top_corner_radius};
-moz-border-radius-top{vb:stylevar left}: {vb:stylevar forumhead_top_corner_radius};
-webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar forumhead_top_corner_radius};
-webkit-border-top-{vb:stylevar left}-radius: {vb:stylevar forumhead_top_corner_radius};
border-top-{vb:stylevar right}-radius: {vb:stylevar forumhead_top_corner_radius};
border-top-{vb:stylevar left}-radius: {vb:stylevar forumhead_top_corner_radius};
}

Chỉnh in đậm thành 100% ;

Tiếp tục vào additional.css , tìm code sau :

Trích:

.tcat { background:url(images/styles/Movara/style/tcatBG.gif) repeat-x top left;
color: #343b42;
height:47px;
clear:both;
margin-top: 8px;
float: {vb:stylevar left};
border:0;
width: {vb:stylevar forumhead_width};
}

Thay chữ đỏ đậm thành 100% .

Tiếp tục tìm code sau :

Trích:

.thead_bar .theadrow { background:#fff url(images/styles/Movara/style/theadBG.gif) repeat-x bottom left;
display:block;
width: {vb:stylevar forumhead_width};
float: {vb:stylevar left};
position:relative;
line-height:34px;
font-size:11px;
border: 1px solid #fff;
color:#9e9e9e;
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px !important;
}

Chỉnh thành 100% . OK vậy là xong .

Nếu cách trên không được thì dùng cách của PhucSD nhé :

Trích:

.tcatBar {
background:url(images/styles/AnimatedArena/style/tcatBG.gif) repeat-x top left;
color: #837e6e;
height:40px;
clear:both;
margin-top: 8px;
float: {vb:stylevar left};
border:0;
padding:0;
width: {vb:stylevar forumhead_width};

Xóa dóng màu đỏ .

Chú ý : Tùy vào mỗi style thì có chữ đỏ đậm khác nhau không giống như demo trên , có thể 1 trong 3 đoạn code CSS trên đã được chỉnh về 100% như mặc định . Chắc chắn sẽ có 1 đoạn code CSS như demo trên nếu style có lỗi trên , các bạn tùy chỉnh như hướng dẫn trên là được .

Link topic : http://itvnn.net/showthread.php?3361...ll=1#post67973

Cái tăng chiều cao của forumhead anh chỉ đề cập đến skin của Completevb vậy còn style default thì sao anh ?

Trích:

Nguyên văn bởi PhucSD

Cái tăng chiều cao của forumhead anh chỉ đề cập đến skin của Completevb vậy còn style default thì sao anh ?

Trích:

.forumhead { background: {vb:stylevar forumhead_background};
_background-image: none;
padding: 0;
font:{vb:stylevar forumhead_font};
color:{vb:stylevar forumhead_color};
clear:both;
margin-top: 8px;
height:30px;
line-height:30px;
float: {vb:stylevar left};
border: {vb:stylevar forumhead_border};
width: {vb:stylevar forumhead_width};
-moz-border-radius-top{vb:stylevar right}: {vb:stylevar forumhead_top_corner_radius};
-moz-border-radius-top{vb:stylevar left}: {vb:stylevar forumhead_top_corner_radius};
-webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar forumhead_top_corner_radius};
-webkit-border-top-{vb:stylevar left}-radius: {vb:stylevar forumhead_top_corner_radius};
border-top-{vb:stylevar right}-radius: {vb:stylevar forumhead_top_corner_radius};
border-top-{vb:stylevar left}-radius: {vb:stylevar forumhead_top_corner_radius};
}

Em thêm dòng màu tím và tùy chỉnh kích thước rộng tùy là được .

13 - Thay đổi khung bình chọn

^{13 - Thay đổi khung bình chọn} ( hỏi bởi : romeoangle )

Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn Style >> StyleVars , tìm các vars sau :

- Nền bình chọn : poll_background
- Nền màu của mỗi pollbar : pollbar1_background , pollbar2_background , pollbar3_background , pollbar4_background , pollbar5_background , pollbar6_background
- Viền cho pollbar : pollbar_border
- Độ cao của pollbar : pollbar_height
- Độ dài của pollbar : pollbars_result_bit_width

Tiếp theo là thay màu chữ của poll

Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn Style >> Edit Templates >> CSS Templates >> poll.css , tìm code sau :

Trích:

#pollinfo { padding-bottom:0;
margin: {vb:stylevar padding} {vb:math {vb:stylevar padding}*5} 0;
-moz-border-radius: {vb:math {vb:stylevar padding}/2};
-webkit-border-radius: {vb:math {vb:stylevar padding}/2};
border-radius: {vb:math {vb:stylevar padding}/2};
clear:both;
border: {vb:stylevar postbit_border};
padding-{vb:stylevar right}: {vb:stylevar padding};
}

Thêm màu như in đậm :

Trích:

#pollinfo { padding-bottom:0;
margin: {vb:stylevar padding} {vb:math {vb:stylevar padding}*5} 0;
-moz-border-radius: {vb:math {vb:stylevar padding}/2};
-webkit-border-radius: {vb:math {vb:stylevar padding}/2};
border-radius: {vb:math {vb:stylevar padding}/2};
clear:both;
border: {vb:stylevar postbit_border};
padding-{vb:stylevar right}: {vb:stylevar padding};
color:#a0a0a0;
}

Như vậy đã thay đổi màu tiêu đề của mỗi poll và tỷ lệ % . Tiếp tục tìm từng code sau :

- Tiêu đề bình chọn :

Trích:

#pollinfo .blockhead h2 { font-weight: normal;
font-size: {vb:math {vb:stylevar font.fontSize}*1.5}px;
display: inline-block;
float: {vb:stylevar left};
color: {vb:stylevar diffremove_color};

- DÒng thông báo bạn đã bình chọn :

Trích:

#pollinfo .blockhead .stats { float: {vb:stylevar right};
color: {vb:stylevar body_color};
}

- Vorter

Trích:

#pollinfo .blockhead .totalvotes { color:{vb:stylevar body_color};
font-size: {vb:stylevar font.fontSize}px;
display: inline-block;
margin-top: {vb:math {vb:math {vb:stylevar font.fontSize}*1.5}-{vb:stylevar font.fontSize}}px;
font-weight:bold;
}

- Nội dung bình chọn :

Trích:

#pollinfo .polltitle { color: {vb:stylevar body_color};
}

- Số phiếu bình chọn :

Trích:

#pollresults li .votes .numvotes { color:body_color; /*** Không hiểu sao ở đây lại thế này , đáng ra phải là {vb:stylevar body_color}; Nếu bạn chỉnh theo vars thì thay dòng body_color thành {vb:stylevar body_color} nhé ***/ padding:{vb:math {vb:stylevar pollbars_margin_size}/5} {vb:stylevar pollbars_margin_size};

display: block;
margin-{vb:stylevar left}: {vb:stylevar pollbars_margin_size};
float: {vb:stylevar left};
clear: {vb:stylevar right};
}

Thay đổi dòng màu xanh đậm thành mã màu tùy ý .

Nếu ngại làm thì có thể chỉnh màu ở vars sau :

- body_color
- diffremove_color

Tuy nhiên chỉnh ở Vars thì sẽ không linh động .

Link Topic : http://itvnn.net/showthread.php?3469...ll=1#post70507

Chú ý : Code trên được lấy từ style mặc định , tùy vào style mà bạn dùng có thể code trên khác một chút .

14 - Chuyển khung đăng nhập ở header xuống navbar ( Hỏi bởi Hải Minh )

Anh hướng dẫn qua style mặc định nhé .

1. Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn Style >> Edit Templates >> header , tìm code sau :

Code:

<div id="toplinks" class="toplinks"> <vb:if condition="$show['member']"> <ul class="isuser"> <li><a href="login.php?{vb:raw session.sessionurl}do=logout&logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a></li> <vb:if condition="$show['registerbutton']"> <li><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li> </vb:if> <li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase user_control_panel}</a></li> <li><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li> <vb:if condition="$notifications_total"> <li class="popupmenu notifications" id="notifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}: <span class="notifications-number"><strong>{vb:raw notifications_total}</strong></span></a> <ul class="popupbody popuphover"> {vb:raw notifications_menubits} </ul> </li> <vb:else /> <li class="popupmenu nonotifications" id="nonotifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}</a> <ul class="popupbody popuphover"> <li>{vb:rawphrase no_new_messages}</li> <vb:if condition="$show['pmmainlink']"><li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li></vb:if> </ul> </li> </vb:if> <li class="welcomelink">{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}</li> <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> {vb:raw template_hook.header_userinfo} <vb:comment><p>{vb:rawphrase last_visited_x_at_y, {vb:raw pmbox.lastvisitdate}, {vb:raw pmbox.lastvisittime}}</p></vb:comment> <vb:else /> <ul class="nouser"> <vb:if condition="$show['registerbutton']"> <li><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li> </vb:if> <li><a rel="help" href="faq.php{vb:raw session.sessionurl_q}">{vb:rawphrase help}</a></li> <li> <script type="text/javascript" src="clientscript/vbulletin_md5.js?v={vb:raw vboptions.simpleversion}"></script> <form id="navbar_loginform" action="login.php?{vb:raw session.sessionurl}do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})"> <fieldset id="logindetails" class="logindetails"> <div> <div> <input type="text" class="textbox<vb:if condition="!$username"> default-value</vb:if>" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>" /> <input type="password" class="textbox" tabindex="102" name="vb_login_password" id="navbar_password" size="10" /> <input type="text" class="textbox default-value" tabindex="102" name="vb_login_password_hint" id="navbar_password_hint" size="10" value="{vb:rawphrase password}" style="display:none;" /> <input type="submit" class="loginbutton" tabindex="104" value="{vb:rawphrase log_in}" title="{vb:rawphrase enter_username_to_login_or_register}" accesskey="s" /> </div> </div> </fieldset> <div id="remember" class="remember"> <label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" id="cb_cookieuser_navbar" class="cb_cookieuser_navbar" accesskey="c" tabindex="103" /> {vb:rawphrase remember_me}</label> </div> <input type="hidden" name="s" value="{vb:raw session.sessionhash}" /> <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" /> <input type="hidden" name="do" value="login" /> <input type="hidden" name="vb_login_md5password" /> <input type="hidden" name="vb_login_md5password_utf" /> </form> <script type="text/javascript"> YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); vB_XHTML_Ready.subscribe(function() { // YAHOO.util.Event.on('navbar_username', "focus", navbar_username_focus); YAHOO.util.Event.on('navbar_username', "blur", navbar_username_blur); YAHOO.util.Event.on('navbar_password_hint', "focus", navbar_password_hint); YAHOO.util.Event.on('navbar_password', "blur", navbar_password); }); function navbar_username_focus(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>') { // textbox.value=''; textbox.style.color='{vb:stylevar toplinks_form_input.color}'; } } function navbar_username_blur(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { // textbox.value='<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>'; textbox.style.color='{vb:stylevar toplinks_form_input_defaultValue.color}'; } } function navbar_password_hint(e) { // var textbox = YAHOO.util.Event.getTarget(e); YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "none"); YAHOO.util.Dom.setStyle('navbar_password', "display", "inline"); YAHOO.util.Dom.get('navbar_password').focus(); } function navbar_password(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); } } </script> </li> <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> </vb:if> </div>

Xóa nó đi hoặc thêm dấu  ở cuối đoạn code trên để vô hiệu hóa nó .

2. Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn Style >> Edit Templates >> Navigation / Breadcrumb Templates >> Navbar , tìm code sau :

Trích:

<div id="breadcrumb" class="breadcrumb"> <ul class="floatcontainer">
<li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li>
{vb:raw navbits.breadcrumb}
{vb:raw navbits.lastelement}
</ul>
<hr />
</div>

Thay thế thành :

Code:

<div id="breadcrumb" class="breadcrumb"> <ul class="floatcontainer"> <table width="100%" align="center" border="0"> <tr> <td> <li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li> {vb:raw navbits.breadcrumb} {vb:raw navbits.lastelement} </td> <td width="20%" style="padding:6px;border:1px solid #dddddd;">  <vb:if condition="$show['member']"> <ul class="isuser">  <li style="border-bottom:1px dotted #dddddd;" class="welcomelink">{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}</li> <vb:if condition="$show['registerbutton']">  <li style="border-bottom:1px dotted #dddddd;" ><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li> </vb:if>  <li style="border-bottom:1px dotted #dddddd;" ><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase user_control_panel}</a></li>  <li style="border-bottom:1px dotted #dddddd;" ><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li> <vb:if condition="$notifications_total">  <li style="border-bottom:1px dotted #dddddd;" class="popupmenu notifications" id="notifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}: <span class="notifications-number"><strong>{vb:raw notifications_total}</strong></span></a> <ul class="popupbody popuphover"> {vb:raw notifications_menubits} </ul> </li> <vb:else />  <li style="border-bottom:1px dotted #dddddd;" class="popupmenu nonotifications" id="nonotifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}</a> <ul class="popupbody popuphover"> <li>{vb:rawphrase no_new_messages}</li> <vb:if condition="$show['pmmainlink']"><li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li></vb:if> </ul> </li> </vb:if>  <a href="login.php?{vb:raw session.sessionurl}do=logout&logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a>  <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> {vb:raw template_hook.header_userinfo} <vb:comment><p>{vb:rawphrase last_visited_x_at_y, {vb:raw pmbox.lastvisitdate}, {vb:raw pmbox.lastvisittime}}</p></vb:comment> <vb:else />  <ul class="nouser"> <script type="text/javascript" src="clientscript/vbulletin_md5.js?v={vb:raw vboptions.simpleversion}"></script> <form id="navbar_loginform" action="login.php?{vb:raw session.sessionurl}do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})"> <fieldset id="logindetails" class="logindetails"> <div> <div>  <input style="width:60%;height:16px;margin-bottom:6px;border:1px solid green;" type="text" class="textbox<vb:if condition="!$username"> default-value</vb:if>" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>" />  <label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" id="cb_cookieuser_navbar" class="cb_cookieuser_navbar" accesskey="c" tabindex="103" /> {vb:rawphrase remember_me}</label><br>  <input style="width:60%;height:16px;border:1px solid green;" type="password" class="textbox" tabindex="102" name="vb_login_password" id="navbar_password" size="10" />  <input style="width:60%;height:16px;border:1px solid green;" type="text" class="textbox default-value" tabindex="102" name="vb_login_password_hint" id="navbar_password_hint" size="10" value="{vb:rawphrase password}" style="display:none;" />  <input style="height:24px;width:30%;background:gray;color:#ffffff;border:0px;" type="submit" class="loginbutton" tabindex="104" value="{vb:rawphrase log_in}" title="{vb:rawphrase enter_username_to_login_or_register}" accesskey="s" /> <vb:if condition="$show['registerbutton']"> <div style="margin-top:6px;">  <a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a> |  <a rel="help" href="faq.php{vb:raw session.sessionurl_q}">{vb:rawphrase help}</a> </div> </vb:if> </div> </div> </fieldset> <input type="hidden" name="s" value="{vb:raw session.sessionhash}" /> <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" /> <input type="hidden" name="do" value="login" /> <input type="hidden" name="vb_login_md5password" /> <input type="hidden" name="vb_login_md5password_utf" /> </form> <script type="text/javascript"> YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); vB_XHTML_Ready.subscribe(function() { // YAHOO.util.Event.on('navbar_username', "focus", navbar_username_focus); YAHOO.util.Event.on('navbar_username', "blur", navbar_username_blur); YAHOO.util.Event.on('navbar_password_hint', "focus", navbar_password_hint); YAHOO.util.Event.on('navbar_password', "blur", navbar_password); }); function navbar_username_focus(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>') { // textbox.value=''; textbox.style.color='{vb:stylevar toplinks_form_input.color}'; } } function navbar_username_blur(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { // textbox.value='<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>'; textbox.style.color='{vb:stylevar toplinks_form_input_defaultValue.color}'; } } function navbar_password_hint(e) { // var textbox = YAHOO.util.Event.getTarget(e); YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "none"); YAHOO.util.Dom.setStyle('navbar_password', "display", "inline"); YAHOO.util.Dom.get('navbar_password').focus(); } function navbar_password(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); } } </script> </li> <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> </vb:if> </td> </tr> </table> </ul> <hr /> </div>

Save lại . Để phù hợp với Giao diện 4rum của em thì em phải linh động trong code trên nhé , anh có chú thích từng phần 1 cho em rồi .

Như vậy toàn bộ Header như sau :

Code:

<div class="above_body"> <div id="header" class="floatcontainer doc_header"> <vb:if condition="$stylevar['titleimage']"><div><a name="top" href="{vb:link forumhome}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></div></vb:if>  <div class="ad_global_header"> {vb:raw ad_location.global_header1} {vb:raw ad_location.global_header2} </div> <hr /> </div>

Toàn bộ Navbar như sau :

Code:

<div id="navbar" class="navbar"> <ul id="navtabs" class="navtabs floatcontainer<vb:if condition="$show['member'] AND $notifications_total"> notify</vb:if>"> {vb:raw template_hook.navtab_start} <vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT != 'search'"> <li class="selected"><a class="navtab" href="{vb:link forumhome}">{vb:rawphrase forum}</a> <ul class="floatcontainer"> {vb:raw template_hook.navbar_start} <vb:if condition="$show['searchbuttons']"> <vb:if condition="$show['member']"> <li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post">{vb:rawphrase new_posts_nav}</a></li> <vb:else /> <li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li> </vb:if> </vb:if> {vb:raw template_hook.navbar_after_getnew} <vb:if condition="$show['pmmainlink']"> <li><a href="private.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase private_messages}</a></li> </vb:if> {vb:raw template_hook.navbar_after_pm} <li><a rel="help" href="faq.php{vb:raw session.sessionurl_q}" accesskey="5">{vb:rawphrase faq}</a></li> {vb:raw template_hook.navbar_after_faq} <vb:if condition="$show['canviewcalendar']"> <li><a href="calendar.php{vb:raw session.sessionurl_q}">{vb:rawphrase calendar}</a></li> </vb:if> {vb:raw template_hook.navbar_after_calendar} <vb:if condition="$show['communitylink']"> <li class="popupmenu"> <a href="javascript://" class="popupctrl" accesskey="6">{vb:rawphrase community}</a> <ul class="popupbody popuphover"> {vb:raw template_hook.navbar_community_menu_start} <vb:if condition="$show['quick_links_groups']"> <li><a href="{vb:link grouphome}">{vb:rawphrase social_groups}</a></li> </vb:if> <vb:if condition="$show['quick_links_albums']"> <li><a href="album.php{vb:raw session.sessionurl_q}">{vb:rawphrase pictures_and_albums}</a></li> </vb:if> <vb:if condition="$bbuserinfo['userid']"> <li><a href="profile.php?{vb:raw session.sessionurl}do=buddylist"><vb:if condition="$show['friends_and_contacts']">{vb:rawphrase contacts_and_friends}<vb:else />{vb:rawphrase contacts}</vb:if></a></li> </vb:if> <vb:if condition="$show['memberslist']"> <li><a href="memberlist.php{vb:raw session.sessionurl_q}">{vb:rawphrase members_list}</a></li> </vb:if> {vb:raw template_hook.navbar_community_menu_end} </ul> </li> </vb:if> {vb:raw template_hook.navbar_after_community} <vb:if condition="$show['canviewforums']"> <li class="popupmenu"> <a href="javascript://" class="popupctrl">{vb:rawphrase forum_actions}</a> <ul class="popupbody popuphover"> <li> <a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a> </li> <vb:if condition="$show['member']"> <li> <a href="profile.php?{vb:raw session.sessionurl}do=editoptions">{vb:rawphrase edit_options}</a> </li> <li> <a href="profile.php?{vb:raw session.sessionurl}do=editprofile">{vb:rawphrase edit_your_details}</a> </li> </vb:if> </ul> </li> </vb:if> <li class="popupmenu"> <a href="javascript://" class="popupctrl" accesskey="3">{vb:rawphrase quick_links}</a> <ul class="popupbody popuphover"> <vb:if condition="$show['member']"> <li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li> <li><a href="{vb:link subscription}" rel="nofollow">{vb:rawphrase subscribed_threads}</a></li> <li><a href="javascript://" onclick="window.open(getBaseUrl() + 'misc.php?{vb:raw session.sessionurl}do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">{vb:rawphrase open_contacts}</a></li> </vb:if> <vb:if condition="$vboptions['forumleaders']"> <li><a href="showgroups.php{vb:raw session.sessionurl_q}" rel="nofollow"> <vb:if condition="$vb_suite_installed"> {vb:rawphrase view_site_leaders} <vb:else /> {vb:rawphrase view_forum_leaders} </vb:if> </a></li> </vb:if> {vb:raw template_hook.navbar_quick_links_menu_pos1} {vb:raw template_hook.navbar_quick_links_menu_pos2} {vb:raw template_hook.navbar_quick_links_menu_pos3} <vb:if condition="$show['wollink']"> <li><a href="online.php{vb:raw session.sessionurl_q}">{vb:rawphrase whos_online}</a></li> </vb:if> {vb:raw template_hook.navbar_quick_links_menu_pos4} </ul> </li> {vb:raw template_hook.navbar_end} </ul> </li> <vb:else /> <li><a class="navtab" href="{vb:link forumhome}">{vb:rawphrase forum}</a></li> </vb:if> {vb:raw template_hook.navtab_middle} <vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT == 'search'"> <vb:if condition="$show['member']"> <li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a> <ul class="floatcontainer"> <li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post">{vb:rawphrase new_posts_nav}</a></li> <li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_SocialGroupMessage">{vb:rawphrase new_group_messages_nav}</a></li> <li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Event">{vb:rawphrase new_events_nav}</a></li> {vb:raw template_hook.navbar_getnew_menu} <li><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a></li> </ul> </li> <vb:else /> <li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a> <ul class="floatcontainer"> <li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li> <li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_SocialGroupMessage">{vb:rawphrase daily_group_message}</a></li> <li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Event">{vb:rawphrase daily_events}</a></li> {vb:raw template_hook.navbar_getdaily_menu} <li><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a></li> </ul> </li> </vb:if> <vb:elseif condition="$show['member']" /> <li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li> <vb:else /> <li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li> </vb:if> {vb:raw template_hook.navtab_end} </ul> <vb:if condition="$vboptions['enablesearches']"> <div id="globalsearch" class="globalsearch"> <form action="search.php?{vb:raw session.sessionurl}do=process" method="post" id="navbar_search" class="navbar_search"> <vb:comment><input type="hidden" name="s" value="{vb:raw session.sessionurl}" /></vb:comment> <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" /> <input type="hidden" name="do" value="process" /> <span class="textboxcontainer"><span><input type="text" value="" name="query" class="textbox" tabindex="99"/></span></span> <span class="buttoncontainer"><span><input type="image" class="searchbutton" src="{vb:stylevar imgdir_button}/search<vb:if condition="$stylevar['textdirection'] == 'rtl'">_rtl</vb:if>.<vb:if condition="is_browser('ie') AND !is_browser('ie', 7)">gif<vb:else />png</vb:if>" name="submit" onclick="document.getElementById('navbar_search').submit;" tabindex="100"/></span></span> </form> <ul class="navbar_advanced_search"> <li><a href="search.php{vb:raw session.sessionurl_q}" accesskey="4">{vb:rawphrase advanced_search}</a></li> </ul> </div> </vb:if> </div> </div> <div class="body_wrapper"> <div id="breadcrumb" class="breadcrumb"> <ul class="floatcontainer"> <table width="100%" align="center" border="0"> <tr> <td> <li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li> {vb:raw navbits.breadcrumb} {vb:raw navbits.lastelement} </td> <td width="20%" style="padding:6px;border:1px solid #dddddd;">  <vb:if condition="$show['member']"> <ul class="isuser">  <li style="border-bottom:1px dotted #dddddd;" class="welcomelink">{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}</li> <vb:if condition="$show['registerbutton']">  <li style="border-bottom:1px dotted #dddddd;" ><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li> </vb:if>  <li style="border-bottom:1px dotted #dddddd;" ><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase user_control_panel}</a></li>  <li style="border-bottom:1px dotted #dddddd;" ><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li> <vb:if condition="$notifications_total">  <li style="border-bottom:1px dotted #dddddd;" class="popupmenu notifications" id="notifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}: <span class="notifications-number"><strong>{vb:raw notifications_total}</strong></span></a> <ul class="popupbody popuphover"> {vb:raw notifications_menubits} </ul> </li> <vb:else />  <li style="border-bottom:1px dotted #dddddd;" class="popupmenu nonotifications" id="nonotifications"> <a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}</a> <ul class="popupbody popuphover"> <li>{vb:rawphrase no_new_messages}</li> <vb:if condition="$show['pmmainlink']"><li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li></vb:if> </ul> </li> </vb:if>  <a href="login.php?{vb:raw session.sessionurl}do=logout&logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a>  <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> {vb:raw template_hook.header_userinfo} <vb:comment><p>{vb:rawphrase last_visited_x_at_y, {vb:raw pmbox.lastvisitdate}, {vb:raw pmbox.lastvisittime}}</p></vb:comment> <vb:else />  <ul class="nouser"> <script type="text/javascript" src="clientscript/vbulletin_md5.js?v={vb:raw vboptions.simpleversion}"></script> <form id="navbar_loginform" action="login.php?{vb:raw session.sessionurl}do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})"> <fieldset id="logindetails" class="logindetails"> <div> <div>  <input style="width:60%;height:16px;margin-bottom:6px;border:1px solid green;" type="text" class="textbox<vb:if condition="!$username"> default-value</vb:if>" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>" />  <label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" id="cb_cookieuser_navbar" class="cb_cookieuser_navbar" accesskey="c" tabindex="103" /> {vb:rawphrase remember_me}</label><br>  <input style="width:60%;height:16px;border:1px solid green;" type="password" class="textbox" tabindex="102" name="vb_login_password" id="navbar_password" size="10" />  <input style="width:60%;height:16px;border:1px solid green;" type="text" class="textbox default-value" tabindex="102" name="vb_login_password_hint" id="navbar_password_hint" size="10" value="{vb:rawphrase password}" style="display:none;" />  <input style="height:24px;width:30%;background:gray;color:#ffffff;border:0px;" type="submit" class="loginbutton" tabindex="104" value="{vb:rawphrase log_in}" title="{vb:rawphrase enter_username_to_login_or_register}" accesskey="s" /> <vb:if condition="$show['registerbutton']"> <div style="margin-top:6px;">  <a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a> |  <a rel="help" href="faq.php{vb:raw session.sessionurl_q}">{vb:rawphrase help}</a> </div> </vb:if> </div> </div> </fieldset> <input type="hidden" name="s" value="{vb:raw session.sessionhash}" /> <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" /> <input type="hidden" name="do" value="login" /> <input type="hidden" name="vb_login_md5password" /> <input type="hidden" name="vb_login_md5password_utf" /> </form> <script type="text/javascript"> YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); vB_XHTML_Ready.subscribe(function() { // YAHOO.util.Event.on('navbar_username', "focus", navbar_username_focus); YAHOO.util.Event.on('navbar_username', "blur", navbar_username_blur); YAHOO.util.Event.on('navbar_password_hint', "focus", navbar_password_hint); YAHOO.util.Event.on('navbar_password', "blur", navbar_password); }); function navbar_username_focus(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>') { // textbox.value=''; textbox.style.color='{vb:stylevar toplinks_form_input.color}'; } } function navbar_username_blur(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { // textbox.value='<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>'; textbox.style.color='{vb:stylevar toplinks_form_input_defaultValue.color}'; } } function navbar_password_hint(e) { // var textbox = YAHOO.util.Event.getTarget(e); YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "none"); YAHOO.util.Dom.setStyle('navbar_password', "display", "inline"); YAHOO.util.Dom.get('navbar_password').focus(); } function navbar_password(e) { // var textbox = YAHOO.util.Event.getTarget(e); if (textbox.value == '') { YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline"); YAHOO.util.Dom.setStyle('navbar_password', "display", "none"); } } </script> </li> <vb:if condition="$vboptions['enablefacebookconnect']"> {vb:raw facebook_header} </vb:if> </ul> </vb:if> </td> </tr> </table> </ul> <hr /> </div> {vb:raw ad_location.ad_navbar_below} {vb:raw ad_location.global_below_navbar} <vb:if condition="$show['notices'] AND THIS_SCRIPT != 'register'"> <form action="profile.php?do=dismissnotice" method="post" id="notices" class="notices"> <input type="hidden" name="do" value="dismissnotice" /> <input type="hidden" name="s" value="{vb:raw session.sessionurl}" /> <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" /> <input type="hidden" id="dismiss_notice_hidden" name="dismiss_noticeid" value="" /> <input type="hidden" name="url" value="{vb:raw return_link}" /> <ol> {vb:raw notices} </ol> </form> </vb:if>

Chú ý : Demo code trên là style mặc định của VBB4.1.8 , tùy vào style của bạn đang dùng có một sự khác biệt .

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

Link topic : http://itvnn.net/showthread.php?4127...%ADu-)&p=80714

15 - Tăng chiều cao và rộng cho khung tìm kiếm mặc định ( Hởi bởi : nh0ckti )

Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn style >> Edit Templates >> Navigation / Breadcrumb Templates >> Navbar , tìm code sau :

Trích:

<span class="textboxcontainer"><span><input type="text" value="" name="query" class="textbox" tabindex="99" /></span></span>

Sửa thành :

Trích:

<span class="textboxcontainer"><span><input type="text" value="" name="query" class="textbox" tabindex="99" style="width:144px;height:25px;"/></span></span>

Chỉnh sửa in đậm màu đỏ cho phù hợp 4rum của bạn .

Link topic : http://itvnn.net/showthread.php?4128...-Gấp&p=80709