Cara Membuat Pencarian Blog Mengarah ke Pencarian Google

Cara Membuat Pencarian Blog Mengarah ke Pencarian Google - Pencarian mengarah ke google terlebih dahulu hehe bagus nih untuk meningkatkan Sumber Lalu Lintas pencarian google hehehe bener nggak sob?..

Jadi gini saat pengunjung mencari artikel sobat, kan pengunjung mencari tuh di pencarian blog nah saat pengunjung mencari akan ke redirect dulu pencariannya ke google nah otomatis menambah Sumber Lalu Lintas dari google iya kan bener kan hehehe

jika minat, Oke langsung saja ke tutorialnya.

Baca Juga : 20 Cara Paling Efektif Menurunkan Bounce Rate Pada Blog

Cara Membuat Pencarian Blog Mengarah ke Pencarian Google

Pertama sobat masuk terlebih dahulu ke Blogger > Tema > Edit HTML copy kode CSS dibawah ini dan pastekan tepat di atas ]]></b:skin> atau </style>

/* Search Navigation */
#search{position:relative;background:rgba(255,255,255,0.99);transform:translate(0px,-100%) scale(0,0);opacity:0;display:none;transition:all .5s}
#search .container{position:absolute;left:0;right:0;top:-53px;margin:auto;text-align:center;z-index:9;overflow:hidden;max-width:970px;padding:0}
#searchform{background:#fafafa;display:block;position:relative}
#search.open{transform:translate(0,0) scale(1,1);opacity:1;z-index:106;display:block}
#search input[type="search"]{display:block;color:#888;float:left;width:95%;font-size:16px;font-weight:400;padding:17px 0;text-indent:20px;background:transparent;border:0;outline:0;transition:.35s}
#search input[type="search"]::-webkit-input-placeholder{color:#888}
#search input[type="search"]::-moz-placeholder{color:#888}
#search input[type="search"]:-ms-input-placeholder{color:#888}
#search input[type="search"]:-moz-placeholder{color:#888}
#search input[type="search"]:focus{color:#222}
#search input[type="search"]::-ms-clear{display:none}
#search input[type="search"]::-webkit-search-decoration,#search input[type="search"]::-webkit-search-cancel-button,#search input[type="search"]::-webkit-search-results-button,#search input[type="search"]::-webkit-search-results-decoration{display:none}
.search-icon{background:#222;color:#fff;position:absolute;top:0;right:10px;bottom:0;padding:8px 24px;cursor:pointer;overflow:hidden;font-size:18px;text-align:center;line-height:2;z-index:2;box-shadow:inset 0 5px 5px rgba(0,0,0,0.1);border-top:4px solid #01a3a4}
.search-icon:hover{background:#151515;color:#fff}
.search-icon i.fa.fa-search{z-index:2;position:relative}
.search-close{display:block;float:right;padding:8px 24px;color:#888;outline:0;position:absolute;top:0;right:0;bottom:0;cursor:pointer;text-align:center;font-size:20px;line-height:2;transition:all .3s}
.search-close:hover{color:#222}
@media screen and (max-width:640px){#search input[type="search"]{width:80%}}

Setelah sobat sudah memasang kode CSS diatas sekarang saatnya memasang kode HTMLnya copy kode dibawah ini pastekan sesuai yang sobat mau.

<a class='search-icon ripplelink'><i class='fa fa-search'/></a>

<div id='search'> 
      <div class='container'>
        <form action='https://google.com/search' class='ripplelink' id='searchform' method='get' role='search' target='_blank'>
          <input name='q' oninput='setCustomValidity(&apos;&apos;)' oninvalid='this.setCustomValidity(&apos;Please fill out this field&apos;)' placeholder='Press Enter to Search...' required='' type='search'/>
          <input name='domains' type='hidden' value='triksimple.com'/>
  <input name='sitesearch' type='hidden' value='triksimple.com'/>
          <span class='search-close'>&#10006;</span>
        </form>
      </div>
    </div>

Ganti triksimple.com dengan link alamat blog sobat.

Jika sobat tidak ingin menggunakan CSS diatas ingin menggunakan CSS bawaan template sobat juga bisa sob tinggal tambahkan kode dibawah ini di kode HTML Searchnya.

<input name='domains' type='hidden' value='triksimple.com'/>
  <input name='sitesearch' type='hidden' value='triksimple.com'/>

Mudah bukan sob kalau mau lihat demonya sudah saya terapkan di blog ini.

Baca Juga : Cara Membuat Table of Contents (TOC) pada Postingan Blog

Oke sekian yang bisa saya jelaskan tentang Cara Membuat Pencarian Blog Mengarah ke Pencarian Google Terima Kasih yang sudah berkunjung semoga bermanfaat bagi kalian semua.