Elementor'da Özel Arama Sonucu Sayfası Nasıl Oluşturulur

İyi tasarlanmış bir arama sonucu sayfası, kullanıcı deneyimini geliştirmede çok önemli bir rol oynar. Ziyaretçilerin aradıkları ilgili içeriğe hızlı bir şekilde gitmelerini sağlar. Bu yalnızca içerikte gezinmede zaman tasarrufu sağlamakla kalmaz, aynı zamanda onları daha fazla keşfetmeye teşvik eder.

Elementor, milyonlarca WordPress web sitesi için başvurulan bir sayfa oluşturucudur. Kolayca bir arama sonuçları sayfası oluşturabileceğiniz bir tema oluşturucu ve kullanışlı widget'lar sağlar. Bu eğitim yazısında size Elementor'da özel bir arama sonucu sayfasının nasıl oluşturulacağını açıklayacağız.

Arama kutusunun herhangi bir arama sonuçları sayfasının ana öğesi olduğunu unutmayın. İnsanların alakalı gönderileri ve ürünleri bulmak için anahtar kelimelerini yazdıkları yerdir. Bu nedenle öncelikle Elementor'u kullanarak dinamik bir arama kutusu oluşturacağız. Ardından, bir arşiv widget'ı ekleyerek sayfayı bir blog arşiv sayfası haline getirerek tamamlayacağız.

Elementor'da Özel Arama Sonucu Sayfası Nedir?

Arama sonucu sayfası, kullanıcıların ve ziyaretçilerin blog gönderileri, e-Ticaret ürünleri ve portföy öğeleri gibi belirli içerik türlerine hızlı bir şekilde gitmesini sağlayan özel bir web sayfasıdır. Bu tür sayfalar, ağır içerikli web siteleri için zorunludur.

Özel bir arama sonuçları sayfası, sayfanın iyi görünmesini sağlamak için öne çıkan görseller, özel başlıklar, filtreler vb. gibi çeşitli öğeleri istediğiniz gibi eklemenize olanak tanır. Bu yalnızca kullanıcı deneyimini geliştirmekle kalmaz, aynı zamanda dönüşümlerin artmasına da yardımcı olur.

WordPress'teki Özel Arama Sonucu Sayfalarının Kullanım Örnekleri

Öğreticiye geçmeden önce, WordPress'teki özel arama sonucu sayfalarının bazı kullanım örneklerine göz atalım. Aşağıdaki listeye göz atın.

• e-Ticaret Web Siteleri

Ürün arama sonuçları sayfasını filtrelerle görüntüleyin. Ziyaretçiler tam ürünü bulmak için arama çubuğunu kullanabilir veya bunları fiyatlara, derecelendirmelere ve kategorilere göre sıralamak için filtreleri kullanabilir.

• Blog Siteleri

Blog yazıları ve makaleler etiketlere ve kategorilere göre görüntülenir. Kullanıcılar bunları yazara, tarihe ve diğer sorgulara göre sıralayabilir.

• Bilgi Bankası Sayfası

Bilgi tabanı sayfaları genellikle Kendin Yap dokümantasyon kılavuzlarını ve yardımcı kaynakları kapsar. Yararlı içeriği hızlı bir şekilde keşfetmek için bu sayfalarda arama özelliği bir zorunluluktur.

• Hizmet Tabanlı İşletmeler

Kullanıcılar, rezervasyon yapmadan veya bir iletişim formunu doldurmadan önce istedikleri hizmetleri derecelendirmelere, fiyat aralıklarına, tekliflere ve diğer ilgili ayrıntılara göre sıralayabilir.

• Eğitim Web Siteleri

Gelişmiş arama ve filtreleme seçenekleri, öğrencilerin ve öğrencilerin ihtiyaç duydukları içeriği kolayca bulabilmeleri için kursları, dersleri ve çalışma materyallerini aramanıza olanak tanır.

Elementor'da Özel Arama Sonucu Sayfası Nasıl Oluşturulur

Teorik kısım bitti. Bu bölümde artık Elementor'da özel bir arama sonucu sayfasının nasıl oluşturulacağına ilişkin eğitim kısmını ele alacağız. Sitenizde aşağıdaki eklentilerin bulunduğundan emin olun.

• Elementor
• Elementor Pro

Bunları sitenize ekledikten sonra, aşağıda açıklanan eğitimi izleyin.

Adım 01: Elementor Tema Oluşturucuya gidin

WordPress kontrol panelinize giriş yapın. Ardından Şablonlar > Tema Oluşturucu'ya gidin.

Site Bölümleri altında Arama Sonuçları seçeneğini seçin . Daha sonra +Yeni Ekle butonuna tıklayın .

Bu, özel arama sonucu sayfasını oluşturmak istediğiniz herhangi bir widget'ı ekleyebileceğiniz Elementor tuvalini açacaktır.

Adım 02: Arama Widget'ını Eklemek için Yeni Bir Bölüm Oluşturun

Kanvastaki artı (+) simgesini tıklayın . Ardından istediğiniz sütun yapısını seçin .

Bölüme başlık yazmalısınız. Bu SEO açısından faydalıdır.

Bu nedenle, Başlık widget'ını bölüme sürükleyip bırakın. Bu, bölüm için bir başlık yazmanıza olanak tanır.

Stiller sekmesine gelin. Başlık metninin rengini, tipografisini, yazı tipi boyutunu, hizalamasını ve daha fazlasını değiştirme seçeneklerine sahip olacaksınız. Kendin yap.

Benzer şekilde, Metin Düzenleyici widget'ını başlık metninin altındaki bölüme sürükleyip bırakın. Daha sonra istediğiniz metni yazın ve yukarıda gösterildiği gibi özelleştirin.

Adım 03: Bölüme Arama Widget'ını ekleyin

Arama widget'ını bulun. Yukarıda gösterildiği gibi Metin Düzenleyici widget'ının altındaki bölüme sürükleyip bırakın.

Adım 04: Arama Widget'ını Özelleştirin

Varsayılan olarak, arama widget'ı tuvalin tüm genişliği boyunca görüntülenecektir. Genişliğini azaltmak için Gelişmiş sekmesine gelin.

Marj bölümünü göreceksiniz. İstediğiniz değerleri sağ ve soldaki bölüm kutularına yerleştirin. Arama widget'ının genişliğinin azaltıldığını göreceksiniz.

Daha sonra Stil sekmesine gelin. Yer tutucu metin tipografisini, arama kutusu arka plan rengini, kenarlık türünü ve daha fazlasını değiştirme seçeneklerine sahip olacaksınız. Web sitenizin tasarımının gereksinimlerine göre bunu kendiniz yapın.

Burada yaptığımız şey arama kutusuna bir yarıçap değeri eklemektir. Kenarlık Yarıçapı'nın altındaki Üst ve Sol kutulara değer yerleştirdik.

Benzer şekilde, arama düğmesine bir yarıçap ekledik. Bunu yapmak için Stil sekmesinin altındaki Gönder Düğmesi bölümünü genişletin. Değerleri Yarıçap'ın altındaki Sağ ve Alt kutulara yerleştirin.

Değişiklikleri anında göreceksiniz. Fareyle üzerine gelme efekti, arka plan rengi, kutu gölgesi vb. eklemek istiyorsanız buradaki seçenekleri inceleyin.

Elementor ile nasıl blog yazısı şablonu oluşturulacağını keşfedin.

Adım 05: Sonuçlar Seçeneğini Yapılandırın

Ajax arama özelliği hakkında bir fikriniz olduğunu umuyoruz. Bir kullanıcı bir şey yazmaya başladığında, arama kutusunun hemen altında birkaç sonuç anında görüntülenir.

Arama widget'ının Sonuçlar seçeneği , bu özelliği etkinleştirmenize ve arama kutusu altında görüntülemek istediğiniz anlık sonuçların toplam sayısını yapılandırmanıza olanak tanır.

İçerik Sekmesine gidin. Ardından Sonuçlar bölümünü genişletin.

Canlı Sonuçlar seçeneğini açın. Bu özellik artık etkindir.

Adım 06: Canlı Sonuçlar için Şablon Oluşturun

Elementor, kullanıcı arama kutusuna her yazı yazdığında içeriğin nasıl görüntüleneceğini belirtebileceğiniz canlı bir sonuç şablonu oluşturmanıza olanak tanır.

Sonuçlar bölümünün altındaki Şablon oluştur düğmesini tıklayın.

Bu sizi yeni bir tuvale götürecektir. Burada canlı arama sonuçları için bir düzen oluşturmanız ve bunu şablon olarak kaydetmeniz gerekir.

İstediğiniz gibi bir sütun yapısı seçin. Yön Satırını seçtik. Bu bölüme ekleme yaptığınızda sağ tarafta gösterilmeye devam edecektir.

Blog gönderilerini sergilemek için bu arama kutusunu kullanmak istiyoruz. Bu nedenle, birisi bir blog konusu yazdığında, arama kutusunun ilgili blog gönderilerinin bir listesini göstermesi gerekir. Bunu yapmak için önerilen gönderi widget'larını eklemeliyiz.

Öne Çıkan Görsel widget'ını bölüme sürükleyip bırakın.

Öne çıkan görselin boyutu varsayılan olarak büyük olacaktır. İlk olarak Görüntü Çözünürlüğü seçeneğinden Orta boyutu seçin.

Daha sonra Stil sekmesine gelin. Hizalama, genişlik ve yarıçap gibi seçenekleri kullanarak, aşağıda ekteki ekran görüntüsünde görüldüğü gibi öne çıkan görselin boyutunu daha da azaltabilirsiniz.

Aynı şekilde, Yazı Başlığı widget'ını öne çıkan görselin yanına yerleştirin.

Yazı tipi boyutunu küçülttüğümüzü ve rengini değiştirdiğimizi görebilirsiniz.

Not: Bu aşamada şablonu kaydedin . İsterseniz buna daha fazla öğe ekleyebilirsiniz.

Elementor ile nasıl özgeçmiş web sitesi oluşturulacağını öğrenin.

Adım 07: Şablonu Sonuca Ekleme

Tasarladığımız şeyin ana sayfasına gelin. Sonuçlar bölümünün altındaki açılır simgeye tıklayarak, bir süre önce tasarladığınız bir şablonu seçin .

Bir şablon seçildiğinde altında birkaç yeni seçenek görünecektir. Bunları kullanarak arama kutusu altında görüntülenecek toplam öğe sayısını yapılandırabilirsiniz.

Adım 08: Canlı Sonuçlar Düzenini Stilize Edin

Tekrar Stil sekmesine gelin ve Sonuçlar bölümünü genişletin. Arka plan türünü, kenarlık türünü, yarıçapı, dolguyu, arama alanına olan mesafeyi, sütun yüksekliğini, genişliğini ve satırlar ve sütunlar arasındaki boşluğu stilize edebilirsiniz.

Canlı Sonuçları Önizle

Şimdi arama kutusuna bir şeyler yazın. Aşağıda, yazdığınız konuyla ilgili üç öğeden oluşan bir listenin aşağıda görüneceğini göreceksiniz.

Bu, arama widget'ının mükemmel çalışmasını sağlar.

Not: Arama widget'ınız hazır ve tamamen işlevseldir. Web sitenizin üst bilgi, alt bilgi ve sayfalar gibi herhangi bir yerinde aynı şekilde arama kutuları oluşturabilirsiniz. Bu tür arama kutuları genellikle başlık ve arşiv gönderi sayfalarına yerleştirilir.

Adım 09: Arşiv Gönderileri Widget'ını Ekleyin

Arama kutusu bölümünün altında yeni bir bölüm oluşturun. Ardından Arşiv Gönderileri widget'ını yeni bölüme sürükleyip bırakın.

Bu, web sitenizde yayınladığınız tüm blog yazılarını ızgara formatında gösterecektir.

Adım 10: Arşiv Gönderileri Widget'ının Ayarlarını Yapılandırın

Artık Arşiv Gönderileri widget'ını özelleştirmenin ve düzenini istediğiniz gibi yapmanın zamanı geldi. Widget'ın çok sayıda özelleştirme seçeneği vardır. Öncelikle temel ayarları yapılandırın. İçerik sekmesine gelin ve Düzen bölümünü genişletin.

Sütun sayısını, görsel konumunu ve görsel çözünürlüğünü seçin. 2 sütun seçtik, görüntü konumunu en üste ve çözünürlüğü tam olarak ayarladık.

Bundan sonra Başlık, Alıntı, Meta Veri ve Devamını Oku seçeneklerini açın. Ancak herhangi bir seçenek istemiyorsanız, onu kapalı tutun.

Alıntı uzunluğunu tanımlamak için yanındaki karakter sayısını ayarlayın. Ayrıca görüntülemek istediğiniz meta veri türünü de belirtin. Widget için Veri ve Yorumlar meta veri seçeneklerini seçtik.

Sayfalandırma, yayınlarınızı birden fazla sayfaya böler. Sayfalandırma bölümünü genişletmek , sayfalandırma türünü, hizalamayı, sayfa sınırını ve kısaltmayı yapılandırmanıza olanak tanır.

Elementor ile nasıl iletişim formu oluşturacağınızı öğrenin.

Adım 11: Arşiv Gönderileri Widget'ını Stilize Edin

Stiller sekmesine gelin. Burada birkaç seçenek bulacaksınız. Öncelikle Düzen bölümünü genişletin.

Sütun Boşluğunu, Satır Boşluğunu ve Hizalamayı özelleştirebilirsiniz.

Görüntü bölümünü genişletmek, kenarlık yarıçapını ve görüntüler ile diğer öğeler arasındaki boşluğu ayarlamanıza olanak tanır.

Aynı şekilde İçerik bölümünü genişleterek Başlık, Meta, Alıntı ve Devamını Oku metinlerinin tipografisini, rengini ve aralıklarını stilize edebilirsiniz.

Son olarak Sayfalandırma bölümünü genişletin. Bu, sayfalandırma öğelerinin tipografisini, renklerini, vurgulu efektlerini ve boşluklarını özelleştirmenize olanak tanır.

Not: Gerçekten de, her Elementor widget'ı için Arşiv Gönderileri widget'ı da dahil olmak üzere çok daha fazla seçenek vardır. Yukarıdaki eğitimde, Arşiv Gönderileri widget'ı için yapabileceğiniz özelleştirmeler hakkında size temel bir fikir vermeye çalıştık. Umarım bunların dışındaki seçenekleri keşfedebilir ve kullanabilirsiniz.

Adım 12: Arama Sonuçları Sayfasını Kaydedin ve Önizleyin

Şimdi sayfanın önizleme moduna gelin. Kutuya bir şey yazın ve Ara düğmesine basın. İlgili blog gönderilerinin aşağıda ızgara formatında göründüğünü göreceksiniz.

Herhangi bir Hata mı var? Arama Sonuçları Sayfası Bozuk Görünüyor!

Arama butonuna bastıktan sonra ilgili blog yazılarının aşağıdaki görseldeki gibi çıktığını görürseniz korkabilirsiniz. Sayfanın bozuk olduğunu hissedebilirsiniz.

Merak etme! Sorunu çözmek çok kolaydır.

Elementor tema oluşturucusunda bir Arşiv sayfası oluşturmanız yeterlidir. Arşiv Sayfasını tasarlama şekliniz, Ara düğmesine bastıktan sonra ilgili blog gönderilerinin nasıl görüntüleneceğini etkileyecektir.

Elementor ile arşiv sayfası oluşturma konusunda ayrı bir eğitim yazısı oluşturmamızı isterseniz yorum kısmından bize bildirin. Beklentilerinize göre böyle bir sayfa tasarlamayı düşüneceğiz.

Bu nedenle yazının öğretici kısmının sonu. Böylece WordPress'te Elementor'u kullanarak bir arama sonuçları sayfası oluşturabilirsiniz.

Bonus Puanı: Elementor için Daha Fazla Widget Almak İçin HappyAddons'ı Kullanın

HappyAddons, Elementor için harika bir güçlü widget koleksiyonuna sahip öne çıkan bir eklentidir. Mevcut Elementor widget'larının yeterli olmadığını düşünüyorsanız ve daha fazlasını arıyorsanız HappyAddons eklentisini deneyebilirsiniz.

HappyAddons, Elementor sitenizi yeni bir seviyeye taşıyabilecek 120'den fazla widget ve düzinelerce özellik ile birlikte gelir. Eklentinin hem ücretsiz hem de premium sürümü bulunuyor. Öncelikle ücretsiz sürümü deneyebilirsiniz. Memnun kalırsanız istediğiniz zaman premium sürüme yükseltebilir ve harika şeyler yapabilirsiniz.

Aşağıdaki ekteki butonlara tıklayarak eklentiyi edinin.

Çözüm

Arama sonucu sayfası oluşturmak günümüzde lüks değil, kullanıcı deneyimini geliştirmek için zorunludur. Web sitenizin çekiciliğini ve marka değerini korumanıza yardımcı olur. Siteniz esas olarak e-Ticaret ürünleri, bağlı kuruluş pazarlaması ve blog yazmaya yönelikse, bir arama sonucu sayfası olmadan asla yeterli olmaz.

Yukarıda açıklanan eğitimi takip ederek Elementor sitenizde çarpıcı arama sonucu sayfaları oluşturabileceğinizi umuyoruz. Ancak, her türden insanın bu öğeyi kullanabilmesi için arama widget'ını tabletler ve mobil cihazlar için optimize etmeyi unutmayın.