Hướng dẫn tạo form live search cho Blog
Bài này mình trình bày phương pháp tạo khung live search cho Blog sử dụng feeds hiển thị các bài viết liên quan đến từ khóa. Lấy ví dụ khi một người nhập từ khóa và khung tìm kiếm thì trong khung search sẽ hiển thị tối đa 10 bài viết liên quan đến từ khóa đó. Kết quả hiển thị sẽ là tiêu đề và link truy cập bài viết liên quan đến từ khóa đó. Phương pháp thực hiện như sau: Copy <head> <style type='text/css'> #searchForm { display:inline-block; position:relative; width:500px; } #searchForm input { background:transparent; font-size:14px; line-height:27px; text-indent:14px; width:90%; color:#212121; border:1px solid #e0e0e0; border-right:none; border-radius:2px 0 0 2px; outline:0; } #searchForm input:hover, #searchForm button:hover { border:1px solid #b9b9b9; border-top:1px solid #a0a0a0; -webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1); -moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.1); box-shadow:inset 0 1px 2px rgba(0,0,0,.1); } #searchForm button { width:60px; …
