Nhatthienkt.net - tìm kiếm tùy chỉnh của Google là một công cụ khá tiện ích. Vừa đẹp vừa tương thích với nhiều trình duyệt khác nhau. Ưu điểm nữa là nó giúp tìm kiếm chính xác Tiếng Việt không dấu.
Làm thế nào để tạo được khung tìm kiểm tùy chỉnh Google
Không có gì khó khăn cả, chỉ vài thao tác là xong. Đầu tiên các bạn truy cập vào trang https://www.google.com.vn/cse/all
Bước 1: Tạo và chỉnh sửa công cụ tìm kiếm
- Bấm nút Add để tạo mới
- Nhập thông tin cho khung tìm kiếm
- Chỉnh sửa chút cho đẹp và ứng ý
+ Chỉnh giao diện
+ Chỉnh màu sắc chữ và link
- Bấm "Lưu và nhận mã" bạn sẽ được Google cung cấp mã như hình dưới
Làm thế nào để tạo được khung tìm kiểm tùy chỉnh Google chuẩn HTML5
Một bước quan trọng là hãy thay đổi một chút code này để nó chuẩn HTML 5
- Các bạn hãy thay thế dòng cuối cùng của đoạn code
<script>
(function() {
var cx = '001845176843552288341:dr0xwclg200';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>
Thay cái này thành
<div class="gcse-search"></div>
Vậy là ta có đầy đủ đoạn code chuẩn HTML5 như sau
<script>
(function() {
var cx = '001845176843552288341:dr0xwclg200';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<div class="gcse-search"></div>
Hướng dẫn chèn vào blogspot
- Theo hướng dẫn Google thì các bạn hãy chèn ngay sau thẻ <body> và giữa 2 cái thẻ div
Tuy nhiên để đơn giản các bạn vào "Bố cục" chọn "Thêm tiện ích" chọn HTML/Javascript
Và dán đoạn code trên vào đây. Kéo chọn vị trí phù hợp. Và lưu lại.
Nếu chọn cách này thì hãy vào "Mẫu" chọn "Chỉnh sửa HTML" và tìm xóa <b:include name='quickedit'/> vì nó dư thừa.
Vậy là bạn đã có một khung tìm kiếm tuyệt đẹp và đầy đủ tính năng cho web hay blogspot.
xem thêm
- Chèn like facebook google + tweet vào blogspot chuẩn HTML5
- Cách sửa lỗi H1: Zero that is really bad cho blogspot
Chúc các bạn thành công!
1 Nhận xét
bài rất hay. cảm ơn bạn đã hướng dẫn
Trả lờiXóaVui lòng viết comment Tiếng Việt có dấu.
Emoji- Bạn có thể gửi mail trực tiếp qua địa chỉ: nhatthienkt.s@gmail.com
- Nhận xét không hỗ trợ cho người dùng ẩn danh
- Lưu ý những nhận xét với mục đích backlink không liên quan đến nội dung bài viết sẽ bị xóa bỏ
- Bạn muốn theo dõi cập nhật trả lời sớm nhất từ adm vui lòng tick vào ô "Thông báo cho tôi" rồi xuất bản nhận xét của mình.