Đóng góp cho anh em tạo khung search tùy chỉnh lề trái

Thảo luận trong 'Installation & Upgrade Questions' bắt đầu bởi datkaka, 2/9/13.

1votes
5/5, 1 vote

  1. datkaka

    datkaka Member

    Bài viết:
    372
    Likes :
    51
    Mình chưa có đóng góp gì, không biết cái này có chưa :D nên cứ post, hoặc tương tự , mình góp cho anh em cái phần tạo khung search tùy chỉnh google ở lề trái đẹp và gọn . Có thể tùy biến thành các mục khác cũng được.

    Code như sau : Tìm PAGE_CONTAINER , thêm trước thẻ </body> đoạn code sau

    Mã:
    <style>
    #trollvc_div{
    width:300px;
    height: 271px;
    overflow: hidden;}
    #trollvc_left{
    z-index: 100;
    border: 5px solid #0F517F;
    background-color: #fff;
    width: 300px;
    height: 70px;
    position: fixed;
    left: -308px;
    border-radius:5px 5px 5px 5px;
    }
    #trollvc_left img {position: absolute;top: 5px;left: 300px;}
    #trollvc_left div .tv-trollvc-com {border:0px solid #3c95d9;overflow: hidden;position: static;height: 310px;right:-2px;top:-3px;}
    </style>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
    <script type="text/javascript">
    var vnd = jQuery.noConflict();
    </script>
    <script>
        vnd(document).ready(function () {
        vnd("#trollvc_left").hover(function () {
        vnd(this).stop(true, false).animate({ left: 0 }, 500);
        },
        function () {
        vnd("#trollvc_left").stop(true, false).animate({ left: -308 }, 500);
        });
        });
    </script>
    <div id="trollvc_left" style="top: 27%;">
        <div id="trollvc_div">
        <img src="http:trollvc.com/images/trollvuicuoi.png" alt="Tìm kiếm nhanh" />
            <script>
      (function() {
        var cx = '006438487453096324502:3kwbgbmw-vy';
        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>
    </div>
    Các bạn thay thế phần
    Mã:
    <script>
      (function() {
        var cx = '006438487453096324502:3kwbgbmw-vy';
        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>
    nó nằm sau đoạn

    Mã:
      <img src="http:trollvc.com/images/trollvuicuoi.png" alt="Tìm kiếm nhanh" />
    thành đoạn js google tìm kiếm tùy chỉnh của mình vào. hoặc đoạn fb like box của mình vào cũng được :D
    Xong !

    Demo : http://trollvc.com/forums/
     
    Đang tải...
  2. Bvn.vn

    Bvn.vn Active Member

    Bài viết:
    1,832
    Likes :
    401
    Góp ý cho bác nút đăng ký của bác màu xanh đó khó nhìn quá, cái này cách nhìn của riêng em thôi nó chói chói sao ấy, hì sr nếu có gì sai.
     
  3. balasratran

    balasratran New Member

    Bài viết:
    54
    Likes :
    5
    upload_2013-9-2_8-52-19
    làm sao để hiện như của bạn vậy...
     
  4. datkaka

    datkaka Member

    Bài viết:
    372
    Likes :
    51
    copy cái đoạn của google tìm kiếm vào trong page content. thích đặt chổ nào đặt
     
    balasratran thích bài này.
comments powered by Disqus

Chia sẻ trang này

Đang tải...