नेटिव इन-ऐप संदेश बनाएं

नेटिव इन-ऐप्स रेडी-मेड लेआउट का उपयोग करते हैं जिन्हें Pushwoosh SDK सीधे डिवाइस पर रेंडर करता है, बजाय उस HTML पेज के जिसे एक कस्टम इन-ऐप लोड करता है। इससे वे तेजी से लोड होते हैं और अधिक सहजता से एनिमेट होते हैं, और आपको इसे बनाने के लिए डिज़ाइन या डेवलपमेंट कौशल की आवश्यकता नहीं होती है।

जब आप जल्दी से कोई प्रमोशन, रिमाइंडर, या फीचर घोषणा लॉन्च करना चाहते हैं और पूरी तरह से कस्टम लेआउट आवश्यक नहीं है, तो नेटिव इन-ऐप का उपयोग करें। यदि आपको डिज़ाइन पर पूर्ण नियंत्रण की आवश्यकता है, तो इसके बजाय एक HTML-आधारित इन-ऐप बनाएं।

पूर्वापेक्षाएँ

डेवलपर सहायता की आवश्यकता है

आप बिना किसी कोड परिवर्तन के कंट्रोल पैनल में एक नेटिव इन-ऐप टेम्प्लेट बना सकते हैं। लेकिन उपयोगकर्ता इसे तभी देखते हैं जब उनका ऐप Pushwoosh SDK का इतना नया संस्करण चला रहा हो जो इसे रेंडर कर सके। लॉन्च करने से पहले अपनी डेवलपमेंट टीम से जांच लें।

नेटिव इन-ऐप टेम्प्लेट बनाने से पहले, सुनिश्चित करें:

• Pushwoosh SDK आपके ऐप में एकीकृत है ताकि इन-ऐप संदेश दिखाई दे सकें। और जानें
• आपका ऐप modal, fullscreen, और stories के लिए iOS SDK 7.2.0+ या Android SDK 6.10.0+ चलाता है। Sheet, carousel, और banner के लिए iOS SDK 7.2.1+ या Android SDK 6.10.1+ की आवश्यकता है। Video अभी के लिए केवल iOS पर उपलब्ध है।

एक नेटिव इन-ऐप टेम्प्लेट बनाएं

1. Content → In-apps पर जाएं।
2. Create in-app पर क्लिक करें।
3. एक टेम्प्लेट नाम दर्ज करें।
4. Create native rich media चुनें।
5. DISPLAY TYPE में, एक डिस्प्ले प्रकार चुनें: modal, fullscreen, stories, sheet, carousel, banner, या video।
6. Create in-app पर क्लिक करें।

संपादक दाईं ओर एक लाइव मोबाइल प्रीव्यू और बाईं ओर टेम्प्लेट फ़ील्ड के साथ खुलता है, जो Content, Config, और Actions में समूहीकृत हैं। आप प्रत्येक समूह में जो देखते हैं वह आपके द्वारा चुने गए डिस्प्ले प्रकार पर निर्भर करता है।

डिस्प्ले प्रकार को कॉन्फ़िगर करें

सावधानी

संपादक के शीर्ष पर Display type ड्रॉपडाउन आपको किसी भी समय प्रकार बदलने की सुविधा देता है, लेकिन बदलने से नीचे के सभी Content, Config, और Actions फ़ील्ड नए प्रकार के लिए उनके डिफ़ॉल्ट पर रीसेट हो जाते हैं। सामग्री केवल तभी भरें जब आपने एक प्रकार तय कर लिया हो।

Modal

एक केंद्रित कार्ड, जिसे वैकल्पिक रूप से एक मंद पृष्ठभूमि पर दिखाया जाता है।

1. Content के तहत, एक शीर्षक और संदेश जोड़ें, प्रत्येक अपने टेक्स्ट रंग के साथ, साथ ही एक वैकल्पिक छवि। एक छवि जोड़ें देखें।
2. Config के तहत, कार्ड की पृष्ठभूमि का रंग सेट करें। यह आपके टेक्स्ट और छवि के पीछे कार्ड को भरता है।
3. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता बिना बटन टैप किए इन-ऐप को खारिज कर सकें, तो Close button चालू करें।
4. कार्ड के पीछे स्क्रीन को गहरा करने और अपने संदेश पर ध्यान केंद्रित रखने के लिए Dim background चालू करें।
5. Actions के तहत, एक या अधिक बटन जोड़ें। बटन कॉन्फ़िगर करें देखें।

Fullscreen

एक एज-टू-एज कवर छवि जिसके ऊपर टेक्स्ट और बटन होते हैं। बाएं पैनल पर इन फ़ील्ड को भरें:

1. Content के तहत, एक कवर छवि जोड़ें, साथ ही एक शीर्षक और संदेश, प्रत्येक अपने टेक्स्ट रंग के साथ। एक छवि जोड़ें देखें।
2. Config के तहत, कवर का रंग सेट करें। यह तब दिखाई देता है जब कवर छवि लोड हो रही होती है, या यदि आप छवि को खाली छोड़ देते हैं तो यह अपने आप दिखाई देता है।
3. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता बिना बटन टैप किए इन-ऐप को खारिज कर सकें, तो Close button चालू करें।
4. Actions के तहत, एक या अधिक बटन जोड़ें। बटन कॉन्फ़िगर करें देखें।

Stories

शीर्ष पर प्रगति बार के साथ पूर्ण-स्क्रीन स्लाइड्स का एक क्रम, सोशल मीडिया स्टोरीज़ के समान। प्रत्येक स्लाइड Content के तहत अपनी स्वयं की Stories प्रविष्टि है।

1. पहली स्लाइड की Image, Title, और Message (प्रत्येक अपने टेक्स्ट रंग के साथ) भरें। एक छवि जोड़ें देखें।
2. Seconds को सेट करें कि स्लाइड आगे बढ़ने से पहले स्क्रीन पर कितनी देर तक रहती है। डिफ़ॉल्ट 5 है। 1 से 30 तक का मान दर्ज करें। इस सीमा के बाहर के मान एक सत्यापन त्रुटि के साथ Save को ब्लॉक करते हैं।
3. वैकल्पिक रूप से, स्लाइड के अंदर Add पर क्लिक करें ताकि इसे अपना CTA बटन दिया जा सके। बटन कॉन्फ़िगर करें देखें।

4. एक और स्लाइड जोड़ने के लिए अंतिम स्लाइड के नीचे Add पर क्लिक करें, फिर उसके लिए चरण 1-3 दोहराएं।
5. Config के तहत, यदि आप चाहते हैं कि अंतिम स्लाइड समाप्त होने के बाद कहानी पहली स्लाइड से फिर से शुरू हो, तो Loop चालू करें।
6. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता सभी स्लाइड्स के चलने से पहले बाहर निकल सकें, तो Close button चालू करें।

उपयोगकर्ता के लिए तैयार कहानी कैसी दिखती है इसका उदाहरण

Sheet

एक बॉटम शीट जो स्क्रीन के निचले किनारे से ऊपर की ओर स्लाइड करती है। शीर्ष पर एक हैंडल उपयोगकर्ताओं को इसे खारिज करने के लिए नीचे खींचने की सुविधा देता है।

बाएं पैनल पर इन फ़ील्ड को भरें:

1. Content के तहत, एक शीर्षक और संदेश जोड़ें, प्रत्येक अपने टेक्स्ट रंग के साथ, साथ ही एक वैकल्पिक छवि। एक छवि जोड़ें देखें।
2. Config के तहत, शीट की पृष्ठभूमि का रंग सेट करें। यह आपके टेक्स्ट और छवि के पीछे पैनल को भरता है।
3. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता बिना बटन टैप किए शीट को खारिज कर सकें, तो Close button चालू करें।
4. Actions के तहत, एक या अधिक बटन जोड़ें। बटन कॉन्फ़िगर करें देखें।

Carousel

एक पूर्ण-स्क्रीन संदेश जिसमें कई कार्ड होते हैं जिन्हें उपयोगकर्ता स्वाइप करते हैं। नीचे डॉट्स दिखाते हैं कि कौन सा कार्ड सक्रिय है। Content के तहत, प्रत्येक कार्ड एक अलग Cards प्रविष्टि है।

1. पहले कार्ड की Image, Title, और Message (प्रत्येक अपने टेक्स्ट रंग के साथ) भरें। एक छवि जोड़ें देखें।
2. कार्ड के लिए Action सेट करें। जब उपयोगकर्ता कार्ड पर टैप करता है तो इन-ऐप को खारिज करने के लिए close चुनें, या एक लिंक खोलने के लिए url चुनें (बटन कॉन्फ़िगर करें के समान विकल्प)।
3. एक और कार्ड जोड़ने के लिए अंतिम कार्ड के नीचे Add पर क्लिक करें, फिर उसके लिए चरण 1-2 दोहराएं।
4. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता बिना कार्ड टैप किए कैरोसेल छोड़ सकें, तो Close button चालू करें।

सावधानी

यदि आप Close button बंद कर देते हैं और प्रत्येक कार्ड की Action को url पर सेट करते हैं, तो उपयोगकर्ता के पास कैरोसेल को खारिज करने के लिए कोई ऑन-स्क्रीन नियंत्रण नहीं होता है। एक टैप हमेशा इसे बंद करने के बजाय एक लिंक खोलता है।

Banner

एक कॉम्पैक्ट बार जो स्क्रीन के ऊपरी या निचले किनारे पर पिन किया गया है, उन संदेशों के लिए जो पूरे UI को ब्लॉक नहीं करना चाहिए।

1. Content के तहत, एक शीर्षक और संदेश जोड़ें, प्रत्येक अपने टेक्स्ट रंग के साथ, साथ ही एक वैकल्पिक छोटी छवि। एक छवि जोड़ें देखें।
2. Config के तहत, बैनर को अपनी इच्छित स्क्रीन के किनारे पर पिन करने के लिए Position को top या bottom पर सेट करें।
3. उतने सेकंड के बाद बैनर को स्वचालित रूप से बंद करने के लिए Auto-dismiss, sec सेट करें। जब तक उपयोगकर्ता इसे खारिज नहीं करता, तब तक बैनर को रखने के लिए इसे खाली छोड़ दें।
4. बार के लिए पृष्ठभूमि का रंग सेट करें।
5. यदि आप बैनर पर एक ✕ नियंत्रण चाहते हैं तो Close button चालू करें।
6. Actions के तहत, Action को close या url पर सेट करें। बैनर में अलग बटन नहीं होते हैं। बैनर पर कहीं भी टैप करने से यह क्रिया चलती है। close और url व्यवहार के लिए बटन कॉन्फ़िगर करें देखें।

सावधानी

यदि आप Close button बंद कर देते हैं, Action को url पर सेट करते हैं, और Auto-dismiss को खाली छोड़ देते हैं, तो बैनर बिना खारिज करने के तरीके के स्क्रीन पर बना रहता है। एक टैप हमेशा इसे बंद करने के बजाय लिंक खोलता है।

Video

एक HLS स्ट्रीमिंग लिंक (.m3u8) या एक सीधी .mp4 फ़ाइल के लिए एक पूर्ण-स्क्रीन प्लेयर, जिसके ऊपर एक वैकल्पिक शीर्षक, संदेश और बटन होते हैं।

नोट

वीडियो अभी के लिए केवल iOS पर उपलब्ध है। Android पर, इस डिस्प्ले प्रकार का उपयोग करने वाला एक टेम्प्लेट रेंडर नहीं होता है। विवरण के लिए प्लेटफ़ॉर्म समर्थन देखें।

1. Content के तहत, Video URL (आवश्यक) को एक .m3u8 या .mp4 फ़ाइल के लिए एक पूर्ण HTTPS लिंक पर सेट करें। वैकल्पिक रूप से, प्लेबैक शुरू होने से पहले दिखाई जाने वाली एक Poster छवि, और यदि वीडियो नहीं चल सकता है तो दिखाई जाने वाली एक Fallback image जोड़ें।
2. एक शीर्षक और संदेश जोड़ें, प्रत्येक अपने टेक्स्ट रंग के साथ।
3. Config के तहत, वीडियो समाप्त होने के बाद उसे फिर से शुरू करने के लिए Loop चालू करें।
4. ध्वनि बंद के साथ प्लेबैक शुरू करने के लिए Muted चालू करें।
5. यदि आप एक ✕ नियंत्रण चाहते हैं ताकि उपयोगकर्ता वीडियो समाप्त होने की प्रतीक्षा किए बिना इन-ऐप को खारिज कर सकें, तो Close button चालू करें।
6. Actions के तहत, एक या अधिक बटन जोड़ें। बटन कॉन्फ़िगर करें देखें।

टेक्स्ट फ़ील्ड कॉन्फ़िगर करें

टेक्स्ट फ़ील्ड मल्टी-लाइन टेक्स्ट का समर्थन नहीं करते हैं। यदि आप Enter दबाते हैं, तो संपादक एक लाइन ब्रेक दिखा सकता है, लेकिन Pushwoosh इसके बजाय एक स्पेस बचाता है। डिवाइस पर, टेक्स्ट एक लाइन के रूप में दिखाई देता है।

एक इमोजी जोड़ने के लिए, फ़ील्ड टूलबार के बगल में Emoji पर क्लिक करें। इमोजी सादे टेक्स्ट के समान टेक्स्ट फ़ील्ड में समर्थित हैं। यह देखने के लिए लाइव प्रीव्यू देखें कि वे लेआउट पर कैसे दिखते हैं।

गतिशील सामग्री जोड़ें

प्रत्येक टेक्स्ट फ़ील्ड टैग और User ID के साथ वैयक्तिकरण का समर्थन करता है।

1. फ़ील्ड टूलबार के बगल में Personalization पर क्लिक करें।
2. Tag के तहत, एक टैग या User ID चुनें।
3. एक प्रारूप संशोधक चुनें (उदाहरण के लिए, CapitalizeFirst या regular)।
4. वैकल्पिक रूप से, एक Default Tag Value दर्ज करें।
5. Insert पर क्लिक करें।

डाला गया टैग फ़ील्ड में एक चिप के रूप में दिखाई देता है। आप Insert पर क्लिक करने से पहले टैग, संशोधक और डिफ़ॉल्ट को बदल सकते हैं। वैयक्तिकरण Dynamic content के समान टैग, संशोधक और डिफ़ॉल्ट का उपयोग करता है।

टिप

सशर्त तर्क के लिए (उदाहरण के लिए, यह टेक्स्ट केवल तभी दिखाएं जब कोई टैग किसी विशिष्ट मान के बराबर हो), सीधे फ़ील्ड में Liquid syntax टाइप करें।

जब आप Save पर क्लिक करते हैं, तो Pushwoosh प्रत्येक टेक्स्ट फ़ील्ड में गतिशील सामग्री और Liquid की जाँच करता है। यदि कोई फ़ील्ड पार्स नहीं होती है (उदाहरण के लिए, एक बंद नहीं किया गया {% if %} टैग), तो Save ब्लॉक हो जाता है और एक Dynamic content contains errors टोस्ट टूटे हुए फ़ील्ड और भाषा का नाम बताता है। इसे वहां ठीक करें, फिर Save पर फिर से क्लिक करें।

नोट

Save पर Liquid जाँच सिंटैक्स त्रुटियों को पकड़ती है जैसे कि एक बंद नहीं किया गया टैग। यह अभी भी अपूर्ण अभिव्यक्तियों को पास कर सकता है जो केवल संदेश भेजे जाने पर विफल होती हैं। यदि आप एक साधारण टैग से परे कुछ भी उपयोग करते हैं तो अपने आप को एक परीक्षण भेजें।

बटन कॉन्फ़िगर करें

Modal, fullscreen, प्रत्येक stories स्लाइड, sheet, और video समान बटन फ़ील्ड का उपयोग करते हैं:

• Button text और उसका रंग।
• Background, Border color, और Border radius।
• Action: चुनें कि जब उपयोगकर्ता बटन पर टैप करता है तो क्या होता है:
  • close: इन-ऐप को खारिज करता है।
  • url: आपके द्वारा दिखाई देने वाले फ़ील्ड में दर्ज किए गए लिंक को खोलता है। एक वेब पता (उदाहरण के लिए, https://example.com) या अपने ऐप में एक डीप लिंक (उदाहरण के लिए, myapp://product/123) का उपयोग करें।

एक और बटन जोड़ने के लिए Add पर क्लिक करें, या इसे हटाने के लिए एक बटन पर × पर क्लिक करें।

सावधानी

यदि आप Close button बंद कर देते हैं और कोई बटन भी नहीं जोड़ते हैं, तो उपयोगकर्ता के पास इन-ऐप को खारिज करने के लिए कोई ऑन-स्क्रीन नियंत्रण नहीं होता है।

एक छवि जोड़ें

प्रत्येक छवि फ़ील्ड (छवि, कवर छवि, और प्रत्येक कार्ड या स्लाइड की छवि) एक ही तरह से काम करती है। एक होस्ट की गई छवि URL को सीधे फ़ील्ड में पेस्ट करें, या Media store खोलने के लिए इसके बगल में Choose from Media storage पर क्लिक करें और एक छवि चुनें जिसे आपने पहले ही अपलोड कर दिया है। Media store से एक छवि चुनने से फ़ील्ड में वर्तमान में जो भी URL है वह बदल जाता है।

स्थानीयकरण जोड़ें

डिफ़ॉल्ट रूप से, एक नेटिव इन-ऐप में एक भाषा होती है। और जोड़ने के लिए:

नोट

यहां भाषा चयनकर्ता केवल उन प्लेटफार्मों पर उपकरणों की गणना करता है जो इन-ऐप सामग्री को रेंडर करते हैं। उपयोगकर्ता-स्तरीय टैग के माध्यम से सेट किए गए भाषा मान किसी डिवाइस प्लेटफ़ॉर्म से बंधे नहीं होते हैं, इसलिए वे यहां दिखाई नहीं देते हैं।

1. शीर्ष बार में भाषा चयनकर्ता के बगल में + पर क्लिक करें।
2. जोड़ने के लिए भाषाएं चुनें और Apply पर क्लिक करें।

3. भाषाओं के बीच स्विच करने और प्रत्येक के लिए टेक्स्ट फ़ील्ड भरने के लिए शीर्ष बार में भाषा चयनकर्ता का उपयोग करें।

नोट

जब आप एक भाषा जोड़ते हैं, तो Pushwoosh डिफ़ॉल्ट भाषा की सामग्री को उसमें कॉपी करता है: टेक्स्ट, छवियां, और बटन लेबल। उस भाषा पर स्विच करें और इनमें से किसी भी फ़ील्ड को स्वतंत्र रूप से संपादित करें।

टेम्प्लेट सहेजें

अपने परिवर्तनों को बनाए रखने के लिए शीर्ष दाईं ओर Save पर क्लिक करें।

टेम्प्लेट फिर आपके अन्य इन-ऐप टेम्प्लेट के साथ Content → In-apps में दिखाई देता है।

इसे एक अभियान में उपयोग करें

एक नेटिव इन-ऐप टेम्प्लेट आपके अन्य इन-ऐप टेम्प्लेट के साथ टेम्प्लेट पिकर में दिखाई देता है।

आप इसका उपयोग कर सकते हैं:

• एक तत्काल इन-ऐप भेजें
• एक Customer Journey में एक इन-ऐप चरण जोड़ें
• जब उपयोगकर्ता एक पुश पर टैप करता है तो एक इन-ऐप खोलें

नोट

डिलीवरी सेटिंग्स, जैसे कि प्रारंभ और समाप्ति तिथियां और आवृत्ति कैपिंग, किसी भी अन्य इन-ऐप के लिए उसी तरह काम करती हैं और इस संपादक का हिस्सा नहीं हैं।