WordPress'te Arama Terimlerini Sonuçlarda Nasıl Vurgularsınız (2 Yöntem)

Bir sitede bir şeyi en son ne zaman aradığınızı düşünün. Muhtemelen anahtar kelimelerinizi arıyordunuz, değil mi? 🔍

Web sitesi ziyaretçilerinizin sitenizi ararken yaptığı tam olarak budur. Yalnızca WordPress bu terimleri varsayılan olarak vurgulamaz.

Vurgulanan arama terimlerini ayarlamak, sitenizi anında daha cilalı hissettiren basit geliştirmelerden biridir.

Ziyaretçiler her sonucun aramalarıyla neden eşleştiğini hızlı bir şekilde görebildiğinde, içeriğinize tıklama ve etkileşimde bulunma olasılıkları daha yüksektir.

Yıllardır WordPress siteleri oluşturup yönetirken, bu küçük kullanıcı deneyimi iyileştirmelerinin büyük bir etkisi olabileceğini gördüm. 📝

Bu nedenle, WordPress sitenizde arama terimi vurgulama elde etmenin 2 kolay yolunda size rehberlik edeceğim.

Web Sitemde Arama Terimlerini Neden Vurgulamalıyım?

Arama terimlerini vurgulamak, ziyaretçilerin aradıkları içeriği hızlı bir şekilde fark etmelerine yardımcı olur.

Kullanıcılar sitenizin arama çubuğuna bir anahtar kelime yazdığında, sonuçlarda tam olarak bu kelimeleri ararlar. Hiçbir şey öne çıkmazsa, farkında olmadan faydalı içeriği atlayabilirler.

Arama terimlerini vurgulayarak, sonuçları okumayı kolaylaştırırsınız ve hangi makalelerin en alakalı olduğunu anında gösterirsiniz.

Bu, kullanıcı deneyimini iyileştirir, ziyaretçilerin bilgileri daha hızlı bulmasına yardımcı olur ve doğru yerde olduklarından emin olmalarını sağlar. Hatta kullanıcıları sitenizde daha uzun süre kalmaya teşvik edebilir.

WPBeginner'da, eşleşen anahtar kelimeleri arama sonuçlarımızda kalın harflerle gösteriyoruz — bu, vurgulama gibi çalışıyor. Küçük bir dokunuş ama insanların aradıklarını daha hızlı bulmalarına gerçekten yardımcı oluyor.

Bunu söyledikten sonra, WordPress'te arama terimlerini nasıl kolayca vurgulayacağınızı gösterelim. 2 yöntemi tartışacağım. Seçtiğiniz yönteme atlamak için aşağıdaki bağlantıları kullanabilirsiniz.

Yöntem 1: SearchWP Kullanarak Arama Terimlerini Vurgulama – Önerilen

WordPress sonuçlarınızda arama terimlerini vurgulamanın hızlı ve sorunsuz bir yolunu arıyorsanız, SearchWP kullanmak en iyi seçeneğinizdir.

SearchWP, sitenizin arama deneyimini iyileştirmek için en iyi araçtır.

Varsayılan WordPress aramasından çok daha alakalı sonuçlar verir ve en iyi yanı? Arama terimlerini vurgulamayı inanılmaz derecede kolaylaştırır. Sadece bir düğmeyi çevirirsiniz ve tamamdır.

SearchWP'yi demo sitemizde kapsamlı bir şekilde test ettim ve sonuçlar etkileyiciydi. Sorunsuz çalışıyor ve yerleşik vurgulama özelliği, manuel kuruluma kıyasla çok zaman kazandırıyor.

Tüm özelliklerini ve nasıl çalıştığını görmek isterseniz, ayrıca SearchWP'nin tam incelemesini de yaptık.

Öncelikle, SearchWP eklentisini yükleyip etkinleştirmeniz gerekir. Adım adım talimatlar için, WordPress eklentisi nasıl kurulur hakkındaki eğitimimize bakın.

Eklentiyi etkinleştirdikten sonra, WordPress kontrol panelinizdeki SearchWP » Ayarlar sayfasına gidin.

Buraya lisans anahtarınızı girmeniz gerekecek.

Bu lisans anahtarını SearchWP web sitesindeki hesabınızın altında bulabilirsiniz. Sadece kopyalayıp yapıştırın.

Bundan sonra, aşağı kaydırarak ‘Genel Ayarlar’a gidin ve ‘Terimleri Vurgula’ anahtarını ‘Açık’ konumuna getirin.

Etkinleştirildiği anda, ziyaretçilerinizin kullandığı anahtar kelimeler arama sonuçlarında otomatik olarak vurgulanacak ve ilgili içeriği fark etmek çok kolaylaşacaktır.

Bu bölümde, arama sonuçlarınızı iyileştirebilecek ek ayarlar da bulacaksınız.

Özellikle çok fazla içeriğe sahip WordPress blogları için Bulanık Arama ve Tırnak İçinde Arama gibi özellikler çok yardımcı olur.

Bu özellik, ziyaretçilerin küçük bir yazım hatası yapsalar bile doğru içeriği bulmalarını sağlar. Bu, onları sinir bozucu bir “sonuç bulunamadı” sayfasında gezinmekten alıkoyabilir.

Öte yandan, Alıntılanan Arama, Google'da olduğu gibi, kullanıcıların tam bir ifadeyi tırnak içine alarak aramasını sağlar.

Tüm ayarlarınızın otomatik olarak kaydedileceğini unutmayın.

Genel Ayarlarınızdan memnun kaldığınızda, SearchWP'nin diğer özelleştirme seçeneklerini keşfetmek iyi bir fikirdir.

Arama sonuçlarının nasıl sıralanacağını ince ayar yapmak için kontrol panelinizdeki SearchWP » Algorithm sayfasına gidebilirsiniz.

Bu bölüm gerçekten yardımcı oluyor çünkü içeriğinizin farklı bölümlerinin ağırlığını (önemini) kontrol etmenizi sağlıyor - bunu arama sonuçlarınız için bir puanlama sistemi gibi düşünün.

Örneğin, başlıklara daha fazla ağırlık vermek, gönderi başlığındaki eşleşmelerin, gövde içeriğindeki eşleşmelerden daha üstte görünmesi anlamına gelir. Bu şekilde, en alakalı içerik ilk görünür.

‘Kaynaklar ve Ayarlar’ düğmesine tıkladığınızda, arama dizininize neleri dahil edeceğinize de karar verebilirsiniz.

Yalnızca gönderiler ve sayfalar yerine, yorumları, özel gönderi türlerini, WooCommerce ürünlerini, SKU'ları ve daha fazlasını ekleyebilirsiniz.

Bir blog veya çevrimiçi mağaza işletiyorsanız, bu aramanızı çok daha kullanışlı hale getirir.

Örneğin, bir müşterinin varsayılan WordPress aramasının yapamayacağı gibi, bir ürünü SKU'su ile, örneğin ‘TSHIRT-BLUE-LG’ ile bulmasına yardımcı olabilir.

Daha derinlemesine incelemek isterseniz, SearchWP ile WordPress aramasını nasıl iyileştireceğiniz konusunda tam bir rehber de hazırladık.

Ayarlarınızı kaydettikten sonra, SearchWP mevcut arama formunuzu otomatik olarak devralır. Ekstra adım gerekmez.

Sadece sitenize gidin ve hızlı bir arama yapın. Vurgulanan anahtar kelimeleri hemen göreceksiniz.

Henüz sitenize bir arama formu eklemediyseniz endişelenmeyin. WordPress'e arama formu nasıl eklenir hakkındaki adım adım eğitimimizi takip edebilirsiniz.

Bu ayar yapıldıktan sonra işiniz bitmiş demektir ve ziyaretçileriniz en başından itibaren çok daha iyi bir arama deneyimi yaşayacaktır.

Yöntem 2: Özel Kod Kullanarak Arama Terimlerini Vurgulama – Ücretsiz

Bütçeniz kısıtlıysa, arama terimlerini vurgulamak için özel kod kullanabilirsiniz. Genellikle bu, tema dosyalarınızı doğrudan düzenlemeyi içerir.

Ancak, küçük bir hata bile sitenizi çökertip 'Ölüm Beyaz Ekranı' hatasına neden olabilir.

Bu yüzden bunun yerine WPCode kullanmanızı öneririm. En iyi WordPress kod parçacığı eklentisidir ve tema dosyalarınıza dokunmadan özel kod eklemenin en güvenli yoludur.

WPCode'u farklı kurulumlarda kapsamlı bir şekilde test ettim ve her seferinde güvenilir bir şekilde çalışıyor. Sunduğu her şey hakkında meraklıysanız, daha sonra göz atabileceğiniz detaylı bir WPCode incelememiz de var.

Ancak şimdilik, bunu sitenizde arama terimlerini vurgulamak için nasıl kullanacağınızı adım adım inceleyelim.

Öncelikle, WPCode eklentisini yükleyip etkinleştirmeniz gerekir. Ayrıntılı talimatlar için, WordPress eklentisi yükleme rehberimize bakabilirsiniz.

Eklentiyi etkinleştirdikten sonra, kontrol panelinden Kod Parçacıkları » + Parçacık Ekle sayfasını ziyaret edin.

Burada, ‘Özel Kodunuzu Ekleyin (Yeni Parçacık)’ seçeneğinin altındaki ‘+ Özel Parçacık Ekle’ düğmesine tıklayın.

Şimdi sizi kod türü olarak 'PHP Snippet' seçmeniz gereken yeni bir ekrana götürecektir. Bu yapıldıktan sonra, kod parçacığınıza bir ad verin.

Bu ad ziyaretçilerinize görünür olmayacak - sadece sizin referansınız içindir. Bu yüzden Arama Terimlerini Vurgula gibi açıklayıcı bir şey veya tanımayı kolaylaştıran başka bir şey kullanmanızı öneririm.

Daha sonra düzenlemek veya devre dışı bırakmak isterseniz, parçacığı hızlı bir şekilde bulmanıza ve yönetmenize yardımcı olacaktır.

Bundan sonra, aşağıdaki özel kodu ‘Kod Önizleme’ kutusuna kopyalayıp yapıştırın.

Bu kod, ziyaretçinizin aradığı anahtar kelimeleri bularak çalışır. Ardından, bu anahtar kelimeleri renkli bir arka plan ekleyen özel bir etikete sarar.

// Highlight terms in titles
add_filter('the_title', 'highlight_search_terms_in_title', 10, 2);

// Highlight terms in excerpts
add_filter('the_excerpt', 'highlight_search_terms_in_excerpt');

// Optional: Highlight terms in content (if you're using the_content() in search results)
add_filter('the_content', 'highlight_search_terms_in_excerpt');

// Common highlight logic
function highlight_search_terms($text) {
    if (!is_admin() && is_search() && is_main_query()) {
        $search_query = get_search_query();

        // Output the CSS only once
        if (!defined('HIGHLIGHT_SEARCH_TERM_CSS')) {
            define('HIGHLIGHT_SEARCH_TERM_CSS', true);
            add_action('wp_head', function () {
                echo '<style>
                    strong.search-excerpt {
                        background-color: yellow;
                        color: black;
                        font-weight: bold;
                        padding: 0 2px;
                        border-radius: 2px;
                    }
                </style>';
            });
        }

        if (!empty($search_query)) {
            $keys = preg_split('/\s+/', $search_query);
            foreach ($keys as $key) {
                if (!empty($key)) {
                    $text = preg_replace('/(' . preg_quote($key, '/') . ')/iu', '<strong class="search-excerpt">$1</strong>', $text);
                }
            }
        }
    }

    return $text;
}

// Apply highlight logic to title and excerpt/content
function highlight_search_terms_in_title($title, $post_id) {
    return highlight_search_terms($title);
}

function highlight_search_terms_in_excerpt($excerpt) {
    return highlight_search_terms($excerpt);
}

Kodu yapıştırdıktan sonra, stil bölümünü bulmak için kod parçacığının aşağısına kaydırın. Bunu echo '<style> ... </style>'; bloğunun içinde göreceksiniz. Değiştirmek isteyeceğiniz belirli satır şudur:

                        background-color: yellow;

Varsayılan olarak, eklenti vurgulanan terimin arka plan rengini sarı, metni ise siyah olarak ayarlar. Ancak bu satırı düzenleyerek bunu kolayca özelleştirebilirsiniz.

Tercih ettiğiniz herhangi bir rengin onaltılık koduyla sarı kelimesini değiştirmeniz yeterlidir. Örneğin, vurguyu açık maviye değiştirmek için #aeeffc kullanabilirsiniz. Sonundaki noktalı virgülü eklemeyi unutmayın!

Sitenizin geri kalanıyla güzelce uyum sağlaması için markanızın stiline uygun bir arka plan ve metin rengi seçmenizi öneririm.

Vurgu kutusunun görünümünü ince ayarlamak için bu bölümde yazı tipi kalınlığını, kenarlık yuvarlaklığını ve dolgusunu da ayarlayabilirsiniz.

Stil ile memnun kaldığınızda, yukarı kaydırın, anahtarı 'Etkin Değil'den 'Etkin'e getirin ve ayarlarınızı kaydetmek için 'Parçacığı Kaydet' düğmesine tıklayın.

Sitenizde zaten bir arama formu varsa, kod parçacığı hemen çalışmaya başlayacak ve arama terimlerini otomatik olarak vurgulayacaktır.

Henüz bir arama formu eklemediyseniz, WordPress'e nasıl arama formu eklenir hakkındaki eğitimimizi takip edebilirsiniz.

Son olarak, web sitenizi ziyaret edin, hızlı bir arama yapın ve yeni vurgulanan terimlerinizi uygulamada göreceksiniz.

Bonus: Canlı Ajax Araması ile Aramanızı Daha Hızlı Hale Getirin 🚀

Arama terimi vurgulamasını ekledikten sonra, ziyaretçiler yazdıkça sonuçları göstererek işleri bir adım daha ileri götürmek isteyebilirsiniz.

Buna canlı Ajax araması denir ve Google'ın otomatik tamamlama özelliği gibi çalışır. Sayfa yenilemesi gerekmeden anında öneriler sunar.

Sitenizi daha hızlı ve daha etkileşimli hale getirmenin harika bir yoludur. Ziyaretçiler aradıklarını neredeyse anında bulabilirler, bu da etkileşimi artıracaktır.

Bunu ayarlamak için, premium SearchWP aracıyla harika çalışan SearchWP Live Ajax Lite Search eklentisini öneririm.

Ücretsizdir, çoğu WordPress temasıyla sorunsuz çalışır ve her şeyi otomatik olarak halleder. Kapsamlı bir şekilde test ettim ve her zaman daha iyi, daha hızlı bir arama deneyimi sunuyor.

Eklentiyi diğer WordPress eklentileri gibi yükleyin, etkinleştirin ve ardından SearchWP ayarlarında canlı aramayı etkinleştirin.

Arama formunu herhangi bir yazıya, sayfaya, kenar çubuğuna veya widget alanına kolayca ekleyebilirsiniz.

Başlamak için yardıma mı ihtiyacınız var? WordPress sitenize canlı Ajax araması nasıl eklenir hakkındaki tam eğitimimize göz atın.

WordPress'te Arama Terimlerini Vurgulama Hakkında Sıkça Sorulan Sorular

İşte WordPress'te arama terimlerini vurgulama hakkında sıkça sorduğum bazı sorular:

AJAX veya canlı arama sonuçlarında terimleri vurgulayabilir miyim?

Evet. SearchWP'yi SearchWP Live Ajax Search eklentisiyle birlikte kullanırsanız, vurgulanan terimler canlı açılır sonuçlarda otomatik olarak görünür. Sayfa yenilemesi gerekmez.

Farklı bir canlı arama eklentisi veya özel bir AJAX kurulumu kullanıyorsanız, vurgulamayı etkinleştirmek için arama sonuçları şablonunuza manuel olarak CSS sınıfları eklemeniz gerekebilir.

Bu vurgulama özellikleri performansı veya site hızını etkiler mi?

Hayır, arama terimlerini vurgulamanın site performansı üzerinde ihmal edilebilir bir etkisi vardır. Hem SearchWP yöntemi hem de özel kod yöntemi ön uçta (istemci tarafında) çalışır ve çok hafiftir.

Sunucu yükünü veya veritabanı sorgu sürelerini artırmazlar. Ancak, belirli temanızla doğru şekilde görüntülendiğinden emin olmak için yeni özellikleri her zaman önce bir hazırlık sitesinde test etmenizi öneririm.

Özel gönderi türleri veya WooCommerce ile arama terimi vurgulama çalışacak mı?

Evet. SearchWP, özel gönderi türleri, WooCommerce ürünleri ve hatta ürün stok kodları için vurgulamayı etkinleştirmenize olanak tanır. Hangi içerik türlerinin indeksleneceği ve vurgulanacağı üzerinde tam kontrol sağlar.

Özel kod yöntemi (Yöntem 2), temanız sonuçları görüntülemek için the_title() ve the_excerpt() gibi standart WordPress fonksiyonlarını kullandığı sürece özel gönderi türleri için de çalışır.

Umarım bu makale, WordPress'te arama terimlerini sonuçlarda nasıl kolayca vurgulayacağınızı öğrenmenize yardımcı olmuştur. Ayrıca akıllı bir WooCommerce ürün araması nasıl yapılır hakkındaki nihai kılavuzumuza ve WordPress sitenize sesli arama özelliği ekleme eğitimimize de bakmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.