নেটিভ ইন-অ্যাপ মেসেজ তৈরি করুন

নেটিভ ইন-অ্যাপগুলো রেডি-মেড লেআউট ব্যবহার করে যা 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 সেট করুন। ডিফল্ট হল ৫। ১ থেকে ৩০ এর মধ্যে একটি মান লিখুন। এই পরিসরের বাইরের মানগুলো একটি ভ্যালিডেশন ত্রুটির সাথে Save ব্লক করে দেবে।
3. ঐচ্ছিকভাবে, স্লাইডের ভিতরে Add এ ক্লিক করে এটিকে নিজস্ব CTA বাটন দিন। দেখুন বাটন কনফিগার করুন।

4. শেষ স্লাইডের নিচে Add এ ক্লিক করে আরেকটি স্লাইড যোগ করুন, তারপর এর জন্য ১-৩ ধাপগুলো পুনরাবৃত্তি করুন।
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 এ ক্লিক করে আরেকটি যোগ করুন, তারপর এর জন্য ১-২ ধাপগুলো পুনরাবৃত্তি করুন।
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 এ ক্লিক করার আগে আপনি ট্যাগ, মডিফায়ার এবং ডিফল্ট পরিবর্তন করতে পারেন। পার্সোনালাইজেশন ডাইনামিক কনটেন্ট এর মতো একই ট্যাগ, মডিফায়ার এবং ডিফল্ট ব্যবহার করে।

টিপ

শর্তসাপেক্ষ যুক্তির জন্য (উদাহরণস্বরূপ, একটি ট্যাগ একটি নির্দিষ্ট মানের সমান হলেই এই টেক্সটটি দেখান), সরাসরি ফিল্ডে Liquid সিনট্যাক্স টাইপ করুন।

যখন আপনি 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 পেস্ট করুন, অথবা এর পাশে Choose from Media storage এ ক্লিক করে মিডিয়া স্টোর খুলুন এবং আপনার ইতিমধ্যে আপলোড করা একটি ছবি বেছে নিন। মিডিয়া স্টোর থেকে একটি ছবি বেছে নিলে ফিল্ডে বর্তমানে থাকা URLটি প্রতিস্থাপিত হয়।

লোকালাইজেশন যোগ করুন

ডিফল্টরূপে, একটি নেটিভ ইন-অ্যাপের একটি ভাষা থাকে। আরও যোগ করতে:

নোট

এখানকার ভাষা নির্বাচক শুধুমাত্র সেই প্ল্যাটফর্মের ডিভাইসগুলো গণনা করে যা ইন-অ্যাপ কনটেন্ট রেন্ডার করে। ব্যবহারকারী-স্তরের ট্যাগগুলির মাধ্যমে সেট করা ভাষার মানগুলো কোনো ডিভাইস প্ল্যাটফর্মের সাথে বাঁধা নয়, তাই সেগুলো এখানে দেখানো হয় না।

1. উপরের বারে ভাষা নির্বাচকের পাশে + এ ক্লিক করুন।
2. যোগ করার জন্য ভাষাগুলো নির্বাচন করুন এবং Apply এ ক্লিক করুন।

3. ভাষাগুলোর মধ্যে স্যুইচ করতে এবং প্রতিটির জন্য টেক্সট ফিল্ডগুলো পূরণ করতে উপরের বারের ভাষা নির্বাচক ব্যবহার করুন।

নোট

যখন আপনি একটি ভাষা যোগ করেন, Pushwoosh ডিফল্ট ভাষার কনটেন্ট এতে কপি করে: টেক্সট, ইমেজ এবং বাটন লেবেল। সেই ভাষায় স্যুইচ করুন এবং এই ফিল্ডগুলোর যেকোনোটি স্বাধীনভাবে সম্পাদনা করুন।

টেমপ্লেটটি সংরক্ষণ করুন

আপনার পরিবর্তনগুলো স্থায়ী করতে উপরের ডানদিকে Save এ ক্লিক করুন।

টেমপ্লেটটি তারপর আপনার অন্যান্য ইন-অ্যাপ টেমপ্লেটগুলোর পাশাপাশি Content → In-apps এ প্রদর্শিত হয়।

এটি একটি ক্যাম্পেইনে ব্যবহার করুন

একটি নেটিভ ইন-অ্যাপ টেমপ্লেট আপনার অন্যান্য ইন-অ্যাপ টেমপ্লেটগুলোর সাথে টেমপ্লেট পিকারে প্রদর্শিত হয়।

আপনি এটি ব্যবহার করতে পারেন:

• একটি তাৎক্ষণিক ইন-অ্যাপ পাঠান
• একটি Customer Journey তে একটি ইন-অ্যাপ ধাপ যোগ করুন
• ব্যবহারকারী একটি পুশ ট্যাপ করলে একটি ইন-অ্যাপ খুলুন

নোট

ডেলিভারি সেটিংস, যেমন শুরু এবং শেষের তারিখ এবং ফ্রিকোয়েন্সি ক্যাপিং, অন্য যেকোনো ইন-অ্যাপের মতোই কাজ করে এবং এই এডিটরের অংশ নয়।