[HD] Tạo trang tìm kiếm cho trang web bằng cách sử dụng công cụ Google Custom Search

Google Custom Search là 1 công cụ tìm kiếm hiệu quả do gã khổng lồ Google cung cấp với nhiều ưu điểm như:

• Tốc độ tìm kiếm nhanh (do không truy xuất tới Database của trang web)
  
• Kết quả cực kì chính xác
  
• Kết hợp được với tài khoản Google Adsense để kiếm tiền
  
• Nhiều tùy chỉnh cho việc hiện kết quả
  

Bài viết này, mình sẽ hướng dẫn cách thiết lập Google Custom Search và cách chèn vào trang web / blog của bạn.
Cài đặt Google Custom Search
VàoGoogle Custom Search để tạo hoặc quản lí nếu bạn có hoặc chưa có bộ tìm kiếm nào.
Nhấn nút Create a Custom Search Engine để tạo 1 bộ tìm kiếm mới


Màn hình tiếp theo yêu cầu bạn nhập thông tin cho bộ tìm kiếm này

• What do you want to search: lựa chọn các trang web muốn tìm kiếm (nên chọn theo hình)
  
• Select some sites:
  điền tên các trang web muốn tìm kiếm (bạn điền url của trang web nếu
  chỉ muốn hiển thị các kết quả trong trang web của bạn mà thôi)
  

Sau khi điền xong thông tin, bạn đánh dấu vào mục "I have read and agree…" rồi nhấn Next sang bước tiếp theo.

Ở trang tiếp theo này không có gì cả, chỉ là trang preview nên các bạn tiếp tục nhấn Finish.

Bây giờ bạn được chuyển sang trang quản lý, hãy lựa chọn bộ tìm kiếm bạn tạo



Nhấn vào Control Panel để cài đặt

Ở cột Control Panel bên trái, kéo xuống dưới chọn Look and Feel.

• 
  Choose a hosting option: nơi kết quả hiện ra
  

1. Search element: hiện ngay kết quả trên trang web bạn đang tìm kiếm (nên dùng cách này cho đơn giản )
   
2. Iframe: hiện kết quả tìm kiếm ra ở 1 trang khác trên website của bạn. VD như mình đang dùng: http://b3smile.co.cc/search.html
   
3. Google-hosted page: hiện kết quả trên website của Google
   

• 
  Choose a layout for Search element: chọn layout Compact để chèn vào Sidebar cho nhỏ gọn
  

• 
  Choose or customize a style: lựa chọn skin hiện kết quả. Blog mình đang sử dụng mẫu Minimalist có edit lại một số tông màu theo sở thích.
  

Cuối cùng nhấn Get Code để lấy code chèn vào Blog.

Đây là code của bạn nếu bạn chọn tùy chọn 1: Search element, bạn chỉ cần copy và paste vào trang web hoặc blog của bạn là OK.
Mình nói thêm một chút về tùy chọn thứ 2: Iframe. Nếu bạn chọn mục này thì khi Get Code sẽ có dạng như sau:

Ở mục Specify search results details bạn điền trang web dùng để hiển thị kết quả tìm kiếm (vd: search.html) vào nhé.
Code trong phần Search box code để hiển thị hộp thoại tìm kiếm, bạn có thể chèn nó vào trang chủ hoặc bất cứ trang nào cũng được (kể cả trang search.html phía trên)

Còn code trong mục Search results code bạn chèn vào trang search.html vừa điền ở mục Specify search results details phía trên…
Các bạn có thể xem demo cho 2 cách tại đây: http://demo.b3smile.co.cc/html/google-custom-search/
Chúc các bạn thành công và có được một trang tìm kiếm ưng ý của riêng mình!