Tạo hộp tìm kiếm đơn giản cho thiết kế web

Tạo hộp tìm kiếm đơn giản cho thiết kế web
     

Khi bạn xây dựng một thiết kế web, hộp tìm kiếm được xem là một yếu tố quan trọng trong việc cho phép truy cập site và chuyển hướng. Vai trò của nó không...

Khi bạn xây dựng một thiết kế web, hộp tìm kiếm được xem là một yếu tố quan trọng trong việc cho phép truy cập site và chuyển hướng. Vai trò của nó không chỉ đơn giản là để dự đoán và đáp ứng những gì người dùng tìm kiếm mà còn để "dẫn dắt" khách truy cập tham quan  thiết kế web của bạn.


tao hop tim kiem

Tạo hộp tìm kiếm đơn giản cho thiết kế web


Hôm nay tạp chí web xin đưa ra một số tài liệu thiết kế web để giúp bạn tạo ra một hộp tìm kiếm cho website của mình như một điểm khởi đầu cho các tùy chỉnh của riêng bạn. Lưu ý rằng đây chỉ là những hộp tìm kiếm [HTML], và bạn chỉ có thể sao chép và dán vào các thiết kế web của mình để mà người dùng có thể nhập vào một truy vấn tìm kiếm bất kỳ từ bất kỳ trang nào trên website.


Những hộp tìm kiếm dưới đây không cung cấp các chức năng tìm kiếm. Đầu tiên, bạn cần phải có một trang tìm kiếm làm việc được tạo ra với gói Zoom Search Engine


Cũng lưu ý rằng bạn không cần phải cài thêm các mẫu tìm kiếm mặc định (trừ khi bạn muốn). Các trang tìm kiếm sẽ có một hình thức tìm kiếm tự động tạo ra mà bạn có thể tùy biến với [CSS].


Hộp tìm kiếm thẳng


Đây là hộp kẻ thẳng có nút tìm kiếm vuông ở phía cuối.

hop tim kiem thang

Đầu tiên, bạn cần phải tải hình ảnh của nút tìm kiếm. Nhấp chuột phải chọn “Save Target as..”. Hình ảnh miễn phí để sử dụng.

http://www.wrensoft.com/zoom/support/images/searchform_images/searchbutton3.gif


Mã nguồn HTML:

Nút tròn


Đây là hộp tìm kiếm đơn giản với một nút tìm kiếm hình tròn (Hoặc bạn có thể thay bất kỳ hình ảnh mình thích).

nut vuong

Tải hình ảnh nút tròn màu xanh lá cây. Nhấp chuột phải chọn “Save Target as..”. Hình ảnh miễn phí để sử dụng.

http://www.wrensoft.com/zoom/support/images/searchform_images/searchbutton2.gif


Mã nguồn HTML

Hộp tìm kiếm cong


Hình thức này sử dụng một background hình ảnh để tạo ra một hộp tìm kiếm cong

nut cong

Bạn có thể tải về khung văn bản cong tại đây:

http://www.wrensoft.com/zoom/support/images/searchform_images/roundbox.gif

và hình ảnh nút màu xanh tại đây:

http://www.wrensoft.com/zoom/support/images/searchform_images/searchbutton1.gif


Nhấp chuột phải chọn “Save Target as..”. Hình ảnh miễn phí để sử dụng.


Mã nguồn HTML

Hộp tìm kiếm là cực kỳ quan trọng đối với các thiết kế web, đặc biệt là thiết kế web bán hàng, khi người dùng có nhu cầu tìm kiếm sản phẩm, dịch vụ trên website. Các hộp tìm kiếm trên đây sẽ giúp cho website của bạn hấp dẫn hơn.


Chúc thành công!