Kurulum rehberi

Alert’lerinizidakikalar içinde kurun

OBS ve Streamlabs için eksiksiz FrameWork Alerts rehberi — videolu ve yazılı adımlarla.

Streamlabs + OBS

Her FrameWork alert’i aynı şekilde kurulur: OBS’te bir Browser Source, Streamlabs’te bir Text Over Image varyasyonu ve indirdiğiniz paketteki Custom Fields. Videoyu bir kez izleyin ya da aşağıdaki yazılı adımları izleyin.

Videolu tam anlatım İngilizce · Streamlabs + OBS

Bölüm 1

OBS’te Browser Source kurulumu

  1. Alert platformunuzu (Streamlabs) açın ve Alerts bölümüne gidin.

  2. Kurmak istediğiniz alert türünü seçin (Followers, Subscribers, Donations vb.) ve tam ekran alert için kullanmadığınız alert türlerinin işaretini kaldırın.

  3. Platformun verdiği Widget URL’sini kopyalayın.

  4. OBS’i açın → Yeni bir kaynak ekleyin → Browser Source’u seçin → Anlaşılır bir ad verin (ör. Alerts - Fullscreen).

  5. Kopyaladığınız URL’yi URL alanına yapıştırın.

  6. Width ve Height değerlerini tuval çözünürlüğünüze eşitleyin:

    • Bunu OBS’te Settings → Video → Base (Canvas) Resolution altında bulabilirsiniz
  7. “Shutdown source when not visible” seçeneğini etkinleştirin.

  8. OK’e tıklayın ve bu Browser Source’un kaynak listenizin en üstünde, diğer tüm kaynakların üzerinde olduğundan emin olun.

Bölüm 2

Alert varyasyonunu yapılandırma

  1. Alert platformunuzda seçtiğiniz alert türü için yeni bir varyasyon ekleyin ve ona anlaşılır bir ad verin.

  2. Layout’u “Text Over Image” olarak ayarlayın (alert’in doğru görünmesi için bu zorunludur).

  3. Image bölümünde alert dosyanızı sürükleyip bırakın, ardından Select’e tıklayın.

  4. Alert Duration’ı ayarlayın:

    • Alert’i oynatın ve toplam süresini not edin.
    • Bu süreden 1 saniye çıkarın ve sonucu Alert Duration alanına girin.
    • Örnek: Alert 35 saniyeyse → 34 saniye girin.
  5. Sound → Varsayılan olarak bırakın (dokunmayın).

  6. Alert Animation → Fade In / Fade Out olarak ayarlayın (önerilir).

  7. Text Animation ve Font → Zevkinize göre özelleştirin.

Bölüm 3

Özel HTML / CSS / JS ekleme

  1. Custom HTML/CSS anahtarını etkinleştirin.

  2. Alert klasörünüze dönün ve “Custom Fields — For Full Screen Alerts” adlı dosyayı açın.

  3. Her dosyayı kopyalayıp platformdaki ilgili bölüme yapıştırın:

    • HTML → HTML sekmesine
    • CSS → CSS sekmesine
    • JS → JS sekmesine
  4. “Custom Fields” → “Edit Custom Fields”e tıklayın → Custom Fields dosyasını yapıştırın.

  5. “Update Custom Fields”e, ardından Save’e (sağ altta) tıklayın.

Bölüm 4

Custom Fields ile ince ayar

Kaydettikten sonra şu seçeneklere erişmek için Custom Fields’ı açın:

Text DelayAlert’i oynatın ve ekran karardığında durdurun. Zaman damgasını not edin — her alert’in sonunda ~4 saniyelik siyah ekran vardır. Tam o zaman damgasını buraya girin.
Text Horizontal PositionMetnin sağ/sol konumunu belirler. Ortalamak için 50 yapın.
Text Vertical PositionMetnin yukarı/aşağı konumunu belirler. Ortalamak için 50 yapın.
Alert VolumeVarsayılan olarak önceden optimize edilmiştir. Gerekirse düşürün.

Her şey yapılandırıldıktan sonra doğru çalıştığını doğrulamak için Test Alert’e tıklayın.

Bölüm 5

Aynı bölümdeki küçük alert’leri düzeltme

Aynı kategoride hem tam ekran hem küçük bir alert’iniz varsa (ör. tam ekran Follower alert’i + küçük Follower alert’i), aynı widget bağlantısını paylaştıkları için küçük alert yanlış ölçeklenmiş görünür. Düzeltmek için şu adımları izleyin.

  1. Küçük alert varyasyonunu açın.

  2. Custom HTML/CSS’i etkinleştirin.

  3. Alert klasörünüze dönün ve “Custom Fields — For Non-Full-Screen Alerts” dosyasını açın.

  4. Her dosyayı kopyalayıp doğru sekmeye yapıştırın:

    • HTML → HTML sekmesi
    • CSS → CSS sekmesi
    • JS → JS sekmesi
  5. “Edit Custom Fields”e tıklayın → Custom Fields dosyasını yapıştırın → “Update Custom Fields”e tıklayın → Save’e tıklayın.

  6. Bu varyasyonun Custom Fields’ını açın ve şunları ayarlayın:

    • Horizontal Position: 50 yapın
    • Vertical Position: 25 yapın
    • Image Size: alert’in ne kadar büyük görüneceğini belirler
    • Alert Layout: Custom Fields’taki değil, platformun kendi düzen seçeneğini kullanarak Image Above olarak ayarlayın

Alert’leriniz artık tamamen kuruldu ve yapılandırıldı. Herhangi bir sorunla karşılaşırsanız lütfen sitemizden bir destek talebi gönderin, en kısa sürede size dönelim.

Bir adımda mı takıldınız?

Platformunuzu ve hangi adımda olduğunuzu yazarak bir destek talebi gönderin; stüdyo size adım adım yol göstersin.

Destek talebi gönder