Làm đẹp khung search Google cho Xenforo

[PVS]

Làm đẹp khung search Google cho Xenforo

Bài viết này sẽ hướng dẫn các bạn cách làm đẹp khung search Google cho trang của bạn.

​

Đầu tiên các bạn vào template ad_below_top_breadcrumb hoặc tạo 1 widget ở vị trí mong muốn. Sau đó paste code này ở dưới cùng template.

<script>
  (function() {
    var cx = 'xxxxxxxxxxxxxxxxxxxxx:xxxxxxxxxxx';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
   <div class="google_search">
        <span class="notice_search">Tìm Kiếm Với Google</span>
        <gcse:search></gcse:search>
   </div>

<br/>
<br/>

Lưu ý đoạn:

xxxxxxxxxxxxxxxxxxxxx:xxxxxxxxxxx

Bạn phải vào: http://google.com/cse để tạo cho mình 1 cái custom search rồi lấy id để thay thế đoạn trên (không được dùng đoạn trên nếu không sẽ không search được)

Tiếp theo các bạn vào EXTRA.CSS thêm đoạn sau vào

/*
   
GOOGLE CUSTOM SEARCH */
.google_search .notice_search {
    background: #3D85C6;
    color: #FFF;
    padding: 5px 10px;
    font-size: 14px;
    font-family: roboto;
    border-bottom-right-radius: 5px;
}

.google_search {
    border: 5px solid #3D85C6;
    border-radius: 5px;
}
/* END GOOGLE CUSTOM SEARCH */

Chúc các bạn thành công.

Nguồn: mamcongnghe.com​

 

[Fast]

sao không cho hình demo kết quả xem có đẹp không bạn?
nếu như hình trên thì mình thấy chưa đẹp , mình nghĩ nên cho
border-bottom-right-radius: = 1, hoặc 0 sẽ đẹp hơn.

 

[PVS]

hii, thì mình thấy nó cũng đẹp hơn mặc định mà ^^

 

[dcstylexf]

sao không cho hình demo kết quả xem có đẹp không bạn?
nếu như hình trên thì mình thấy chưa đẹp , mình nghĩ nên cho
border-bottom-right-radius: = 1, hoặc 0 sẽ đẹp hơn.

thì bạn có thể tự chỉnh mà

 

[jangnam]

công nhận là đẹp mình đã làm ra nó