Thứ Năm, 20 tháng 9, 2012

Tạo thanh công cụ tìm kiếm cho blog

Thanh công cụ tìm kiếm Google tùy chỉnh sẽ giúp người thăm trang web của bạn dễ dàng tìm kiếm thông tin hơn. Để tạo thanh công cụ tìm kiếm, đầu tiên bạn vào đây
Bạn sử dụng tài khoản của các dịch vụ Google (gmail, blog....) để đăng nhập:
thanh công cụ tìm kiếm google tùy chỉnh
Sau khi điền các thông tin cơ bản, bạn sẽ được đưa đến trang thiết kế mẫu hiện diện:
thanh cong cu tim kiem google tuy chinh
Thêm đoạn code mà Google cho bạn vào nơi mà bạn muốn hiển thị.

* Nếu bạn muốn thanh công cụ tìm kiểm như trang dvt.com.vn 
thì sử dụng code sau và dán vào tiện ích:
<div align="center">
<form action='http://www.google.com/search' method='get' target='_blank'>
<input name='cx' type='hidden' value='008380302337720209252:uvxybhavnw8'/>
<input name='sitesearch' style='display:none;' value='http://dvt.com.vn/'/>
<input id='search-box' name='q' onblur='if(this.value==&#39;&#39;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&#39;&#39;;' style='width:215px;border:none;padding:4px 10px; font:italic 12px Arial;color:#666; background:url(https://dl.dropbox.com/u/74775294/anh/timkiembk.png) no-repeat;' type='text' value='Tìm kiếm trên dvt.com.vn'/><input align='top' id='search-btn' src='https://dl.dropbox.com/u/74775294/anh/timkiemdvt.png' type='image' value='Search'/>
</form>
</div>

Thay ID 008380302337720209252:uvxybhavnw8  thành ID duy của công cụ tìm kiếm mà bạn vừa tạo ở trên (tương tự như đoạn code màu cam sau đây):



<!-- Put the following javascript before the closing </head> tag. -->
<script>
  (function() {
    var cx = '017366832718625329855:fxui7xznnx0';
    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>

<!-- Place this tag where you want both of the search box and the search results to render -->
<gcse:search></gcse:search>
     

Không có nhận xét nào:

Đăng nhận xét