Ramiz TAYFUR

Sans-serif

Aa

Serif

Aa

Font büyüklüğü

+ -

Satır yüksekliği

+ -
Gündüz
Gece
Gün Batımı

Tarayıcıda Farklı Sekmeye Geçince Site Başlığı Değiştirme

Selamlar! Bugün sizlere e-ticaret sitenize ya da WordPress blogunuza renk katacak küçük ama sevimli bir detaydan bahsetmek ve nasıl uygulayacağınız konusunda bilgi vermek istiyorum. Uzun süredir büyük markalar bu ufak detayı kullanıyor. Bende yönettiğim projelerde bu ufak detaya yer veriyorum. Kısaca belirtecek olursam “Tarayıcı sekme mesajı” dediğimiz bu detay kullanıcının sitenizi açtığında farklı bir sekmeye geçiş yaptığında sitenize geri gelmesini sağlayacak bir detay. Kullanıcı deneyimi açısında ufak ancak uygulayan kimseye zararı olmayan bir “Mesaj” içeriyor.

Bu işlem için wordpress’te eklentiler mevcut. Ancak ufak bir detay için eklenti kurmanıza gerek yok. Eklentide test ettim. Tarayıcıda geçiş yaptığında hemen gelmiyor mesaj. 2 saniye kadar bekletiyor. Bunun nedeni mesajı eklentiden çekecekte, tarayıcı başlığına eklenti içerisinde yazdığın mesajı getirecekte. Bla bla bla… Gelelim nasıl uygulanacağına. Öncelikle özel scriptlerde ve wordpress altyapısını kullanan bloglarda footer.php dosyasına </body> etiketinin hemen önüne eklemenizi tavsiye ederim. Header.php dosyasında </head> etiketi öncesinede ekleyebilirsiniz. Ancak footer.php dosyasına eklerseniz sitenizin açılış hızını etkilememesi açısından iyi olacaktır.

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js”></script> <script>$(function() { // Başlığı çekelim var pageTitle = $(“title”).text(); // Başlık değişiyor $(window).blur(function() { $(“title”).text(“:( Beni Unutma!”); }); // Geri geldiğinde eski başlığı yapalım $(window).focus(function() { $(“title”).text(pageTitle); }); }); </script>

Yukarıda kodu belirttiğim alana eklerseniz farklı sekmeye geçiş yaptığınızda sizin sitenizdede sekme mesajı çıkacaktır. Örnek olması adına blogumdan farklı bir sekmeye geçerek şirin detayı görebilirsiniz :). Sorun yaşarsanız yorum bölümüne sorularınızı bırakabilirsiniz.

6 Yorumlar

  • Selim
    16 Ekim 2018 at 10:08

    Süper çalıştı! Birkaç yerde daha görmüştüm benzer kodları ama kodun neresinde sorun vardı çözemedim olmamıştı. Ama tarif ettiğiniz gibi uyguladım oldu hocam çok teşekkürler.

  • Burak Göç
    20 Ekim 2018 at 16:43

    Bunu WM Aracı Blog’da paylaşmıştım. Sonra bir arkadaş eklentiyi çok beğenip WordPress eklentisi haline getirmişti. https://wmaraci.com/blog/sitenizi-yeni-sekmede-acip-uzaklasan-ziyaretcileri-geri-cekin-don-t-go-746 şuradaki yorumların arasında var. Bence eklentiye de içerikte yer ver Ramiz hocam. Kodla uğraşmak istemeyen kullanıcılar eklentiyle istediklerine ulaşabilirler.

    • Ramiz
      23 Ekim 2018 at 16:39

      Selam Burak, Önerin için teşekkür ederim. Aslında kod daha pratik bir çözüm gibi geldi ama eklentiyide inceleyip yazıya dahil etmeye çalışırım. Sendede mevcut sanırım bu özellik emoji olayı güzel olmuş.

      • Burak Göç
        25 Ekim 2018 at 16:56

        Evet, çok uzun süre önce bu kod parçacığına GitHub’da denk gelmiştim. Keşfettiğim gibi kullanmaya başladım.

        • Ramiz
          26 Ekim 2018 at 00:05

          Zaman aşımı biraz uzun geliyor. Sekmeler arası geçişte başlık değişmesi zaman alıyor. Emoji kaynaklı bir sorun olabilir diye düşünüyorum. Emoji nasıl ekledin eklenti ile kullandığın içinmi var emoji yoksa bi kod ilemi ekledin?

  • Mimarın günlüğü
    14 Kasım 2018 at 13:31

    Şu kod dosyalarıyla oynamayı öğrenmekten ziyade temayı – siteyi gümletmekten çok fazla korkuyorum.. yedek alarak denenebilir belki ama yine de çekiniyorum doğrusu 🙂

    Faydalı ve basit bir anlatım

Burak Göç için bir yanıt yazınYanıtı iptal et


Bu site, istenmeyenleri azaltmak için Akismet kullanıyor. Yorum verilerinizin nasıl işlendiği hakkında daha fazla bilgi edinin.