Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları

  • Onur YURT
  • iletisim@hazirsitekodlari.com
  • 57

    Makale

  • 3

    Yorum

  • 8

    Kategori

Webmaster adına tüm bilgi ve paylaşım platformudur.

Senin Kodun

Ana Sayfa / Html, Javascript / Farklı Sekmeye Geçtiğinde Diğer Sekmenin Title Değişmesi

Farklı Sekmeye Geçtiğinde Diğer Sekmenin Title Değişmesi

Sitenizdeki ziyaretçilerin farklı sekmeye geçtiğinde favicon ve title değiştirerek dikkat çekmenizi sağlayacak Do not Go JS kütüphanesinden bahsettik.

Bir makaleyi açıp birkaç cümle okuduktan sonra başka sekmeye mutlaka geçmişsinizdir. Bir ziyaretçinin dikkatini çekmek kolay olmayabilir. Bunun için Do not Go ile bir nebze dikkatini çekebilirsiniz.

Bu scripti sayfanıza ekleyerek, sayfanın şu anda görüntülenmemesi durumunda sitenizin favicon’unu ve sayfa başlığını otomatik olarak güncelleyebilirsiniz.

Canlı demoyu incelemek için buradan deneyebilirsiniz. Tek yapmanız gereken siteyi açtıktan sonra farklı bir sekmeye geçip bir kaç saniye beklemek. Birkaç saniye geçtikten sonra sitenin faviconu ve title kısmının değiştiğini göreceksiniz. Bence çok dikkat çekici olmuş.

Bu, JavaScript dinamik olarak çalışır. Yani kullanıcı sitenize tekrar geçtiğinde değişen favicon ve title eski halini alır. Tahmin edebileceğiniz gibi bu scripti kullanmak da çok basittir.

Bu scripti kullanmak için üç ayar yapmanız gerektirir:

  • Başlık – yeni sayfa başlığı
  • Favicon – yeni favicon URL
  • Zamanaşımı – kullanıcı farklı bir sekmeye geçtikten sonra favicon ve başlığın değişme süresi(saniye olarak)

Unutmayın, gereken tek değer başlıktır. Favicon’u aynı şekilde bırakabilir ve zamanaşımını tamamen atlamayı seçebilirsiniz, böylece başlık çubuğu anlık olarak değişir.

İşte scriptin nasıl çalıştığına dair kod örneği:

<script src="https://tiaanduplessis.github.io/dont-go/dont-go.js"></script>
    <script>
      dontGo({
        title: 'Beni Unuttun Ama?',
        faviconSrc: 'favicon.png',
        timeout: 2000
      })
</script>

Do not GO komut dosyasını kurmak daha kolay olamazdı. Npm, Bower ve Yarn vasıtasıyla edinilebilir ve aynı zamanda ana repodan çekilen GitHub CDN’de barındırılan dosyaları kullanabilirsiniz.

Bu eğlenceli komut dosyası, okuyucuları sitenize geri döndürmek ve sonuçta hemen çıkma oranlarını düşürmek için mükemmel bir yöntem olabilir. Daha fazla bilgi edinmek için, yalnızca ana GitHub repo’sunu ziyaret edin ve dokümantasyon gözden geçirin.

Bu makalede ziyaretçilerinizi sitenize geri döndürmek için kullanabileceğiniz, sitenizi yormayacak, ufak javascript kütüphanesi olan Do not Go ‘dan bahsettik. Bu eğlenceli script hakkındaki düşüncelerinizi yorum yaparak bizlerle paylaşabilirsiniz.

Yukarıdaki kod olmazsa bunu denersiniz !

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>$(function() {
var pageTitle = $("title").text();
$(window).blur(function() {
$("title").text("Beni Unuttun Ama?");
});
$(window).focus(function() {
$("title").text(pageTitle);
});
});
</script>

iyi kodlamalar.

BENZER KONULAR

HTML5’te Temel Elemanlar Ders#1
HTML5’te Temel Elemanlar Ders#1 DEVAMI
  • 15 Mayıs 2020 | 0 | 368
Html, Javascript | Kategorisine Ait Yazıların Daha Fazlası...

KONU HAKKINDA (Yorum Yapılmamış) | SENDE YORUM YAP DESTEK OL!

Yazı hakkında görüşlerinizi belirtmek istermisiniz?

BEN KİMİM?

Onur YURT

Web Developer And Coder

Merhaba arkadaşlar Adım Onur YÜRT Bursada doğdum ve yaşıyorum 2009 yılından itibaren web hayatına adım attım ve şuanda bulunduğum sayfayı açtım amaçım sizlere birşeyler öğretmek ve kazandırmak Web tasarım konusunda kendimi yeterince geliştirdiğime inanıyorum bu bilgileri zamanla siz değerli takipçilerime sunmak yeterince bildiğim kodlama diller Css3, Html5, Javascript ve Php dir.

POPULER KONULAR

Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları...