Bài viết mới
Loading...

Tạo ô tìm kiếm bài viết bằng ID cho xenforo

Mặc định trong xenforo chỉ cho tìm kiếm theo tiêu đề của bài viết. Hôm nay mình sẽ hướng dẫn các bạn cách tìm kiếm bài theo ID trong xenforo.

- Đầu tiên, vào template page_container_js_body add đoạn code dưới đây vào trước thẻ </xen:hook> </script>

$('#form_search_topic').submit(function(){
var id = $(this).find('input').val();
window.open('http://domain.com/threads/'+id+'/');
$(this).find('input').val('');
return false;
});
Sau đó thay url bằng url forum của các bạn nhé.

Ai dùng Widget Framework thì vào add 1 cái Widget, chọn vị trí thích hợp và add code sau:
<div class="form-searchid">
<form class="searchid" action="threads/" method="get" id="form_search_topic">
<div class="inputid"> <input size="20" type="text" name="idthread" value="" placeholder="Nhập ID topic"></div>
<div class="submitid"><input type="submit" value=" Tìm " style="height:25px; font-size:13px"></div>
</form>
</div> 
Nếu bạn không dùng widget framework thì cứ add vào template nào bạn thấy phù hợp.

- Tiếp theo là chỉnh sửa CSS, các bạn vào EXTRA.CSS
.form-searchid .searchid {
background: url(http://domain.com/images/bgntp1.png) no-repeat;
width: 187px;
height: 36px;
margin-left: 1px;
margin-top: 5px;
margin-bottom: 5px;
}
.form-searchid {
width: 190px;
margin: 2px;
padding: 3px;
height: 45px;
}
.form-searchid .searchid .inputid input {
font-size: 13px !important;
font-family: Arial, Helvetica, sans-serif !important;
color: #5e5e5e !important;
width: 100px;
padding: 2px 5px 2px 5px;
border: 1px solid #0e93ad;
margin: 7px 0 0 36px;
float: left;
}
.form-searchid .searchid .submitid input {
font-size: 14px !important;
font-family: Arial, Helvetica, sans-serif !important;
color: #fff !important;
font-weight: bold;
border: 0;
background: none;
float: left;
text-transform: uppercase;
text-shadow: 0px 1px 2px #007891;
margin-top: 5px;
display: block;
cursor: pointer;
}
Cuối cùng các bạn upload hình sau vào thư mục image trong xenforo và sửa lại background url trong css lại nhé.

Chúc các bạn thành công!

0 comments:

Post a Comment