Bu sayfada, arama kutunuzun ve arama sonuçlarınızın görünümünü nasıl özelleştirebileceğiniz açıklanmaktadır. Arama motorunuzun tasarımını bağlam dosyasını kullanarak uygulamak istiyorsanız "XML ile Görünümü Tasarlama" sayfasını inceleyin.
- Genel Bakış
- Arama kullanıcı arayüzünün tek tek bileşenlerini tasarlama
- Arama öğesini kullanarak sonuçları barındırma
- Arama öğesi düzenini ayarlama
- Arama kutusunu tasarlama
- Sonuçları Tasarlama
- Tasarımı web sitenize uygulama
Genel Bakış
Programlanabilir Arama Motorunuzun hem arama kutusunu hem de arama sonuçlarını denetim masasında veya XML bağlam dosyasında değiştirebilirsiniz. Birkaç arama motorunuz varsa bunları denetim masasıyla yönetmek ve özelleştirmek oldukça kolaydır. Görünüm ve stil sayfasına gidin, bir stil seçin, bileşenleri tasarlayın ve Kaydet'i tıklayın. Bu sayfada tüm bunları nasıl yapacağınız açıklanmaktadır. Ancak çok sayıda arama motoru oluşturup yönetiyorsanız bu basit prosedür bile birden fazla arama motorunda tekrarlandığında sıkıcı hale gelir. Bu gibi durumlarda XML ile çalışmak daha iyi olur. XML kullanmaya karar verirseniz öncelikle bu sayfayı okuyarak genel olarak işlerin nasıl yürüdüğü hakkında fikir edinin. Ardından, XML öğeleri ve özellikleri hakkında bilgi edinmek için XML ile Görünüm ve Tarz Tasarlama sayfasını okuyun.
Yalnızca kontrol panelini mi yoksa XML biçimini mi kullanmanız gerektiğinden emin değilseniz her biçimin avantajları ve zorluklarının ele alındığı Temel Bilgiler sayfasını inceleyin.
Not: Özel arama motorunuzun görünümünü ve verdiği izlenimi tasarlamaya başlamadan önce Programlanabilir Arama Motoru'nu uygulama yönergelerini okuyun. Bu kısa dokümanda, Google markasını ve ilişkilendirmesini nasıl ele almanız gerektiği açıklanır.
Arama öğesini kullanarak sonuçları barındırma
Arama öğesi, web sayfanıza yerleştirebileceğiniz ve kapsamlı özelleştirmeye olanak tanıyan bir nesnedir. Arama kutusunu ve arama sonuçlarını, okuyucunun görüntülediği web sayfasında birlikte veya farklı web sayfalarında gösterebilir.
Not: Arama öğesi, kompakt düzenle eşlendiğinde mobil cihazlarda iyi çalışır.
Arama kullanıcı arayüzünü daha da özelleştirmek için Programmable Search Element Control API'den de yararlanabilirsiniz. HTML özellikleri aracılığıyla birçok özelleştirme desteklenir. Örneğin, sonuçlar sayfanız için altı düzen arasından seçim yapabilir veya döndürülecek arama sonucu sayısını ayarlayabilirsiniz.
Programlanabilir Arama Motoru artık iframe barındırma seçeneğini desteklemiyor. Yeni seçenekler olarak Arama öğesinde "İki sayfa" veya "Yalnızca sonuçlar" düzenlerini kullanmanızı öneririz. Daha fazla bilgi için blog yayınımıza göz atın.
Arama kullanıcı arayüzünün tek tek bileşenlerini tasarlama
Özelleştirilebilir Bileşenler
Özelleştirebileceğiniz bileşenler, arama motorunuzun seçilen öğe düzenine bağlıdır. Örneğin, kontrol paneli yalnızca Google tarafından barındırılan arama motorlarına logo eklemenize olanak tanır. Diğer barındırma seçeneklerini kullanan arama motorlarına logo ekleyemezsiniz.
Denetim masasını kullanarak aşağıdaki bileşenleri tanımlayabilirsiniz:
- Arama öğesi düzeni
- Arama kutusu
- Arama sonuçları
- Daraltma sekmeleri
- Tanıtımlar
- Logo (yalnızca Google tarafından barındırılan)
Arama öğesi düzenini ayarlama
Arama kullanıcı arayüzünüzün web sayfasında nasıl düzenleneceğini özelleştirebilirsiniz. Arama kutusunu ve sonuçlar bölümünü aynı sütuna yerleştirebilir veya bunları ayrı sütunlarda gösterebilirsiniz. Arama kutusu bir sütunda, sonuçlar bölümü ise başka bir sütunda veya hatta başka bir sayfada yer alabilir.
Düzen seçenekleriniz (demoları görmek için bağlantıları tıklayın):
| Seçenek | Açıklama |
|---|---|
| OverLay | Arama sonuçlarını bir yer paylaşımında görüntüleyin. |
|
İki Sayfa
Basit Birden fazla arama kutusu/sonuç bölümü |
Arama kutusu ve arama sonuçları bölümü iki farklı web sayfasına yerleştirilir.
Not: Arama sonuçları bölümünde bir arama kutusu da bulunur. Kullanıcılar doğrudan arama sonuçları sayfasında sorgu gönderebilir. |
| Tam genişlik | Arama kutusu ve arama sonuçları bölümü, sayfanın veya Arama öğesini eklediğiniz sütunun tamamını kaplar. |
| İki Sütun | Arama kutusu ve arama sonuçları bölümü, web sayfanızın farklı sütunlarında veya bölümlerinde yer alıyor. Kullanıcı, arama sonuçları bölümünü kapatmak için arama kutusunun yanındaki X simgesini tıklar. |
| En Yüksek |
Tam genişlik seçeneği gibi bu seçenek de sayfanın veya sütunun tamamını kaplar ancak sonuç bölümünde daha az sonuç gösterilir. Bu nedenle, web sayfasında genişletildiğinde daha az dikey alan kaplar.
İpucu: Bu seçenek, akıllı telefonlar ve mobil cihazlar için optimize edilmiştir. |
|
Yalnızca Sonuçlar
URL ile arama Arama kutusu ile arama |
Arama sonuçları web sayfalarınızdan birine yerleştirilir ve arama sonuçları sayfasında arama kutusu bulunmaz. Arama sorgusunu göndermek için kendi arama kutunuzu kullanın.
Not: Reklam göstermeyen bir Programlanabilir Arama Motoru'nda markalamayı devre dışı bırakma seçeneği yoktur. |
|
Google Tarafından Barındırılan
Mevcut pencere Yeni pencere |
Arama kutusu, web sayfalarınızdan birine yerleştirilir. Arama sonuçları, aynı pencerede veya yeni bir pencerede açılabilen Google tarafından barındırılan bir web sayfasında gösterilir. |
Arama kutusunu tasarlama
Arama kutularının geleneksel olarak web sayfalarının üst kısmına (veya üst kısmına yakın bir yere) yerleştirilmesine rağmen, arama kutusunu web sayfanızın HTML gövdesinin herhangi bir yerine ekleyebilirsiniz. Örneğin:
Şekil 1: Arama kutusunun üstte yer aldığı web sayfası.
Otomatik Tamamlamayı Etkinleştirme
Otomatik tamamlama, kullanıcılarınız arama kutunuza arama sorgularını girerken onlara sorgu seçenekleri sunar. Google Arama'da gördüğünüz isteğe bağlı sorgulara benzer.
Şekil 2: Arama kutusuna yalnızca birkaç karakter yazıldığında, farklı arama sorgularıyla ilgili seçenekler sunan bir açılır liste gösterilir.
Programlanabilir Arama Motoru, otomatik tamamlamayı arama motorunuza özel olarak uyarlar. Bu özellik, arama motorunuza yapılan sorgular ve arama motorunuzun kapsadığı web sitelerinin içeriğinden çıkarılan anahtar kelimeler ve ifadeler de dahil olmak üzere birden fazla kaynaktan yararlanan farklı bir algoritma kullanır.
Otomatik tamamlama özelliği, Arama Özellikleri sayfasının Otomatik Tamamlama bölümünde yer alır.
Otomatik tamamlamaları etkinleştirmek için aşağıdakileri yapın:
- Arama Özellikleri sayfasının Otomatik Tamamlama bölümüne gidin.
-
Otomatik tamamlamayı etkinleştir kontrolünü açın.
Not: Otomatik tamamlanan sorgular her arama motoru için oluşturulduğundan, otomatik tamamlama özelliğinin arama motorunuzda görünmeye başlaması birkaç saat sürer.
- Mevcut bir arama motorunda otomatik tamamlamaları ilk kez etkinleştiriyorsanız web sayfanıza eklediğiniz arama kutusunun kod snippet'ini kaldırmanız gerekir. Bu kodu, Kodu al sekmesinde oluşturulan yeni kodla değiştirin. Daha ayrıntılı talimatlar için Tasarımı Web Sitenize Uygulama bölümüne bakın.
Sonuçları tasarlama
Sonuçlar sayfasının aşağıdaki bileşenlerini değiştirebilirsiniz:
- Tek tek sonuçlar
- Yazı tipi türü
- Metin renkleri
- Daraltma sekmeleri
- Tanıtımlar
- Logo (yalnızca Google tarafından barındırılan)
Bireysel Sonuçlar
Sonuçları görsel olarak ayırmak veya kullanıcılar tarafından seçilen sonuçları vurgulamak istiyorsanız tek tek sonuçların kenarlıklarını ve arka planını tanımlayabilirsiniz.
Şekil 3: Tek tek sonuçların sınırlandırıldığı ve fareyle üzerine gelindiğinde vurgulanan sonuçlar.
Ayrıntılandırma Sekmeleri
Arama motorunuzda daraltma etiketleri oluşturduysanız bu etiketler, arama öğesinde sekme olarak görünür. Daraltma sekmelerinin renklerini değiştirmek için kontrol panelini kullanabilirsiniz.
Tanıtımlar
Arama motorunuzda promosyonlar oluşturduysanız bunların görünümünü ve tarzını değiştirebilirsiniz. Tanıtımlar, oluşturduğunuz özel bir arama sonucu türüdür.
Logo (yalnızca Google tarafından barındırılan)
Google'ın sonuç sayfanızı barındırmasına izin veriyorsanız arama sonuçları sayfasındaki arama kutusunun hemen yanına bir logo veya küçük resim ekleyebilirsiniz. Resim, bir web sitesinde (kendi web siteniz veya telif hakkı kısıtlamaları olmayan bir web sitesi) barındırılan bir .jpg, .png veya .gif dosyası olmalıdır. Resimle bir URL ilişkilendirerek resmi tıklanabilir hale getirebilirsiniz.
Aşağıda, logolu bir sonuç sayfası örneği verilmiştir.
Şekil 4: Görsel içeren arama kutusu
Tasarımı web sitenizde uygulama
Arama motorunuzun görünümünü ve tarzını tasarladıktan sonra aşağıdaki adımları uygulayarak arama motorunuzu web sayfanıza ekleyebilirsiniz:
- Görünüm ve stil sayfasında değiştirdiğiniz bölümlerde Kaydet'i tıklayın.
- Görünüm ve stil sayfasının Düzen bölümünde Kodu al'ı tıklayın.
-
Kod pop-up'ında oluşturulan kod snippet'ini kopyalayın.
İki sütunlu düzeni seçtiyseniz iki kod snippet'i kopyalayın: biri arama kutusu, diğeri ise sonuçlar için.
İki sayfalık düzeni seçtiyseniz arama motorunuzun sonuçlarını gösterecek web sayfasının URL'sini girin. URL'ye yerleştirilmiş ve arama sonuçları sayfası tarafından ayrıştırılan sorgu parametresi adını yazın. Son olarak, iki kod snippet'ini kopyalayın.
Yalnızca sonuçlar düzeni için kod snippet'i, arama sonuçlarının yeni bir sayfada gösterildiği durumlar içindir. URL'ye yerleştirilmiş ve arama sonuçları sayfası tarafından ayrıştırılan sorgu parametresi adını yazın. Son olarak, arama sonuçları kod snippet'ini kopyalayın.
-
Kodu, Programlanabilir Arama Motoru kutusunun görünmesini istediğiniz her sayfaya ekleyin. Kodu, web sayfanızın
<body></body>etiketinin herhangi bir yerine yapıştırabilirsiniz.Not: Tarayıcılar arası en iyi uyumluluk için HTML sayfalarınızın
<!DOCTYPE html>gibi desteklenen bir doküman türü kullanması önerilir.Arama öğeniz için fareyle üzerine gelme efektleri kullanıyorsanız HTML sayfanız
<!DOCTYPE html>gibi desteklenen bir DOCTYPE kullanmalıdır.
İki sütunlu düzeni seçtiyseniz arama kutusunun kodunu bir sütuna, sonuçların kodunu ise başka bir sütuna ekleyin.
İki sayfalık düzeni seçtiyseniz arama kutusunun kodunu arama kutusunun görünmesini istediğiniz web sayfasına, sonuçların kodunu ise arama sonuçlarının görünmesini istediğiniz web sayfasına ekleyin.
Yalnızca sonuçlar düzenini seçtiyseniz kod snippet'ini arama sonuçlarının görünmesini istediğiniz web sayfasına ekleyin.