Hướng dẫn đóng khung thông tin chi tiết cho VBB 4.x

[HTT.itvn]

Mấy ngày qua nhiều thành viên thắc mắc về cách đóng khung từng thông tin ở mục thông tin , nay mình hướng dẫn chi tiết cho các bạn đóng khung từng thông tin cụ thể :

Bước 1 : vào Admin CP >> Styles & Templates >> Search in Templates >> ở mục Search for Text gõ posbit.css ( nhớ tick vào ô Đồng ý ở mục Tìm trong tựa đề >> Find >> Kick vào postbit.css >> Dán code sau vào cuối cùng :
(Bài viết của HTT.itvn )

/* eTiKeT Postbit_Legacy*/
.eti_postbit_merkezli {
padding-left: 4px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
background-color: #efefef;
border-top: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-left: 1px solid #c4c4c4;
border-bottom: 1px solid #c4c4c4;
margin-bottom: 4px;
text-align:center;
-moz-box-shadow: 0 2px 6px #b3b3b3;
-webkit-box-shadow: -1px 2px 2px #b3b3b3;
-moz-border-radius-bottom{vb:stylevar left}:6px;
-moz-border-radius-top{vb:stylevar right}:6px;
-webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar threadlisthead_top_corner_radius};
-webkit-border-bottom-{vb:stylevar left}-radius: {vb:stylevar threadlisthead_top_corner_radius};}

.eti_postbit {
padding-left: 4px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
background-color: #efefef;
border-top: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-left: 1px solid #c4c4c4;
border-bottom: 1px solid #c4c4c4;
margin-bottom: 4px;
-moz-box-shadow: 0 2px 6px #b3b3b3;
-webkit-box-shadow: -1px 2px 2px #b3b3b3;
-moz-border-radius-bottom{vb:stylevar left}:6px;
-moz-border-radius-top{vb:stylevar right}:6px;
-webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar threadlisthead_top_corner_radius};
-webkit-border-bottom-{vb:stylevar left}-radius: {vb:stylevar threadlisthead_top_corner_radius};
}

.itvnn_postbit {
text-align:center;
}

Save and Reload ( Bài viết của HTT.itvn)

Bước 2 : Đóng khung từng chi tiết .

- Đưa thông tin tên thành viên vào giữa
Demo : như diễn đàn này .
Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Postbit templates >> Postbit_legacy >> Tìm đoạn code sau :

<div class="username_container">
<vb:if condition="$post['userid']">

{vb:raw memberaction_dropdown}
{vb:raw post.onlinestatus}
<vb:else />
<span class="username guest">{vb:raw post.musername}</span>
</vb:if>
</div>

Thêm thẻ <div class="itvnn_postbit">......</div> như sau ( chú ý chữ màu đỏ ) .

<div class="username_container">
<vb:if condition="$post['userid']">
<div class="itvnn_postbit">
{vb:raw memberaction_dropdown}
{vb:raw post.onlinestatus}
<vb:else />
<span class="username guest">{vb:raw post.musername}</span>
</vb:if>
</div></div>

Save and reload ( Bài Viết của HTT.itvn)
Vào diễn đàn của bạn để xem kết quả .

- Màu nick :
Admin CP >> Usergroups >> Usergroup Manager >> Administrators . Kick vào Tiếp tục >> Mục Username HTML Markup , ở ô đầu tiên bạn gán thẻ <b><font color=red> ( chữ màu đỏ là bạn có thể thay đổi sang màu khác như : blue , green , gray ,...) , ở ô thứ 2 bạn gán thẻ kết thúc </font></b> . Các mục khác để nguyên . Kick vào Update .

Tương tự với Smod , mod và Member . ( Bài Viết của HTT.itvn)

- Gán biểu tượng hình ảnh cho admin , smod , mod và member .

Demo : Như diễn đàn này .
Đầu tiên tải file ảnh về tại đây và upload lên thư mục images/ranks/ trong host .
Admin CP >> User Ranks >> Add New User Ranks >> Mục Usergroup chọn Administrators , ở mục Minimum Posts để giá trị 0 và mục User Rank File Path gõ đường dẫn file ảnh là images/ranks/admin.gif >> Save . ( Bài Viết của HTT.itvn)
Tương tự với smod , mod và member .
Sau khi làm xong bạn phải vào User rank manager để kích hoạt , kick vào update user titles and ranks >> Ở mục đầu tiên kick vào update user titles and ranks lần nữa .
Nhấn F5 để xem thành quả .

P/s : Những thắc mắc - góp ý thì viết tại đây và kiên trì chờ trả lời , mình sẽ trả lời nhanh nếu có thể . Nhiều bạn mới hỏi có vài 3 phút rồi spam liên tục để gây chú ý . Không phải ai cũng online 24/24 .

[HTT.itvn]

- Khung Thank :

Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Post Thank You Hack Templates >> post_thanks_postbit_info >> Thay thế toàn bộ code sau :

<vb:if condition="$post['userid']">
<div class="eti_postbit"><dt>{vb:rawphrase post_thanks_thanks}</dt> <dd>{vb:raw post.post_thanks_user_amount_formatted}</dd></div>

<div class="eti_postbit"><vb:if condition="$post['post_thanks_thanked_times'] == 1">
<dd float: {vb:stylevar left};">{vb:rawphrase post_thanks_time_post}</dd>
<vb:elseif condition="$post['post_thanks_thanked_posts'] == 1" />
<dd float: {vb:stylevar left};">{vb:rawphrase post_thanks_times_post, {vb:raw post.post_thanks_thanked_times_formatted}}</dd>
<vb:else />
<dd float: {vb:stylevar left};">{vb:rawphrase post_thanks_times_posts, {vb:raw post.post_thanks_thanked_times_formatted}, {vb:raw post.post_thanks_thanked_posts_formatted}}</dd>
</vb:if></div>
</vb:if>

- Đưa ảnh Rank lên trên avatar :

Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Posbit Templates >> postbit_legacy : tìm đoạn code sau

<vb:if condition="$post['rank']">
<span class="rank">{vb:raw post.rank}</span>
</vb:if>

Di chuyển nó lên trên đoạn code sau ( nằm trên đoạn code đóng khung avatar ) :

{vb:raw template_hook.postbit_userinfo_left}
<vb:if condition="$show['reputation']">
<span class="postbit_reputation" id="repdisplay_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reputationdisplay}</span>
</vb:if>

- Đóng khung phần Ucash :
Vào AdminCP >> Styles & Templates >> Style Manager >> Chọn skin cần chỉnh , Edit Templates >> Postbit Templates >> postbit_ucash , đóng thẻ như sau :

<div class="eti_postbit"><vb:if condition="$show['ucash']">
<dt>{vb:rawphrase 'ucash_points'}</dt>
<dd>{vb:raw post.ucashdisplay}</dd>
</vb:if></div>

[vothien93]

vâng!em làm đc rồi!mới thay skin!àh cho em hỏi là tại sao mấy phần đóng khung cho mấy chi tiết sau lại mờ hơn khi cài skin z?làm sao để nó giống lun????

[HTT.itvn]

Là do thẻ đóng khung từng phần khác nhau nên nó khác nhau , trong phần thank và ucash ở trên , bạn chỉ cần thay <div class="eti_postbit"> thành <div class="post_field"> thì nó sẽ đồng bộ thôi .

Tương tự với phần đóng khung level .

[vothien93]

vâng ạ!àh cho em hỏi là sao đóng khung chư 4ky1 em làm được rồi nhưng sao bài cuối thì nó có màu nên toàn là vàng k ah!
demo: http://174.121.2.58/~vteenntt/showth...tt&p=13#post13
em dung mod này: http://www.vietvbb.vn/up/showthread.php?t=38937&page=3

[vothien93]

làm phiền mod thêm 1 lần nữa nhak!
Giúp emc hỉnh lại cái chữ ký cho nó thụt xuống dưới!nó nằm cao quá!Hướng dẫn em thay đổi giới hạn(chiều cao) của cái khung bài viết(chứa profile với bài viết, chữ ký)VÀ cái nữa là mã màu của nền bài viết là gì ạ???

[HTT.itvn]

làm phiền mod thêm 1 lần nữa nhak!
Giúp emc hỉnh lại cái chữ ký cho nó thụt xuống dưới!nó nằm cao quá!Hướng dẫn em thay đổi giới hạn(chiều cao) của cái khung bài viết(chứa profile với bài viết, chữ ký)VÀ cái nữa là mã màu của nền bài viết là gì ạ???

- Màu vàng là do bạn tích chọn bài viết đó .
- Chiều dài của khung bài viết là tùy thuộc vào chiều dài Profile và bài viết ( nếu bài viết dài hơn profile) , không nên tùy chỉnh nó .
- Khung chữ kí không nằm cuối là do bạn đóng khung bài viết ( do khung chữ kí nó nằm sau sát khung bài viết , nên bài viết dài hay ngắn khung bài viết thay dổi thì khung chữ kí dịch chuyển theo ) , bạn xóa mod đóng khung bài viết là chữ kí sẽ như bình thường thôi .
- Vào Google ngõ " Bảng mã màu thập lục phân " , sẽ có nhiều mac màu mà bạn lựa chọn phù hợp với forum của bạn .

[vothien93]

hướng dẫn em cái phần giới tình làm sao cho nó hiện bằng ảnh z???
ah,cái avatra up lên mà nó k to ra gống như itvvn z???chỉ giúp em nhak

[HTT.itvn]

hướng dẫn em cái phần giới tình làm sao cho nó hiện bằng ảnh z???
ah,cái avatra up lên mà nó k to ra gống như itvvn z???chỉ giúp em nhak

Tải file ảnh về tại đây và upload lên host trong thư mục /images/ .
Vào Admin CP >> User Profile Fields >> Add New User Profile Field >> Ở mục Profile Field Type chọn Single-Selection Menu >> Continue



Bạn điền thông tin như hình vẽ .

Sau đó vào Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Postbit templates >> Postbit_legacy >> Tìm đoạn code mà ta đã thêm thông tin họ tên ở trên và chèn đoạn code sau xuống dưới :

div class="eti_postbit"><b><font color=red><dt>Giới tính</font></b></dt> <dd><img src="images/gender/<vb:if condition="$post['fieldx']=='Nam'">Nam<vb:else /><vb:if condition="$post['fieldx']=='Nữ'">Nu<vb:else />Đồng tính</vb:if></vb:if>.gif" border="0" alt="{vb:raw post.fieldx}"></img></dd> </div>

Save and Reload . Vào forum cập nhập thông tin .

Chú ý : Nếu bạn dùng skin giống ITVNN thì bạn chỉ cần thay "eti_postbit" thành "post_field" và xoá bỏ các thẻ <font color=red><b>...</b></font> ( xoá chữ in đậm màu xanh )

- Chỉnh avatar : vào AdminCP >> Usergroups >> Usergroup Manager >> Chọn adminsistor , nhấn Tiếp tục >> kéo xuống dưói tại mục Picture Uploading Permissions :
- Custom Avatar Maximum Width (pixels) : 120
- Custom Avatar Maximum Height (pixels) : 120
- Custom Avatar Maximum File Size (bytes) : dung lượng file ảnh tối đa
Những gì không nhắc để nguyên . Nhấn save .
Tương tự với mod , smod , mem , ... Vào forum cập nhập lại avatar .

[vothien93]

cho em xin file ảnh!!!!
làm sao để khung profile rộng(chiều ngang) hơn z a???

[HTT.itvn]

cho em xin file ảnh!!!!
làm sao để khung profile rộng(chiều ngang) hơn z a???

- Đã cập nhập lại link ở bài viết trên
- Thay đổi bề rộng khung profile :
Vào AdminCP >> Styles & Products >> Style Manager >> Chọn Skin cần chỉnh >> StyleVars >> Tại mục Search StyleVar gõ : postbitlegacy >> Postbitlegacy_userinfo_width :
Tại mục Size chọn kích thước bề rộng của Profile >> Save .