WordPress'e Tarayıcı Sekmesi Bildirimlerini Kolayca Ekleme

Tarayıcı sekmesi bildirimleri, ziyaretçileri sessizce meşgul tutan ve geri dönmelerini teşvik eden basit ama etkili özelliklerden biridir.

Örneğin, WPForms, kullanıcıları sekmeleri değiştirdiklerinde satın alma işlemlerini tamamlamaları için nazikçe hatırlatmak üzere bunu kullanır. Bu, ince, müdahaleci olmayan bir yöntemdir ve sitenizdeki dönüşüm oranlarını artırabilir.

Bu kılavuzda, bu dikkat çekici sekme bildirimlerini WordPress sitenize nasıl kolayca ekleyeceğinizi göstereceğiz. 🙌

Deneyince, ziyaretçileri odaklanmış tutmak ve geri gelmelerini sağlamak için neden bu kadar kullanışlı bir araç olduğunu göreceksiniz.

Tarayıcı Sekmesi Bildirimi Nedir?

Tarayıcı sekmesi bildirimi, ziyaretçilerimizden biri tarayıcısında farklı bir siteye bakarken web sitenizin sekmesinde görünen bir mesajdır.

WordPress web sitenize bir tarayıcı sekmesi bildirim özelliği ekleyerek, kullanıcılar sayfanızdan ayrılmak için başka bir sekme açtıkları anda dikkatlerini çekebilirsiniz.

Örneğin, web sitenizin favicon'unu değiştirebilir, onu canlandırabilir, özel bir mesaj yazabilir veya sekmeyi yanıp söndürebilirsiniz.

Bir çevrimiçi mağazanız varsa, tarayıcı sekmesi bildirimleri size gerçekten yardımcı olabilir. Bu bildirimler dikkati dağılmış müşterileri geri getirecek, sepeti terk etme oranlarını düşürecek ve müşteri etkileşimini artıracaktır.

Bu özelliği kullanarak, müşterilerinizi sepeti terk etme konusunda uyarabilir veya dikkatlerini sitenize geri çekerlerse indirim bile sunabilirsiniz.

İşte bir tarayıcı sekmesi bildirimi örneği.

Bununla birlikte, WordPress'e farklı türde tarayıcı sekmesi bildirimlerini nasıl kolayca ekleyeceğinizi göstereceğiz.

Seçtiğiniz yönteme atlamak için aşağıdaki bağlantıları kullanabilirsiniz:

• Tarayıcı Sekmesi Bildirimleri Eklemek İçin WPCode'u Yükleyin
• Tür 1: Tarayıcı Sekmesi Bildirimi Olarak Yeni Güncellemeleri Gösterme
• Tür 2: Tarayıcı Sekmesi Bildirimi Olarak Favicon Değiştirme
• Tür 3: Tarayıcı Sekmesi Bildirimi Olarak Site Başlığını Değiştirme
• Bonus: WordPress Sitenize Web Anlık Bildirimleri Ekleyin
• Tarayıcı Sekmesi Bildirimleri Ekleme Hakkında Sıkça Sorulan Sorular

Tarayıcı Sekmesi Bildirimleri Eklemek İçin WPCode'u Yükleyin

Sitenize tarayıcı sekmesi bildirimlerini WordPress'e özel kod ekleyerek kolayca ekleyebilirsiniz. Genellikle temanızın functions.php dosyasını düzenlemeniz gerekir, ancak küçük bir hata bile web sitenizi bozabilir.

Bu yüzden piyasadaki en iyi WordPress kod parçacığı eklentisi olan WPCode kullanmanızı öneriyoruz.

Özel kodu sitenize eklemenin en güvenli ve en kolay yolu olduğunu gördük. Ayrıntılar için WPCode incelememize bakın.

İlk olarak, WPCode eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair adım adım kılavuzumuza bakabilirsiniz.

Etkinleştirdikten sonra, WordPress yönetici kenar çubuğunuzdan Kod Parçacıkları » + Parçacık Ekle sayfasına gidin.

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

Ardından ekrandaki seçenekler listesinden kod türünü seçin.

Bundan sonra, 'Özel Kod Parçacığı Oluştur' sayfasına yönlendirileceksiniz.

Hangi tür tarayıcı sekmesi bildirimini kullanırsanız kullanın, kodu buraya gireceksiniz.

Tür 1: Tarayıcı Sekmesi Bildirimi Olarak Yeni Güncellemeleri Gösterme

Sitenizdeki etkinliği simüle ederek kullanıcıların dikkatini çekmek istiyorsanız bu yöntem harikadır. Sekme başlığında bir sayı görünecek ve yeni bir mesaj veya güncelleme kullanıcının beklediği izlenimini verecektir.

Örneğin, Facebook ve LinkedIn gibi siteler okunmamış bildirimleri göstermek için bunu kullanır. Kullanıcıları kaçırdıklarını görmek için sekmeye geri dönmeye teşvik etmek için bu psikolojik tetikleyiciyi kullanabilirsiniz.

‘Özel Kod Parçacığı Oluştur’ sayfasındayken, kod parçacığınıza bir ad vermeniz gerekir. Kodu tanımlamanıza yardımcı olacak herhangi bir şey seçebilirsiniz.

Ardından menüden ‘Kod Türü’ olarak ‘JavaScript Snippet’i seçin.

Ardından, tek yapmanız gereken aşağıdaki kod parçasını kopyalayıp 'Kod Önizleme' kutusuna yapıştırmak:

let count = 0;
const title = document.title;
function changeTitle() {
    count++;
    var newTitle = '(' + count + ') ' + title;
    document.title = newTitle;
}
function newUpdate() {
    const update = setInterval(changeTitle, 2000);
}
document.addEventListener('DOMContentLoaded', newUpdate );

Bu kod, kullanıcı farklı bir sekmeye geçtiğinde tarayıcıya saymaya başlamasını söyler. Sitenize geri döndükleri anda başlık normale döner.

Bunu yaptıktan sonra, 'Ekleme' bölümüne aşağı kaydırın. Sadece 'Otomatik Ekle' seçeneğini seçin ve konumu 'Site Geneli Başlığı' olarak bırakın.

Ardından, sayfanın en üstüne geri kaydırın ve 'Etkin Değil' anahtarını 'Etkin' olarak değiştirin.

Son olarak, ayarlarınızı kaydetmek için ‘Snippet Kaydet’ düğmesine tıklayın.

Bu işlem bittiğinde, özel kod parçacığınız sitenize eklenecek ve çalışmaya başlayacaktır.

Tür 2: Tarayıcı Sekmesi Bildirimi Olarak Favicon Değiştirme

Bu yöntemle, kullanıcılar başka bir sekmeye geçtiğinde tarayıcı sekmesinde farklı bir favicon göstereceksiniz. Sitenizin hala açık olduğunu onlara hatırlatmanın ince bir yoludur.

Bunu yapmak için, kullanıcı sayfadan ayrıldığında resmi değiştiren bir JavaScript parçacığı kullanacağız.

Öncelikle, Kod Parçacıkları » + Parçacık Ekle sayfasına gidin ve '+ Özel Parçacık Ekle'ye tıklayın.

Oluşturma sayfasında, menüden 'Kod Türü' olarak 'JavaScript Parçacığı'nı seçin.

Bunu yaptıktan sonra, aşağıdaki kodu 'Kod Önizleme' kutusuna kopyalayıp yapıştırın:

<link id="favicon" rel="icon" href="https://example.com/wp-content/uploads/2022/10/favicon.png"/>

<script>var iconNew = 'https://example.com/wp-content/uploads/2022/10/favicon-notification.png';

function changeFavicon() {
    document.getElementById('favicon').href = iconNew;
}
function faviconUpdate() {
    const update = setInterval(changeFavicon, 3000);
    setTimeout(function() { 
        clearInterval( update ); 
    }, 3100);
}

Kodu yapıştırdıktan sonra, Favicon satırındaki URL'yi kendi bildirim resminizin bağlantısıyla değiştirmeniz gerekir.

Yeni favicon'unuzu WordPress medya kitaplığına yükleyin ve dosya adını kopyalayın (benim örneğimde daisy.jpeg). Ardından, kodu tırnak işaretlerinin içine yapıştırın.

Bunu yaptıktan sonra, ‘Ekleme’ bölümüne aşağı kaydırın.

Kodu her sayfaya otomatik olarak yerleştirmek istiyorsanız 'Otomatik Ekle' seçeneğini tercih edebilirsiniz.

Belirli sayfalarda favicon'u değiştirmek için ‘Kısa Kod’ seçeneğini belirleyin ve kenar çubuğu widget'ları veya içerik düzenleyicisinin alt kısmı gibi kısa kod etkin alanlardan birine yapıştırın.

Ardından, sayfanın en üstüne gidin ve sağ üst köşedeki anahtarı ‘Etkin Değil’ konumundan ‘Etkin’ konumuna getirin ve ardından ‘Kod Parçasını Kaydet’ düğmesine tıklayın.

Bundan sonra, favicon'unuz bir tarayıcı sekmesi bildirimi olarak değişmeye başlayacaktır.

Tür 3: Tarayıcı Sekmesi Bildirimi Olarak Site Başlığını Değiştirme

Ziyaretçilerinizin dikkatini yeniden çekmek için site başlığını değiştirmek istiyorsanız bu yöntem tam size göre.

Bu kod parçacığını kullanarak, kullanıcılar tarayıcıda başka bir sekmeye geçtiğinde site başlığınız dikkat çekici bir mesaj gösterecek şekilde değişecektir.

Site başlığınızı tarayıcı sekmesi bildirimine değiştirmek için WPCode eklentisini kullanacağız.

'Özel Parçacık Oluştur' sayfasına gitmek için yönetici kenar çubuğundan Kod Parçacıkları » + Parçacık Ekle sayfasına gidin.

Burada, 'Özel Kodunuzu Ekleyin (Yeni Parçacık)' seçeneğinin altındaki '+ Özel Parçacık Ekle'ye tıklayın.

Ardından, ekrandaki seçenekler listesinden kod türü olarak 'JavaScript Snippet'i seçmeniz gerekir.

Şimdi 'Özel Parçacık Oluştur' sayfasındasınız, kod parçacığınız için bir başlık girerek başlayın.

Bu, kodun ne işe yaradığını hatırlamanıza yardımcı olacak herhangi bir şey olabilir.

Ardından, tek yapmanız gereken aşağıdaki kod parçasını kopyalayıp 'Kod Önizleme' kutusuna yapıştırmak:

function changeTitleOnBlur() {
	var timer     = null;
	var	title     = document.title;
	var altTitle  = 'Return to this page!';
	window.onblur = function() {
		timer = window.setInterval( function() {
			document.title = altTitle === document.title ? title : altTitle;
		}, 1500 );
	}
	window.onfocus = function() {
		document.title = title;
		clearInterval(timer);
	}
}

changeTitleOnBlur();

Kodu yapıştırdıktan sonra, onu düzenleyebilir ve tarayıcı sekmenizde görüntülemek istediğiniz herhangi bir mesajı koda yazabilirsiniz.

İstediğiniz mesajı yazmak için, var altTitle = 'Bu sayfaya geri dön!'; satırına gidin ve yer tutucu metni tarayıcı sekmesi bildiriminiz için mesajla değiştirin.

Ardından, ‘Ekleme’ bölümüne aşağı kaydırın ve tarayıcı sekmesi bildirimlerinizi her sayfada etkinleştirmek için ‘Otomatik Ekle’ modunu seçin.

Ancak, göz alıcı mesajınızın yalnızca belirli sayfalarda olmasını istiyorsanız, ‘Kısa Kod’ seçeneğini tercih edebilirsiniz.

Örneğin, web sitenizdeki sepet terkini azaltmak için bu kodu yalnızca 'Sepete Ekle' sayfasına eklemek isteyebilirsiniz.

Durum buysa, Kısa Kod seçeneğini seçebilirsiniz.

Bundan sonra, 'Konum' seçeneğine aşağı kaydırın ve yanındaki açılır menüye tıklayın.

Buradan, 'Site Geneli Altbilgi' seçeneğini seçin.

Son olarak, sayfanın en üstüne geri kaydırın ve anahtarı ‘Etkin Değil’ konumundan ‘Etkin’ konumuna getirin.

Ardından, ayarlarınızı kaydetmek için 'Kod Parçasını Kaydet' düğmesine tıklayın.

Hepsi bu kadar! Artık tarayıcı sekmesi bildiriminiz, sitenizden ayrılan kullanıcılara uyarı verecektir.

Bonus: WordPress Sitenize Web Anlık Bildirimleri Ekleyin

Tarayıcı sekmesi bildirimleri etkilidir, ancak tek bir büyük sınırlamaları vardır. Yalnızca kullanıcı sekmenizi açık tutarsa çalışırlar.

Web push bildirimleri ile web sitenizi kapattıktan sonra bile ziyaretçilere ulaşmanız gerekir. Sekme uyarılarının aksine, bunlar kullanıcının cihazına veya tarayıcısına doğrudan gönderilen aktif mesajlardır.

Bunu ayarlamanın en kolay yolu PushEngage ile. Pazardaki en iyi push bildirim yazılımıdır.

PushEngage, yeni blog gönderileri, fiyat düşüşleri veya terk edilmiş sepetler için otomatik güncellemeler göndermenizi sağlar. Biz de WPBeginner'da abonelerimizi yeni eğitimlerden haberdar etmek için kullanıyoruz ve bu bizim için geri dönüş trafiğinin en üst kaynağıdır.

Bu konuda daha fazla bilgi edinmek için tam PushEngage incelememize bakın.

A/B testi, otomatik push, kullanıcı segmentasyonu ve akıllı katılım hatırlatıcıları gibi güçlü özellikler içerir. Bu araçlar, geri gelmeye devam eden sadık bir kitle oluşturmanıza yardımcı olur.

Daha fazla ayrıntı için, WordPress'e web push bildirimlerinin nasıl ekleneceğine ilişkin başlangıç kılavuzumuza bakın.

Tarayıcı Sekmesi Bildirimleri Ekleme Hakkında Sıkça Sorulan Sorular

İşte okuyucularımızın WordPress'te tarayıcı sekmesi bildirimleri eklemekle ilgili sıkça sorduğu bazı sorular:

WordPress'te bir duyuru çubuğunu nasıl eklerim?

Bir duyuru çubuğu eklemenin en kolay yolu, OptinMonster gibi bir eklenti kullanmaktır. Bu, sitenizin üst veya alt kısmında duran ve kod yazmadan güncellemeleri, satışları veya uyarıları görüntüleyen yapışkan çubuklar oluşturmanıza olanak tanır.

WordPress'te uyarı çubuğu oluşturma konusunda eğitimimize bakın.

WordPress'e nasıl bildirim eklerim?

Site içi bildirimler eklemek için PushEngage veya WPCode gibi bir eklenti kullanabilirsiniz.

PushEngage, tarayıcılara gönderilen aktif web anlık bildirimlerini yönetirken, WPCode bu kılavuzdakilere benzer pasif sekme başlığı uyarıları için özel betikler eklemenize olanak tanır.

Web tarayıcısı bildirimleri nasıl etkinleştirilir?

PushEngage gibi bir web anlık bildirim hizmetine kaydolmanız gerekir.

WordPress eklentilerini kurduktan sonra, siteniz ziyaretçilerden, web sitenizde olmasalar bile tarayıcılarına/cihazlarına uyarı gönderme izni istemek için otomatik olarak sorabilir.

WordPress'e nasıl bir bildirim eklerim?

WordPress düzenleyicisinde arka plan rengi olan varsayılan Grup bloğunu kullanarak bir gönderiye basit bir bildirim ekleyebilirsiniz.

Her sayfada görünen site çapında bildirimler için, kayan bir çubuk eklentisi kullanmanızı öneririz, örneğin OptinMonster veya SeedProd.

WordPress'e nasıl bir açılır banner eklenir?

Açılır banner eklemek için en iyi araç OptinMonster'dır.

Kullanıcı davranışlarına (sayfada geçirilen süre veya çıkış niyeti gibi) göre tetiklenen ışık kutuları, kaydırarak açılan pencereler ve kayan banner'lar oluşturmak için sürükle ve bırak oluşturucu sağlar.

Başlamak için, WordPress'e açılır pencere ekleme konusundaki eğitimimize bakın.

Umarım bu makale, WordPress'te tarayıcı sekmesi bildirimlerinin nasıl ekleneceğini öğrenmenize yardımcı olmuştur. Ayrıca WordPress'te simgeli özellik kutularının nasıl ekleneceğine dair eğitimimize bakmak ve mobil uyumlu bir WordPress sitesi oluşturma yolları listemizi kontrol etmek 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.