Cách tối ưu google search giống tìm kiếm mặc định của WordPress

Lúc mới tìm hiểu về cách làm website khi cần chèn google search vào web là mình bê nguyên cái đoạn code của google cấp chèn lên web như vậy là xong. Nhưng sau này tìm hiểu về cách tối ưu hoá Web để làm sao hạn chế scipt giúp tăng tốc Web mình mới biết được là cái Google search mặc định của google khi mình load website nó sẻ tự động load hàng tá file đuôi JS. mà cộng lại hết không dưới 500 KB một con số khủng khiếp đối với ai làm web.

Site mình thử nghiệm: https://dienlanhsodo.com/

Vậy mục tiêu của mình đặt ra là như thế này:

1. khi load website sẽ không load file JS của google, mà chỉ khi nào nhập từ khoá vào ô Textbox và Enter thì nó mới load thôi.

2. Giao diện của ô tìm kiếm mình phải có khả năng tuỳ chỉnh cho đẹp và nhẹ…

Mày mò 1 lúc qua 1 số tài liệu và thử nghiệm, cuối cùng mình cũng làm được, viết bài hướng dẫn luôn.
Như các bạn đã biết, mà nếu chưa biết thì đây là thông tin: Tìm kiếm mặc định của WordPress khá là dở, đặc biệt là tìm kiếm tiếng Việt, do vậy mình đã đi nghiên cứu và thấy google cung cấp công cụ tìm kiếm cho từng website hoàn toàn miễn phí. Dưới đây là hướng dẫn hoàn chỉnh và mới nhất về việc tích hợp tìm kiếm của Google vào WordPress.
Yêu cầu cần có:
Bạn phải có 1 tài khoản Gmail. Nếu chưa có thì bạn chịu khó vào https://gmail.com/ đăng ký.

Bước 1: Cài đặt Google Custom Search

Đăng ký sử dụng Google Custom Search tại đây: https://www.google.com/cse/

Đăng ký
Điền đầy đủ thông tin vào form, tick vào Tôi đã đọc và đồng ý…. rồi bấm vào “Tiếp”

chọn giao diện cho frame tìm kiếm
Trong giao diện tiếp theo bạn chọn giao diện cho frame tìm kiếm rồi bấm vào “Tiếp”

bấm vào link Giao diện
Tại màn hình tiếp theo, bạn cần phải bấm vào link Giao diện, mục đích là bạn sẽ phải phân tách box tìm kiếm và kết quả tìm kiếm ra 1 page riêng

Chọn một bố cục
Tiếp theo bạn chọn Phần “Hai trang” ở mục “Chọn một bố cục”
Bấm “Lưu & lấy mã…”

chỉ định chi tiết kết quả tìm kiếm
Ở trang này bạn sẽ điền vào phần “chỉ định chi tiết kết quả tìm kiếm”. Phần URL bạn điền URL của page bạn muốn hiển thị kết quả. Ví dụ với trang của mình thì mình điền là “https://dienlanhsodo.com/ket-qua-tim-kiem/”. Phần tham số thì để mặc định là q. Sau đó bạn bấm vào Lưu thay đổi.
Xong bước 1.

Bước 2: Copy Code và đưa vào WordPress.

Giờ bạn để ý ở trang cuối bước 1, bạn thấy 2 hộp mã nhúng không? Cái text đầu tiên là để hiện thị ô tìm kiếm, text thứ 2 hiển thị kết quả tìm kiếm:

Mã nhúng
Vậy giờ bạn chỉ cần đăng nhập vào WordPress và làm theo các bước sau
Ô tìm kiếm: Tôi sẽ đưa ô tìm kiếm vào phần sidebar, do vậy bạn sẽ vào phần quản lý widget trong phần giao diện cho WordPress, gắp Textbox Widget sang sidebar, copy phần code đầu paste vô đó. Vậy là xong

Ô tìm kiếm
Trang kết quả: Bạn vào phần Page của WordPress, tạo 1 page mới tên gì cũng được, nhưng bắt buộc phần permalink phải trùng vởi URL bạn đã khai báo ở bước 1, rồi bấm vào phần HTML của trang, paste cái phần code thứ 2 vô, save lại, DONE!

Trang kết quả
Thử tìm kiếm để thấy thành quả nào.