बिल्ट-इन एडिटर में इन-ऐप संदेश बनाएं

Pushwoosh के बिल्ट-इन एडिटर में बिना कोड लिखे एक इन-ऐप संदेश टेम्पलेट बनाएं। आपको कंटेंट ब्लॉक, छवियों, बटनों और व्यक्तिगत टेक्स्ट के साथ एक पुन: प्रयोज्य लेआउट मिलता है जिसे आप Customer Journey में, एक बार के इन-ऐप के रूप में, या पुश से दिखा सकते हैं।

नोट

शुरू करने से पहले, Pushwoosh SDK को एकीकृत करें ताकि आपके ऐप में इन-ऐप संदेश दिखाई दे सकें। और जानें

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

एक इन-ऐप टेम्पलेट एक पुन: प्रयोज्य डिज़ाइन है जिसे आप एक बार बनाते हैं और फिर अभियानों में उपयोगकर्ताओं को दिखाते हैं। आप एक कस्टम HTML ZIP अपलोड करके या इसे बिल्ट-इन एडिटर में बनाकर एक बना सकते हैं। यह लेख बिल्ट-इन एडिटर में स्क्रैच से एक टेम्पलेट बनाने को कवर करता है। किसी मौजूदा टेम्पलेट को अनुकूलित करने के लिए उन्हीं चरणों का पालन करें।

1. कंटेंट → इन-ऐप्स पर जाएं।
2. टेम्पलेट जोड़ें पर क्लिक करें।

3. एक टेम्पलेट नाम दर्ज करें।
4. टेम्पलेट बनाने का तरीका चुनें:
   • ZIP अपलोड करें: अपने HTML इन-ऐप संदेश के साथ एक ZIP फ़ाइल अपलोड करें।
   • नया टेम्पलेट बनाएं: बिल्ट-इन एडिटर में एक टेम्पलेट बनाएं।
5. नया टेम्पलेट बनाएं चुनें।
6. टेम्पलेट जोड़ें पर क्लिक करें।

एडिटर लेआउट को एक्सप्लोर करें

बिल्ट-इन एडिटर में चार क्षेत्र होते हैं। प्रत्येक का एक स्पष्ट काम है।

टॉप बार

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

कैनवास

संदेश को देखने के लिए कैनवास का उपयोग करें जैसा कि उपयोगकर्ता इसे देखेंगे और सीधे लेआउट पर टेक्स्ट, छवियों और बटनों को संपादित करने के लिए। एक खाली टेम्पलेट एक ब्लॉक से शुरू करें दिखाता है। कैनवास के ऊपर, एक फ़ोन/टैबलेट टॉगल पूर्वावलोकन चौड़ाई को स्विच करता है — यह आपके लेआउट को नहीं बदलता है, बस आप कितनी चौड़ी स्क्रीन पर इसका पूर्वावलोकन कर रहे हैं।

लेयर्स

लेयर्स पैनल आपके टेम्पलेट में प्रत्येक ब्लॉक को एक ट्री के रूप में सूचीबद्ध करता है, उसी क्रम में जैसे कैनवास पर। इसे बाएं किनारे से खोलें जब आप एक नेस्टेड ब्लॉक (उदाहरण के लिए, एक समूह के अंदर एक बटन) का चयन करना चाहते हैं या सामग्री के क्रम को बदलने के लिए पंक्तियों को खींचें।

दायां पैनल

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

टेम्पलेट बनाना शुरू करें

टेम्पलेट बनाने के बाद, एडिटर एक खाली कैनवास और दाईं ओर ब्लॉक्स टैब के साथ खुलता है।

1. ब्लॉक्स पैनल से एक ब्लॉक को कैनवास पर खींचें, या इसे जोड़ने के लिए पैनल में एक ब्लॉक पर क्लिक करें।
2. लेआउट तैयार होने तक उसी तरह ब्लॉक जोड़ते रहें।
3. जब आपको टेम्पलेट-व्यापी स्टाइलिंग की आवश्यकता हो तो सेटिंग्स टैब खोलें।

कंटेंट ब्लॉक जोड़ें

कंटेंट ब्लॉक बिल्ट-इन एडिटर में एक इन-ऐप टेम्पलेट के निर्माण खंड हैं। आप हेडिंग, टेक्स्ट, छवियों, बटनों और अन्य ब्लॉकों को एक लेआउट में जोड़ते हैं।

ब्लॉक्स टैब खोलें और कैनवास पर एक ब्लॉक खींचें, या इसे जोड़ने के लिए एक ब्लॉक पर क्लिक करें। उपलब्ध ब्लॉक:

• हेडिंग: संदेश में शीर्षक और छोटी सुर्खियाँ
• टेक्स्ट: बॉडी कॉपी और लंबे विवरण
• बटन: एक टैप करने योग्य कॉल टू एक्शन
• इमेज: मीडिया स्टोर, अपलोड, या URL से तस्वीरें
• डिवाइडर: एक रेखा जो अनुभागों को दृष्टिगत रूप से अलग करती है
• 2 कॉलम: दो बराबर कॉलम अगल-बगल
• 3 कॉलम: तीन बराबर कॉलम अगल-बगल
• 4 कॉलम: चार बराबर कॉलम अगल-बगल
• 33 / 67: दो कॉलम जहां बायां लगभग 33% चौड़ाई लेता है और दायां लगभग 67%
• 67 / 33: दो कॉलम जहां बायां लगभग 67% चौड़ाई लेता है और दायां लगभग 33%
• टाइमर: ऑफ़र और समय सीमा के लिए एक काउंटडाउन
• मेनू: लिंक की एक पंक्ति या कॉलम, जैसे नेविगेशन या संपर्क
• सोशल: आइकन जो आपके सोशल प्रोफाइल से लिंक होते हैं
• HTML: कस्टम HTML, जैसे एक फ़ॉर्म या एम्बेडेड वीडियो

हेडिंग और टेक्स्ट

हेडिंग और टेक्स्ट ब्लॉक उस कॉपी को रखते हैं जिसे उपयोगकर्ता इन-ऐप संदेश में पढ़ते हैं। कैनवास पर टेक्स्ट संपादित करें और इसे टूलबार के साथ प्रारूपित करें।

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

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

इमेज

एक इमेज ब्लॉक इन-ऐप टेम्पलेट में एक तस्वीर प्रदर्शित करता है। दाएं पैनल में इमेज सेटिंग्स खोलने के लिए इसे कैनवास पर चुनें।

• इमेज जोड़ें / इमेज बदलें: जब ब्लॉक खाली हो तो इमेज जोड़ें पर क्लिक करें, या जब कोई तस्वीर पहले से सेट हो तो इमेज बदलें पर क्लिक करें। आप एक फ़ाइल अपलोड कर सकते हैं या अपने मीडिया स्टोर से एक चुन सकते हैं।
• इमेज URL: इमेज के लिए एक होस्टेड लिंक पेस्ट करें।
• ऑल्ट टेक्स्ट: पहुंच के लिए इमेज का वर्णन करें।
• लिंक URL: जब इमेज टैप की जाती है तो एक वेबसाइट खोलें।
• लिंक लक्ष्य: लिंक को उसी टैब में या एक नए टैब में खोलें।
• फ़ाइल: इमेज जोड़ने के बाद, उपयोग में आने वाली फ़ाइल का पथ दिखाता है।

स्पेसिंग में, इमेज के चारों ओर जगह जोड़ने के लिए पैडिंग चालू करें। हर तरफ समान पैडिंग के लिए सभी तरफ का उपयोग करें, या प्रत्येक पक्ष को अलग से सेट करने के लिए अधिक विकल्प चालू करें।

बटन

एक बटन इन-ऐप संदेश में एक टैप करने योग्य कॉल टू एक्शन है। इसका उपयोग URL खोलने, कस्टम जावास्क्रिप्ट चलाने, या संदेश को बंद करने के लिए करें।

कैनवास पर इसके लेबल को संपादित करने के लिए बटन ब्लॉक पर क्लिक करें। फ़ॉन्ट आकार, टेक्स्ट रंग, बोल्ड, इटैलिक, अंडरलाइन और अलाइनमेंट बदलने के लिए टूलबार का उपयोग करें।

यह सेट करने के लिए कि उपयोगकर्ता द्वारा बटन टैप करने पर क्या होता है:

1. लिंक डालें/संपादित करें खोलने के लिए टूलबार में लिंक आइकन पर क्लिक करें।
2. एक एक्शन प्रकार चुनें।
3. उस एक्शन के लिए फ़ील्ड भरें (नीचे देखें)।
4. सहेजें पर क्लिक करें।

एक वेबसाइट खोलें

वेबसाइट खोलें जब उपयोगकर्ता बटन टैप करता है तो एक लिंक खोलता है। URL में पता दर्ज करें। आप क्या दर्ज कर सकते हैं:

• एक वेबसाइट: https://example.com
• एक ऐप लिंक जो आपके ऐप के अंदर एक स्क्रीन खोलता है: myapp://promo
• जावास्क्रिप्ट के बिना इन-ऐप बंद करें: pushwoosh://close

कस्टम जावास्क्रिप्ट चलाएं

कस्टम जावास्क्रिप्ट जब उपयोगकर्ता बटन टैप करता है तो कोड चलाता है। onClick फ़ील्ड में कोड दर्ज करें।

इसका उपयोग तब करें जब एक टैप को Pushwoosh में कुछ करना चाहिए, न कि केवल एक लिंक खोलना। ऐप में व्यक्ति अभी भी एक सामान्य बटन देखता है। वे टैग या ईवेंट नहीं देखते हैं। आप तय करते हैं कि स्क्रीन पर आगे क्या होता है: संदेश को खुला छोड़ दें, या इसे उसी onClick में बंद कर दें।

onClick में उपलब्ध मेथड्स

• pushwoosh.closeInApp(): इन-ऐप संदेश बंद करें। टैप के बाद संदेश को खुला रखने के लिए इसे छोड़ दें।
• pushwoosh.sendTags({...}): बाद के अभियानों के लिए मानों को डिवाइस टैग के रूप में सहेजें।
• pushwoosh.postEvent(...): एक कस्टम ईवेंट भेजें, उदाहरण के लिए एक Customer Journey शुरू करने के लिए।
• pushwoosh.getTags(...): वर्तमान टैग पढ़ें। कस्टम HTML में संदेश क्या दिखाता है, इसे बदलने के लिए उपयोगी है।
• pushwoosh.getCustomData(): इस इन-ऐप को खोलने वाले पुश से पास किए गए कस्टम डेटा को पढ़ें।

उदाहरण: उपयोगकर्ताओं को एक रुचि चुनने दें और इसे बाद के अभियानों के लिए सहेजें

1. टेक्स्ट या हेडिंग ब्लॉक में एक प्रश्न जोड़ें, उदाहरण के लिए: “आप किस खेल में रुचि रखते हैं?”
2. प्रत्येक विकल्प के लिए एक बटन जोड़ें, उदाहरण के लिए: योग और जिम।

3. प्रत्येक बटन के लिए एक्शन प्रकार को कस्टम जावास्क्रिप्ट पर सेट करें।
4. योग बटन के लिए, इसे onClick में पेस्ट करें:

pushwoosh.sendTags({ interest: "yoga" });
pushwoosh.closeInApp();

5. जिम बटन के लिए, इसे onClick में पेस्ट करें:

pushwoosh.sendTags({ interest: "gym" });
pushwoosh.closeInApp();

जब उपयोगकर्ता योग टैप करता है, तो Pushwoosh उनके डिवाइस पर interest टैग लिखता है और इन-ऐप बंद कर देता है। फिर आप उस उपयोगकर्ता को सेगमेंट या Customer Journey में लक्षित कर सकते हैं।

जावास्क्रिप्ट के साथ इन-ऐप्स कैसे बनाएं, इसके बारे में और जानें

डिवाइडर

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

सेटिंग्स पैनल में लाइन स्टाइल (सॉलिड, डैश्ड, डॉटेड), रंग, मोटाई, और चौड़ाई कॉन्फ़िगर करें।

HTML

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

उदाहरण

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

नोट

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

लीड फ़ॉर्म

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

HTML कोड

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; }
  h2 { font-size: 18px; margin-bottom: 8px; color: #222; }
  p { font-size: 14px; color: #666; margin-bottom: 20px; }
  input {
    width: 100%;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    box-sizing: border-box;
  }
  button {
    width: 100%;
    padding: 14px;
    background: #FF6B35;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
  }
  .thanks { display: none; text-align: center; padding: 40px 0; font-size: 18px; color: #333; }
</style>
</head>
<body>

<h2>Get your 20% discount</h2>
<p>Leave your name and email — we'll send the promo code right away.</p>

<div id="form">
  <input type="text" id="name" placeholder="Your name" />
  <input type="email" id="email" placeholder="Your email" />
  <button onclick="submit()">Send me the code</button>
</div>

<div class="thanks" id="thanks">
  🎉 Done! Check your inbox for the promo code.
</div>

<script>
function submit() {
  const name = document.getElementById('name').value.trim();
  const email = document.getElementById('email').value.trim();
  if (!name || !email) return;

  pushwoosh.sendTags({ name: name, email: email });
  pushwoosh.postEvent("promo_requested", { email: email });

  document.getElementById('form').style.display = 'none';
  document.getElementById('thanks').style.display = 'block';
  setTimeout(() => pushwoosh.closeInApp(), 3000);
}
</script>

</body>
</html>

सर्वेक्षण

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

HTML कोड

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; text-align: center; }
  h2 { font-size: 18px; margin-bottom: 6px; color: #222; }
  p { font-size: 13px; color: #888; margin-bottom: 20px; }
  .option {
    display: block;
    width: 100%;
    padding: 14px;
    margin-bottom: 10px;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
  }
  .option:hover { border-color: #FF6B35; background: #fff5f0; }
  .thanks { display: none; font-size: 17px; padding: 40px 0; color: #333; }
</style>
</head>
<body>

<h2>When do you prefer to work out?</h2>
<p>Help us schedule the best classes for you</p>

<button class="option" onclick="pick('morning')">☀️ Morning (6:00–10:00)</button>
<button class="option" onclick="pick('afternoon')">🌤️ Afternoon (12:00–15:00)</button>
<button class="option" onclick="pick('evening')">🌙 Evening (18:00–21:00)</button>
<button class="option" onclick="pick('weekend')">📅 Weekends only</button>

<div class="thanks" id="thanks">Got it! We'll send you the best schedule 💪</div>

<script>
function pick(time) {
  pushwoosh.sendTags({ preferred_time: time });
  pushwoosh.postEvent("schedule_survey_completed", { time: time });
  document.querySelector('h2').style.display = 'none';
  document.querySelector('p').style.display = 'none';
  document.querySelectorAll('.option').forEach(el => el.style.display = 'none');
  document.getElementById('thanks').style.display = 'block';
  setTimeout(() => pushwoosh.closeInApp(), 2000);
}
</script>

</body>
</html>

वीडियो

यह उदाहरण इन-ऐप संदेश में एक YouTube वीडियो एम्बेड करता है।

HTML कोड

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>In-App Video Example</title>
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
    text-align: center;
  }
  .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>
</head>
<body>

<h1>In-App Video Example</h1>

<div class="video-container">
       <iframe src="https://www.youtube.com/embed/TN1uyD2mONs?autoplay=1&mute=1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

</body>
</html>

मेनू

मेनू ब्लॉक कई क्लिक करने योग्य आइटम को एक पंक्ति या कॉलम में रखता है। इसका उपयोग नेविगेशन बार या कंपनी संपर्कों की सूची के लिए करें।

प्रत्येक मेनू आइटम के लिए, सेट करें:

• लेबल: वह टेक्स्ट जो उपयोगकर्ता देखते हैं
• URL: जहां आइटम खुलता है
• लक्ष्य: समान टैब या एक नया टैब

ब्लॉक सेटिंग्स में, आप यह भी सेट कर सकते हैं:

• दिशा: क्षैतिज या लंबवत
• संरेखण: बाएँ, केंद्र, या दाएँ
• विभाजक: आइटम के बीच एक वैकल्पिक विभाजक
• फ़ॉन्ट, आकार, वजन, अक्षर रिक्ति, और लिंक/टेक्स्ट रंग

सोशल

सोशल ब्लॉक सोशल मीडिया आइकन की एक पंक्ति प्रदर्शित करता है जो आपके प्रोफाइल से लिंक होते हैं। इसका उपयोग उपयोगकर्ताओं को इन-ऐप संदेश से फेसबुक, इंस्टाग्राम, एक्स और अन्य प्लेटफार्मों पर भेजने के लिए करें।

प्लेटफ़ॉर्म प्रविष्टियाँ जोड़ें, फिर संरेखण, आइकन आकार और आइकन के बीच की दूरी सेट करें।

काउंटडाउन टाइमर

टाइमर ब्लॉक इन-ऐप संदेश में एक काउंटडाउन है। इसका उपयोग सीमित समय के ऑफ़र, फ्लैश बिक्री और ईवेंट अनुस्मारक के लिए करें।

इसे सेट करने के लिए:

1. काउंटडाउन में, अंतिम तिथि और अंतिम समय सेट करें, फिर टाइमर लेबल के लिए समय क्षेत्र और भाषा चुनें।
2. अंकों के नीचे “दिन / घंटे / मिनट / सेकंड” कैप्शन दिखाने के लिए लेबल चालू करें, या केवल संख्याओं के लिए बंद करें।
3. दिखावट में, पृष्ठभूमि, अंकों का रंग, लेबल का रंग, और अंकों के लिए फ़ॉन्ट आकार (डिफ़ॉल्ट 40px) और लेबल (डिफ़ॉल्ट 16px) सेट करें।
4. आवश्यकतानुसार स्पेसिंग (पैडिंग) समायोजित करें।

कॉलम

कॉलम कैनवास को अगल-बगल के अनुभागों में विभाजित करते हैं ताकि आप सामग्री को एक पंक्ति में एक दूसरे के बगल में रख सकें।

इनमें से किसी एक ब्लॉक को कैनवास पर खींचें:

• 2 कॉलम: दो बराबर कॉलम
• 3 कॉलम: तीन बराबर कॉलम
• 4 कॉलम: चार बराबर कॉलम
• 33 / 67: बायां कॉलम लगभग 33% चौड़ा, दायां लगभग 67%
• 67 / 33: बायां कॉलम लगभग 67% चौड़ा, दायां लगभग 33%

फिर प्रत्येक कॉलम में सामग्री जोड़ें। टेम्पलेट में सभी कॉलम के लिए स्पेसिंग बदलने के लिए, सेटिंग्स → कॉलम डिफ़ॉल्ट खोलें और बाहरी पैडिंग, कॉलम पैडिंग और कॉलम के बीच की दूरी समायोजित करें।

टेम्पलेट-व्यापी स्टाइलिंग कॉन्फ़िगर करें

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

दाहिने हाथ के पैनल में सेटिंग्स टैब खोलें।

उपलब्ध अनुभाग:

• दस्तावेज़: पूरे संदेश क्षेत्र का आकार और रूप: चौड़ाई, पैडिंग, पृष्ठभूमि का रंग या छवि, टेक्स्ट का रंग, फ़ॉन्ट परिवार, और ब्लॉकों के बीच की दूरी।
• पॉपअप: संदेश मंद पृष्ठभूमि पर कैसे बैठता है: कोने की त्रिज्या, प्लस ओवरले रंग और अपारदर्शिता।
• ब्लॉक डिफ़ॉल्ट: बाद में जोड़े जाने वाले ब्लॉकों के लिए साझा शुरुआती स्टाइल, ताकि नई सामग्री टेम्पलेट से मेल खाए जब तक कि आप कैनवास पर एक ब्लॉक को ओवरराइड न करें।
• कॉलम डिफ़ॉल्ट: प्रत्येक कॉलम लेआउट के लिए स्पेसिंग: बाहरी पैडिंग, प्रत्येक कॉलम के अंदर पैडिंग, और कॉलम के बीच की दूरी।
• कार्ड डिफ़ॉल्ट: लेआउट में सामग्री को समूहित करने वाले कार्ड कंटेनरों के लिए शुरुआती रूप, जब तक आप व्यक्तिगत रूप से एक कार्ड को स्टाइल नहीं करते तब तक लागू होता है।
• बटन समूह डिफ़ॉल्ट: जब कई बटन एक समूह के रूप में एक साथ बैठते हैं तो स्पेसिंग और संरेखण।
• बटन डिफ़ॉल्ट: नए बटन ब्लॉकों के लिए शुरुआती रूप ताकि CTA पूरे टेम्पलेट में सुसंगत रहें जब तक कि आप किसी एक को अलग से स्टाइल न करें।
• डिवाइडर डिफ़ॉल्ट: नए डिवाइडर ब्लॉकों के लिए शुरुआती लाइन स्टाइल, रंग, मोटाई और चौड़ाई।

डिफ़ॉल्ट वहां लागू होते हैं जहां कोई व्यक्तिगत ब्लॉक उन्हें ओवरराइड नहीं करता है।

नोट

कोई ऊंचाई सेटिंग नहीं है। पॉपअप अपनी सामग्री के साथ बढ़ता है। एक पूर्ण-स्क्रीन संदेश के लिए, सेटिंग्स में चौड़ाई सेट करें और इन-ऐप सेटिंग्स में पूर्णस्क्रीन चुनें।

टेम्पलेट को स्थानीयकृत करें

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

वह सामग्री जिसे आपने वर्तमान भाषा के लिए अभी तक अनुवादित नहीं किया है, वह मंद दिखाई देती है। अनुवाद बनाने के लिए टाइप करना शुरू करें। जब तक आप ऐसा नहीं करते, तब तक डिफ़ॉल्ट भाषा दिखाई देती रहती है।

नोट

आपके द्वारा जोड़ा गया कोई भी ब्लॉक प्रत्येक भाषा के लिए समान सामग्री के साथ दिखाई देता है। अपने टेम्पलेट में उपयोग की जाने वाली प्रत्येक भाषा के लिए नए टेक्स्ट और बटन लेबल का अनुवाद करना याद रखें।

डिवाइस पर इन-ऐप कैसा दिखता है, इसे कॉन्फ़िगर करें

इन-ऐप सेटिंग्स नियंत्रित करती हैं कि संदेश डिवाइस पर कैसे दिखाई देता है और व्यवहार करता है: स्थिति, एनिमेशन, स्वाइप जेस्चर और क्लोज बटन। ये सेटिंग्स केवल iOS और Android Native पर लागू होती हैं।

टॉप बार में इन-ऐप सेटिंग्स पर क्लिक करें:

• स्क्रीन पर स्थिति: पूर्णस्क्रीन, शीर्ष, केंद्र, या निचला।
• प्रस्तुत एनिमेशन / बंद एनिमेशन: कोई नहीं, फीका, बाएँ, दाएँ, ऊपर, या नीचे, या अपने ऐप के SDK डिफ़ॉल्ट का उपयोग करने के लिए डिफ़ॉल्ट।

नोट

कोई नहीं और फीका वर्तमान में Android पर काम करते हैं। iOS पर, संदेश तुरंत दिखाई देता है और गायब हो जाता है (संरेखण जल्द ही आ रहा है)।

• एनिमेशन अवधि (MS): 100 से 3000 मिलीसेकंड। SDK डिफ़ॉल्ट समय का उपयोग करने के लिए खाली छोड़ दें।
• बंद करने के लिए स्वाइप करें: बाएँ, दाएँ, ऊपर और नीचे के किसी भी संयोजन को सक्षम करें।
• बंद करें बटन दिखाएं: बंद करें नियंत्रण को चालू या बंद करें। चालू होने पर, स्थिति (ऊपर दाएँ, ऊपर बाएँ, नीचे दाएँ, नीचे बाएँ), पृष्ठभूमि (एक रंग, या पारदर्शी), और आइकन रंग सेट करें। इस मोडल में अन्य सेटिंग्स के विपरीत, क्लोज बटन की उपस्थिति संदेश में ही प्रस्तुत की जाती है और हर प्लेटफॉर्म पर दिखाई देती है, न कि केवल iOS और Android Native पर।

अपनी पसंद को सहेजने के लिए लागू करें पर क्लिक करें, या उन्हें छोड़ने के लिए रद्द करें पर क्लिक करें।

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

अपने परिवर्तनों को सहेजने के लिए टॉप बार में सहेजें पर क्लिक करें। अपने संपादन के माध्यम से पीछे और आगे जाने के लिए टॉप बार में पूर्ववत्/फिर से करें का उपयोग करें।

नोट

सहेजने से आपका इन-ऐप टेम्पलेट कंटेंट → इन-ऐप्स में संग्रहीत होता है। वहां से आप टेम्पलेट्स का पूर्वावलोकन, संपादन और प्रबंधन कर सकते हैं। और जानें

सहेजे गए टेम्पलेट का उपयोग करें

इन-ऐप टेम्पलेट सहेजने के बाद, आप इसे उपयोगकर्ताओं को Customer Journey में, एक बार के इन-ऐप के रूप में, या जब कोई उपयोगकर्ता पुश टैप करता है, तो दिखा सकते हैं।

• एक ग्राहक यात्रा के हिस्से के रूप में एक इन-ऐप दिखाएं
• एक पुश भेजें जो क्लिक करने पर एक इन-ऐप खोलता है
• अपने उपयोगकर्ताओं को एक एकल इन-ऐप प्रदर्शित करें