Özel Kod Kurulumu

Bu Özel Kod kurulumunu yalnızca gelişmiş yapılandırma veya programatik kontrole ihtiyacınız varsa kullanın. Çoğu kullanıcı için şunları öneriyoruz:

Ön Koşullar

Bir OneSignal hesabı
HTTPS’li bir web sitesi (web push bildirimleri için gereklidir)
Web sitenizin HTML’sini değiştirme ve sunucunuza dosya yükleme erişimi
Temel JavaScript anlayışı (yardımcı ama gerekli değil)

OneSignal Uygulamanızı Oluşturma

OneSignal’deki ilk uygulamanız değilse, New App/Website’e tıklayın. Aksi takdirde, doğrudan kuruluma geçeceksiniz.

İlk uygulama oluşturma ekranını gösteren OneSignal kontrol paneli

Uygulamanıza açıklayıcı bir isim verin (web sitesi adınızla eşleşmesi önerilir), ardından platform listesinden Web’i seçin. Next: Configure Your Platform’a tıklayın. Not: Uygulamanızın ayarlarından daha sonra ek platformlar (iOS, Android, vb.) ekleyebilirsiniz.

Web seçeneği vurgulanmış platform seçim ekranı

1. Entegrasyonu Seçin

Custom Code’u seçin. Bu, JavaScript SDK’mızı kullanarak istemler, zamanlama ve diğer ayarlar üzerinde tam programatik kontrol sağlar. Custom Code ne zaman seçilir:

Bildirim istemlerini özelleştirmeye ihtiyaç varsa
Kullanıcıların ne zaman isteme alacağını kontrol etmek istiyorsanız
Gelişmiş segmentasyon veya hedefleme gerekliyse
Tek sayfalı bir uygulama (SPA) oluşturuyorsanız

Custom Code seçili web yapılandırma seçenekleri

2. Site Kurulumu

Temel site bilgilerinizi yapılandırın. Bu ayarlar, bildirimlerin kullanıcılara nasıl görüneceğini etkiler.

Gerekli alanlar vurgulanmış site kurulum formu

Alan	Açıklama	Gereksinimler
SITE NAME	Push bildirimlerinde gösterilen görünen ad	Kısa ve tanınabilir tutun
SITE URL	Tam web sitesi URL’niz	`https://` içermeli ve tam olarak eşleşmeli (kullanılıyorsa `www` ekleyin)
AUTO RESUBSCRIBE	Geri dönen kullanıcıları otomatik olarak yeniden abone eder	Önerilir: Abone sayısını korumaya yardımcı olur
DEFAULT ICON URL	İstemler ve bildirimler için ikon	Kare `256x256` piksel, `.png/.jpg/.gif` formatı, HTTPS URL gerekli

Yaygın Tuzaklar:

Site URL’si tam olarak eşleşmelidir (www ile veya olmadan)
İkonlar HTTPS üzerinden sunulmalıdır
Yerel test için, Local Testing Setup’a bakın

3. Gelişmiş Push Ayarları

Safari Web Push Sertifikası (İsteğe Bağlı)

OneSignal, Safari sertifikalarını otomatik olarak ücretsiz sağlar. Bunu yalnızca kullanmanız gereken mevcut Safari Web Push sertifikalarınız varsa etkinleştirin.

Mevcut sertifikalar için Safari sertifika yükleme seçeneği

Etkinleştirilirse, Safari Web .p12 Push Certificate’ınızı yükleyin ve parolayı girin. Devam etmek için Save’e tıklayın.

4. Service Worker Dosyalarını Yükleyin

OneSignal Service Worker, push bildirimlerinin çalışması için gereklidir. İki seçeneğiniz var:

Seçenek 1: Dosyayı Manuel Olarak Oluşturun (Önerilir)

OneSignalSDKWorker.js adlı yeni bir dosya Oluşturun

Bu tek kod satırını Ekleyin:

importScripts("https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.sw.js");

Dosyayı web sitenizin root dizinine Yükleyin

Seçenek 2: İndirin ve Yükleyin

OneSignal SDK dosyalarını İndirin
İndirmeyi Açın
OneSignalSDKWorker.js’yi sunucunuza Yükleyin

Dosya Barındırma Gereksinimleri

Varsayılan Konum: Service worker https://yoursite.com/OneSignalSDKWorker.js adresinde erişilebilir olmalıdır Özel Konum: Dosyayı bir alt klasöre yerleştirmeniz gerekiyorsa, ayrıntılı talimatlar için OneSignal Service Worker Kılavuzumuza bakın.

Özel bir konuma mı ihtiyacınız var? Alt klasör yerleştirmesi veya başka bir push sağlayıcısından geçiş için, OneSignal Service Worker Kılavuzumuzu takip edin.

Service worker dosyası indirme arayüzü

Eski Kurulum Uyarısı: Siteniz 22 Kasım 2021’den önce kurulduysa ve şu anda iki service worker dosyası (OneSignalSDKWorker.js ve OneSignalSDKUpdaterWorker.js) kullanıyorsanız, service worker sorunlarını önlemek için her iki dosyayı da barındırmaya devam edin.Yeni kurulumlar yalnızca tek OneSignalSDKWorker.js dosyası gerektirir.

5. Web Sitenize Kod Ekleyin

Temel İmplementasyon

Bu kodu web sitenizin <head> bölümüne ekleyin. YOUR_ONESIGNAL_APP_ID’yi OneSignal kontrol panelindeki gerçek Uygulama ID’nizle değiştirin.

<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
<script>
  window.OneSignalDeferred = window.OneSignalDeferred || [];
  OneSignalDeferred.push(function(OneSignal) {
    OneSignal.init({
      appId: "YOUR_ONESIGNAL_APP_ID",
      safari_web_id: "YOUR_SAFARI_WEB_ID", // Yalnızca özel Safari sertifikası kullanıyorsanız gereklidir
      notifyButton: {
        enable: true, // OneSignal zil simgesini gösterir
      },
    });
  });
</script>

Framework’e Özgü Kurulum

Bir JavaScript framework’ü kullanıyorsanız, bu özel kılavuzları takip edin:

Kod Kurulumundan Sonraki Adımlar

SDK’yı Başlatın: Yukarıdaki kod temel başlatmayı işler
İsteme Yapılandırın: Kullanıcıların ne zaman ve nasıl isteme alacağını ayarlayın - İzin İstekleri’ne bakın
Özel Mantık Ekleyin: Gelişmiş özellikler için Web SDK Referansı’nı kullanın

Yaygın Entegrasyon Noktaları:

Kullanıcı davranışına dayalı özel istem zamanlaması
Segmentasyon ve kullanıcı etiketleme
Etkinlik takibi ve analitik
Farklı bildirim stratejilerini A/B testi

Kurulumunuzu Test Edin

Kurulumu Doğrulayın

Web sitenizi ziyaret edin - OneSignal zil simgesini görmelisiniz (etkinse)
Tarayıcının yerel izin istemini tetiklemek için zile tıklayın
Bildirimlere Abone olun
Herhangi bir JavaScript hatası için tarayıcı konsolunu kontrol edin

Test Bildirimi Gönderin

Test aboneliğinizi bulun: Test Aboneliklerini Bul ve Ayarla’yı takip edin
Test push’u gönderin: Kendinize Push Bildirimi gönderme kılavuzumuzu kullanın
Farklı tarayıcılar ve cihazlar genelinde teslimatı doğrulayın

Yaygın Sorunları Giderme

Service Worker Sorunları:

OneSignalSDKWorker.js’nin doğru URL’de erişilebilir olduğundan emin olun
Dosyanın doğru import ifadesini içerdiğini kontrol edin
HTTPS’nin düzgün çalıştığını doğrulayın

Zil Simgesi Görünmüyor:

JavaScript kodunun <head> bölümünde olduğunu onaylayın
Tarayıcı konsolunda hataları kontrol edin
Uygulama ID’nizin doğru olduğunu doğrulayın

Bildirimler Alınmıyor:

Bir incognito/özel tarayıcı penceresinde test edin
Bildirimlerin tarayıcı ayarlarında etkin olduğundan emin olun
Sitenizin HTTPS üzerinden sunulduğunu kontrol edin

Yardıma mı ihtiyacınız var? Sorunla karşılaşırsanız, Web Push Sorun Giderme Kılavuzumuzu kontrol edin veya yardım için support@onesignal.com’a başvurun.

Sırada Ne Var

Başarılı kurulumdan sonra, bu gelişmiş özellikleri düşünün:

Hedefli mesajlaşma için Kitle Segmentasyonu
Bildirim stratejilerinizi A/B Testi
Performansı takip etmek için Analitik ve İçgörüler

Geliştirici Belgeleri

Mobil SDK'lar

Web SDK'lar

Gerçek Zamanlı Etkinlikler

Masaüstü & Watch Kurulumu

Eski SDK referansı

Özel Kod Kurulumu

Ön Koşullar