Ana içeriğe atla

​
Genel Bakış

OneSignal’ın sürükle ve bırak editörü, modüler blok öğeleri kullanarak uygulama içi mesajlar oluşturmanıza olanak tanır — kodlama gerekmez. İşaretleme tercih ediyorsanız, Design In-App Messages with HTML’e bakın.

IAM sürükle ve bırak editörü

​
Ön koşullar

  • OneSignal SDK’nın uygulamanızda yüklü ve başlatılmış olması.
  • En son özellikler için önerilen SDK’lar: iOS 5.1.5+, Android 5.1.9+. Belirli özellik minimumlarını aşağıda görün.
  • Performanslı bir CDN’de barındırılan (self-hosted ise önerilir) ve uygun boyutlandırılmış resimler.

​
Mesaj türleri (Düzen)

Mesajın ekranda nasıl göründüğü:
Mesaj TürüAçıklama
TopYukarıdan aşağı kayar. İnce duyurular ve onaylar için iyidir.
CenterMerkezden genişler ve ekranı kısmen doldurur. Çoğu kullanım senaryosu için dengeli.
BottomAlttan yukarı kayar. Snackbar’lar ve onay istemleri için harika.
FullEkranı dolduracak şekilde genişler. Kenar boşluklarıyla veya olmadan kullanın. Çok ekranlı akışlar için bir Carousel ekleyin.

Oluşturabileceğiniz In-App türlerini gösteren görsel.

​
Carousel’ler

Carousel’ler çok ekranlı akışlar oluşturmanıza olanak tanır—onboarding, özellik turları veya çok adımlı teklifler. Full mesaj türünü seçin ve Create Carousel düğmesine tıklayın. 10’a kadar kart (ekran) ekleyebilirsiniz. Her kart, özelleştirilebilir blokların herhangi bir kombinasyonuna sahip olabilir.

Carousel örneği

​
Yönlendirme desteği

Uygulama içi mesajlar hem dikey hem de yatay modları destekler.

Dikey ve yatay yönlendirmeleri gösteren görsel.

​
Bloklar ve düzen ayarları

Her şey bir Background bloğunun (tuval) içinde yer alır. Dış boşluk için Background üzerinde Padding kullanın; öğeler arasındaki boşluk için bireysel bloklarda Margin kullanın. Tutarlı düzenler için hızlı kurallar
  1. Mesaj kenarlarından mesafeyi kontrol etmek için Padding kullanın.
  2. Blokları ayırmak için Margin kullanın (örneğin, başlık → düğme).
  3. Aynı tarafta büyük padding ve margin’leri istiflemekten kaçının.
  4. Mutlak konumlandırma yerine merkezli, akış tabanlı düzenleri tercih edin.
  5. Yayınlamadan önce her zaman farklı cihazlarda Önizleyin.

Background bloğu (tuval)

​
Text

Başlıklar, açıklamalar veya kişiselleştirilmiş metinler için kullanın.
  • Duyarlı boyutlandırma: Yüzdelerle genişlik/yükseklik.
  • Fontlar: Google Fonts.
  • Biçimlendirme: Kalın, italik, altı çizili.
  • Renk: Hex veya RGBA (şeffaflığı destekler).
  • Hizalama: Sol, orta, sağ.
  • Boyut: Ayarlanabilir font boyutu.
Gelişmiş
  • Margin’ler: Bloğun etrafındaki boşluk.
İpuçları

Text bloğu

​
Image

Özellikleri veya teklifleri göstermek için resimler ekleyin. Formatlar: .jpg, .png, .gif (maks 5MB). Performans için barındırılan URL’leri tercih edin.
  • En boy oranları: 16:9, 4:3, 3:2 önerilir.
  • Tıklama eylemi: İsteğe bağlı (link, deep link, etiket, sonuç, istem).
Gelişmiş:
  • Tıklamada kapat
  • Margin’ler: Bloğun etrafındaki boşluk.
İpuçları
  • Etiketlere göre sunucunuzdaki farklı resimlere referans verin. Dynamic URLs’e bakın.
    • Örnek resim URL’si: https://example.com/images/{{ tag_key }}.png

Image bloğu

​
Button

Gezinme, geri bildirim veya izin istemleri gibi eylemleri tetikleyin.
  • Text ve font: CTA metnini ve stilini özelleştirin.
  • Renk ve boyut: Düğme görsellerini özelleştirin.
  • Resim: İsteğe bağlı ikon/resim.
  • Köşe yarıçapı: Yuvarlama ayarlayın.
  • Tıklama eylemi: Etiketleme, sonuçlar, istemler ve deep link’leri destekler.
Gelişmiş
  • Tıklamada kapat
  • Margin’ler: Bloğun etrafındaki boşluk.
  • Kenarlıklar ve gölgeler: Tamamen özelleştirilebilir.
İpuçları
  • Düğme metnini veya link’leri veri etiketleriyle kişiselleştirin.
  • Arka plan opaklığı = 0 ayarlayarak yalnızca resimli bir düğme yapın.
  • Birincil CTA’ları kaldırmak için ince gölgeler (düşük opaklık, yüksek bulanıklık) kullanın.

Button bloğu

​
Close button

Kapatma (X) simgesinin görünürlüğünü ve stilini kontrol edin.
  • Toggle: Etkinleştir/devre dışı bırak.
  • Özel ikon: .jpg, .png, .svg, .gif. Önerilen boyut: 10x10px.
  • Tıklama eylemi: İsteğe bağlı.
Gelişmiş
  • Margin’ler: Bloğun etrafındaki boşluk.
İpuçları
  • Close düğmesini devre dışı bırakırsanız, kullanıcıların çıkmasına izin vermek için bir kapatma eylemi veya kapatma süresi ayarladığınızdan emin olun.
  • Kullanıcıların tüm kartlarda ilerlemesini istediğinizde carousel’ler için yararlıdır.

Close düğmesi

​
Background

Düzeniniz ve markanız için temeli ayarlayın.
  • Resim desteği: .jpg, .png, .gif
  • Renk: RGBA’yı destekler
  • Tıklama eylemi: İsteğe bağlı
Gelişmiş
  • Padding: İçerik ve mesaj kenarları arasındaki boşluk (varsayılan 24px)
  • Tıklamada kapat

Background editörü

​
Kişiselleştirme ve yerelleştirme

Uygulama içini kullanıcı başına kişiselleştirmek için veri etiketlerini kullanın. Yerelleştirme için, daha fazla ayrıntı için Multi-langauge messages’a bakın.

​
SSS

​
Tam ekran uygulama içi nasıl yapabilirim? Hangi SDK sürümüne ihtiyacım var?

Kenar boşlukları olmadan bir uygulama içi mesaj oluşturmak için:
  • iOS SDK 3.9.0+
  • Android SDK 4.6.3+
Daha eski SDK’larda olan kullanıcılar mesajı yine de görecekler, ancak varsayılan kenar boşluklarıyla. Üst/alt banner’lar için overlay’leri kaldırmak için SDK’larınızı güncelleyin ve aşağıdakileri yapılandırın: iOS 5.1.5+ 
<key>OneSignal_in_app_message_hide_drop_shadow</key>
<true/>
<key>OneSignal_in_app_message_hide_gray_overlay</key>
<true/>
Android 5.1.9+ 
<meta-data android:name="com.onesignal.inAppMessageHideGrayOverlay" android:value="true"/>
<meta-data android:name="com.onesignal.inAppMessageHideDropShadow" android:value="true"/>