Hướng dẫn đóng khung thông tin chi tiết cho VBB 4.x
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ể :.jpg "đóng khung thông tin chi tiết cho VBB") |
| đóng khung thông tin chi tiết cho VBB |
 |
| đóng khung thông tin chi tiết cho VBB |
Dán code sau vào cuối cùng :
Bước 2 : Đóng khung từng chi tiết .
- Đưa thông tin tên thành viên vào giữa
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 :
/* eTiKeT Postbit_Legacy*/Save and Reload.
.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;}
Bước 2 : Đóng khung từng chi tiết .
- Đưa thông tin tên thành viên vào giữa
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']">Thêm thẻ <div class="itvnn_postbit">......</div> như sau ( chú ý chữ màu đỏ ) .
{vb:raw memberaction_dropdown}{vb:raw post.onlinestatus}<vb:else /><span class="username guest">{vb:raw post.musername}</span></vb:if></div>
<div class="username_container"><vb:if condition="$post['userid']"><div class="itvnn_postbit">Save and reload.
{vb:raw memberaction_dropdown}{vb:raw post.onlinestatus}<vb:else /><span class="username guest">{vb:raw post.musername}</span></vb:if></div></div>
- 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 .
Đầu tiên tải file ảnh về:
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ụcUser Rank File Path gõ đường dẫn file ảnh là images/ranks/admin.gif >> Save.
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àoupdate user titles and ranks lần nữa .
Nhấn F5 để xem thành quả .
- Thêm thông tin như Địa chỉ , tên thật , năm sinh , ....
Admin CP >> User Ranks >> Add New User Ranks >> Mục Usergroup chọn Administrators , ở mục Minimum Posts để giá trị 0 và mụcUser Rank File Path gõ đường dẫn file ảnh là images/ranks/admin.gif >> Save.
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àoupdate user titles and ranks lần nữa .
Nhấn F5 để xem thành quả .
- Thêm thông tin như Địa chỉ , tên thật , năm sinh , ....
+ Đầu tiên chúng ta thêm thông tin tên thật .
Vào Admin CP >> User Profile Fields >> Add New User Profile Field >> Ở mục Profile Field Type chọnSingle-Line Text Box >>Continue >> Mục chủ đề gõ : Họ và tên , mục Description gõ : Họ tên thật của bạn , mục Max length of allowed user input ghi giá trị 30 ( độ dài của tên ) , các mục khác để nguyên >>Save .
Bảng User Profile Fields in Area: Edit Profile xuất hiện , bạn chú ý chữ số kèm theo chữ field sau nó . Ví dụ : field5 thì mình nhớ chữ số 5 .
Tiếp theo ta cho nó hiển thị và đóng khung nó , bạn làm như sau :
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 :
<vb:if condition="$post['userid']"><hr /><dl class="userinfo_extra">Chèn xuống dưới đoạn code sau :
<vb:if condition="$post['fieldx']"><div class="eti_postbit">Họ tên : {vb:raw post.fieldx}</div></vb:if>Với chú ý là chữ x màu đỏ là số field mà bạn phải ghi nhớ mà mình đã nhắc ở trên , như ví dụ của mình thì đoạn code như sau :
<vb:if condition="$post['field5']"><div class="eti_postbit">Họ tên : {vb:raw post.field5}</div></vb:if>Save and reload . Nhấn F5 để kiểm tra.
+ Thêm thông tin địa chỉ ( thông tin giới tính , năm sinh , ... cũng tương tự ) .
Vào Admin CP >> User Profile Fields >> Add New User Profile Field >> Ở mục Profile Field Type chọn Single-Selection Menu >> Continue >> Mục chủ đề gõ Địa chỉ , mục Description gõ Tỉnh/Thành Phố và mục Tùy Chọn gõ tên các tỉnh thành , phân biệt lựa chọn bởi 1 dấu xuống dòng :
An GiangBà Rịa - Vũng TàuBạc LiêuBắc CạnBắc GiangBắc NinhBến TreBình DươngBình ĐịnhBình PhướcBình ThuậnCà MauCao BằngCần ThơĐà NẵngĐắk LắkĐắk NôngĐồng NaiĐồng ThápGia LaiHà GiangHà NamHà NộiHà TâyHà TĩnhHải DươngHải PhòngHậu GiangHoà BìnhThành phố Hồ Chí MinhHưng YênKhánh HoàKiên GiangKon TumLai ChâuLạng SơnLào CaiLâm ĐồngLong AnNam ĐịnhNghệ AnNinh BìnhNinh ThuậnPhú ThọPhú YênQuảng BìnhQuảng NamQuảng NgãiQuảng NinhQuảng TrịSóc TrăngSơn LaTây NinhThái BìnhThái NguyênThanh HoáThừa Thiên-HuếTiền GiangTrà VinhTuyên QuangVĩnh LongVĩnh PhúcYên BáiCác mục khác để nguyên và save . Chú ý số Field nhé .
Sau đó cho hiển thị thông tin : 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 :
<vb:if condition="$post['fieldx']"><div class="eti_postbit">Ðến từ : {vb:raw post.fieldx}</div></vb:if>Chú ý thay số field nhé.
+ Đóng khung thông tin số bài viết , thành viên thứ , ...
Ngay ở dòng kế tiếp bạn sẽ thấy đoạn code cần đóng , bạn chú ý thẻ < div class=" .... " >....</div> và bạn thay thế thẻ <div class="eti_postbit">....</div>.
Toàn bộ code hoàn chỉnh của mình như sau:
<dl class="userinfo_extra"><vb:if condition="$post['field5']"><div class="eti_postbit">Họ tên : {vb:raw post.field5}</div></vb:if><vb:if condition="$post['field6']"><div class="eti_postbit">Ðến từ : {vb:raw post.field6}</div></vb:if><vb:if condition="$post['field7']"><div class="eti_postbit">Năm sinh : {vb:raw post.field7}</div></vb:if><vb:if condition="$post['field8']"><div class="eti_postbit">Giới tính : {vb:raw post.field8}</div></vb:if><vb:if condition="$post['joindate']"><div class="eti_postbit"><dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd></div></vb:if><vb:if condition="$post['field2']"><dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd></vb:if><vb:if condition="$post['age']"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></vb:if><div class="eti_postbit"><dt>{vb:rawphrase 'posts'}</dt> <dd>{vb:raw post.posts}</dd></div>Đoạn code trên nằm dưới thẻ ( ngay sau mod avatar ):
{vb:raw template_hook.postbit_userinfo_right_after_posts}</dl>
<vb:if condition="$post['userid']"><hr />- Đóng khung level
+ Nếu bạn dùng Mod level như diễn đàn này thì bạn đóng khung như sau :
Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Postbit templates >> postbit_userlevel >> Chèn code sau lên đầu :
Vào Admin CP >> Styles & Templates >> Tìm level_postbit_showlevel_legacy >> Code như sau :
Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Postbit templates >> postbit_userlevel >> Chèn code sau lên đầu :
< div class="eti_postbit">Chèn code sau nằm cuối :
</div>Toàn bộ code level sau khi chèn thẻ:
<div class="eti_postbit"><br /><div align="left" class="userlevelContainer"><div class="smallfont">{vb:rawphrase userlevel_level}: {vb:raw showlevel} <vb:if condition="$show['hl']">[<a href="faq.php?{vb:raw session.sessionurl}faq=vb3_user_profile#faq_vb3_us er_level">?</a>]</vb:if><br />{vb:rawphrase userlevel_experience}: {vb:raw exp}<br />{vb:rawphrase userlevel_nextlevel}: {vb:raw nextexp}</div><div class="alt2" style="text-align:left; width:102px; background-color: #fff; border:1px; height:11px; border-style:solid;" title="{vb:rawphrase userlevel_needexp, {vb:raw nextexp}}"><div style="width:{vb:raw ewidth}; height:9px; margin:1px; background-image: url({vb:stylevar imgdir_misc}/userlevel.gif); background-repeat:repeat-x;"></div></div></div><br /></div>Nếu bạn dùng mod level clasic ( mod level có cộng trừ điểm sau khi thank ) thì làm như sau:
Vào Admin CP >> Styles & Templates >> Tìm level_postbit_showlevel_legacy >> Code như sau :
<!-- Level & Class System v3.0 - Posbit --><dl class="userinfo_extra"><div class="eti_postbit"><div class="level_class_legacy"><div class="lv_tr"><div class="lv_td">{vb:raw lv.level}</div></div>- Đóng khung Thank
<div class="class_tr"><div class="class_td">{vb:raw class.name}</div></div>
<div class="exp_tr"><div class="exp_td" style="background:transparent url(level_class/img/ExpBar.gif) {vb:raw lv.epfx} 2px no-repeat;" title="{vb:rawphrase lv_exp}: {vb:raw lv.exp}/{vb:raw lv.maxEXP} ({vb:raw lv.epf}%)"> </div></div><div class="exp_tr"><div class="exp_td" style="background:transparent url(level_class/img/SpBar.gif) {vb:raw lv.spfx} 1px no-repeat;" title="{vb:rawphrase lv_sp}: {vb:raw lv.sp}/{vb:raw class.maxsp} ({vb:raw lv.spf}%)"> </div></div><div style="font-size:11px;margin-top:2px">{vb:rawphrase lv_plusmess,{vb:raw lv.userid},{vb:raw lv.plus_times},{vb:raw lv.minus_times},{vb:raw lv.total}}</div></div></div></dl><!-- / Level & Class System v3.0 - Posbit -->
Nếu bạn dùng mod Post Thank You Hack ( hoặc các phiên bản tương tự ) thì bạn làm theo cách này :
Admin CP >> Styles & Templates >> Style manager >> Chọn skin cần chỉnh , edit templates >> Post Thank You Hack Templates >> post_thanks_postbit_info >> Chèn thẻ
<div class="eti_postbit">....</div> như 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>
Save and reload
- Đóng khung cho Blog :
Vào AdminCP >> Styles & Templates >> Style Manager >> Blog Templates >> blog_postbit_entrtes_link :
<div class="eti_postbit"><dt>{vb:rawphrase blog_entries}</dt><dd><a href="{vb:link blog, {vb:raw post}, null, 'userid', 'blog_title'}">{vb:raw post.entries}</a></dd></div>Save and Reload .
(Bài viết của HTT.itvn )
![[Template] - Movey Responsive Blogger Template Download](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisrDMu9l1UXWy06yU2S2bsn8AaVmhjA9PqHKVZ27ICbcFZYb5ZsrWsSb1tL2tb8AfCr7qOr-f2-5siS3gLuMm7M4mWKP_dJNLgMqCD5Qz26PvsKMaLGtnfpCCwDI5E9Ce0w2YXYWVqIwG5/w72-h72-p-k-no-nu/movey+image+bthemez.png)
![[Blogspot] - Hướng dẫn sao lưu blogspot đơn giản!](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmmHBChUGRd7WgxkGeoX-B4Mw4YfhfbTgQ1i-rBo-OMy6jzFLoxlVmPH-bepFBqZTFJucdj3r8sLQYpIPkLg7tibRKHH9QfraSpAxpGrvtmbihF1vYqMNkPoI0huI02levcBVFG2sBdA/w72-h72-p-k-no-nu/sao+l%25C6%25B0u+template.png)
![[Download] - TẢI ITUNES PHIÊN BẢN MỚI NHẤT (CẬP NHẬT LIÊN TỤC)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc9qp5-jri_z48Bd_lvuN-8T-abp8C2_rUrI9CP5g4IRN4h6OU96_cgd83yzsYSgVJCtqJrsgGrhOcJohFZPcLE6PfcxNx_nrJvGdJu_c6AMIabrHzW5vkwamkfEB718zjHyNZl80ye8Yg/w72-h72-p-k-no-nu/itunes.jpg)
![[Template] - Sora Fast Loading Blogger Template loading fastest - đẹp, nhẹ và tải trang cực nhanh](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRIBEKuT86FG0lUiTnOiAxgBYzEWlboPjbvLDhS5LvL0euDiEfnsAkyj8HLL6bKjJXbU3qI5Qu2e489t1WFaUuE8yQoX5eOP9UF2u_2y-KuvYnjwuN_MJI4ob3y9VZaKUxZT5o1kdspLdJ/w72-h72-p-k-no-nu/sora-fast-blogger-theme-free-premium.png)
![[Thủ thuật] - Hướng dẫn bật "nút ruồi" - Menu hỗ trợ nhanh trên dòng điện thoại Samsung](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_2sezDx93BKJori1d6KPaJJWjty_-ZtPNcD1dgxVjwIEAktn46DhF6G0i3-EfHVGb_htya6x5NnE6JgOMxf1IzRhP3INBjzh6PekI2CF38DwDbCm_Vu8TLUvajAQb2LP1v_8Ii-hmcjGA/w72-h72-p-k-no-nu/Screenshot_20200508-105750_One+UI+Home.jpg)
![[Thủ Thuật] - Hướng dẫn tạo mật khẩu màn hình và Vân tay Samsung Note 10](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX1lhOJ7O4Nw4dhbj3dtPUA4_l-ifezPi-0cXepbCSCaENIjwhACTbi-sSaw8tUfXUcznnc-TRhZpf0sHbno7D8kHZxznt0b07S9MtLgO_0R56voJKFjeMw0QarVQJE-a7-c4GdhDNk2wU/w72-h72-p-k-no-nu/1593312114851939-0.png)
![[Thủ Thuật] - Cách quay màn hình Samsung Note 10+](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5CgtdUWFIzR_BKGqBZ2_t373iY5gwgZqCZR73m3hKgKW95zakN6v6idI4yK7WUwZ9hpD-VcJ95g2P1zWfCRAL-G3rlVY3ENpcuzYkMrIkUgizqMkyDN1NltZ_P3A7Hq_AHT5KyFeQ0QvK/w72-h72-p-k-no-nu/Screenshot_20200507-223650_One+UI+Home.jpg)
:))
Trả lờiXóa