Arama kutusunu uygulama

Programlanabilir Arama Motorunuzu oluşturduktan sonra, Programlanabilir Arama Öğesini sitenize ekleyebilirsiniz. Bunu yapmak için, bazı kodları kopyalayıp sitenizin HTML'sine arama motorunuzun görünmesini istediğiniz yere yapıştırmanız gerekir.

  1. Denetim Masası'nda, kullanmak istediğiniz arama motorunu tıklayın.
  2. Genel Bakış sayfasının Temel bölümünde Kodu al'ı tıklayın. Kodu kopyalayın ve sayfanızın HTML kaynak koduna yapıştırın. Burada, Programlanabilir Arama Öğesinin görüntülenmesini istediğiniz yere yapıştırın.

<div class="gcse-search"></div> öğesi bir yer tutucudur. Arama öğesi (hem arama kutusu hem de arama sonuçları) burada oluşturulur.

<!-- Kendi Programlanabilir Arama Motoru Kimliğinizi buraya ekleyin --> <script async src="https://cse.google.com/cse.js?cx=017643444788069204610:4gvhea_mvga"></script> 
<div class="gcse-search"></div>

Farklı düzenler deneme

Birçok durumda, arama kutusunun arama sonuçlarından bağımsız olarak görünmesi mantıklıdır. İki sütunlu düzen, sayfanızın bir bölümünde (örneğin, kenar çubuğunda) arama kutusu oluşturmanıza ve sonuçları farklı bir alanda (örneğin, sayfanın ana bölümünde) göstermenize olanak tanır.

Motorunuzun düzenini değiştirmek için Denetim Masası'ndaki Görünüm ve tarz sayfasının Düzen bölümüne gidin. Kontrol Paneli'nde 2 sütunlu düzeni seçip kaydettikten sonra, Arama Öğesi için HTML kodunu da değiştirmeniz gerekir.

<!-- Kendi Programlanabilir Arama Motoru Kimliğinizi buraya ekleyin --> <script async src="https://cse.google.com/cse.js?cx=017643444788069204610:4gvhea_mvga"></script> 
<div style="border: 1px solid blue;">
    Area 1 (for example a sidebar)
    <div class="gcse-searchbox"></div>
</div>

<div style="border: 1px solid red;">
    Area 2 (for example main area of the page)
    <div class="gcse-searchresults"></div>
</div>

İlginç bir diğer düzen de iki sayfalı seçenek. Bu sayfa, kendi arama kutunuzu bir sayfaya uygulamanıza ve adres çubuğundaki parametreleri kullanarak standart arama sonuçlarını başka bir sayfada oluşturmanıza olanak sağlar.

Kontrol Paneli'nde iki sayfalık düzeni seçip kaydedin. Bir sayfada bağımsız bir arama kutusu uygulayın ve resultsUrl özelliğini, sonuçları görüntülemek istediğiniz URL'ye işaret edecek şekilde değiştirin.

<script async src="https://cse.google.com/cse.js?cx=YOUR_ENGINE_ID"></script>
<div class="gcse-searchbox-only" data-resultsUrl="YOUR_RESULTS_PAGE_URL"></div>

Deneyin

Bağımsız bir arama sonuçları sayfası uygulamak için sonuç kodu snippet'ini sonuçlar sayfanıza yapıştırın:

<script async src="https://cse.google.com/cse.js?cx=YOUR_ENGINE_ID"></script>
<div class="gcse-searchresults-only"></div>

Artık url'de "q" bağımsız değişkeni ileterek bu sayfadaki arama sonuçlarını tetikleyebilirsiniz:

https://my-results-page-url.com/?q=myQuery

Adres çubuğundaki q=myQuery parametresini not edin. Bu, <div class="gcse-searchresults-only"></div> öğesinin hangi sorgu sonuçlarının görüntüleneceğini bilmesini sağlar.

Deneyin

Sonraki...

Otomatik tamamlamayı etkinleştirme sayfasına gidin.