إنشاء رسائل داخل التطبيق باستخدام المحرر بدون كود

فيديو يوتيوب: إنشاء رسائل داخل التطبيق بدون برمجة في محررنا سهل الاستخدام

لإنشاء قالب داخل التطبيق (يُسمى أيضًا Rich Media)، انتقل إلى Content ← In-Apps (Rich Media) وانقر على Add template:

هنا، لديك ثلاثة خيارات:

1. تحميل ملف ZIP مع رسالتك داخل التطبيق بصيغة HTML.
2. اختر وخصص أحد القوالب الجاهزة.
3. بناء قالبك الخاص من الصفر.

في هذا المقال، سنلقي نظرة على إنشاء قالب من الصفر. اتبع نفس الخطوات لتخصيص قالبك الحالي.

تحديد التخطيط

حدد تخطيط القالب عن طريق سحب وإفلات كتل المحتوى المطلوبة في جسم القالب. يمكنك إضافة صورة، نص، زر، فاصل، نموذج قابل للتعبئة، كتلة HTML، وقائمة.

إذا كنت ترغب في وضع أكثر من عنصر محتوى واحد في صف، أضف عنصر الأعمدة (Columns) إلى القالب، وحدد نوع الكتلة المطلوب، وأضف المحتوى إلى كل عمود:

لتغيير لون خلفية التخطيط، انقر على هوامشه الخارجية، وتأكد من تحديد التخطيط بأكمله، واختر اللون:

إذا تم تحديد التخطيط بأكمله، يمكنك أيضًا تعديل إعدادات الحشو وتحميل صورة خلفية.

إنشاء وسائط غنية بالاتجاه الرأسي والأفقي

يوفر Pushwoosh المرونة لإنشاء محتوى وسائط غنية بكل من الاتجاهين الرأسي والأفقي، مما يضمن أن تكون حملاتك جذابة بصريًا وفعالة على جميع الأجهزة.

الوسائط الغنية بالاتجاه الرأسي

لإنشاء وسائط غنية مصممة للاتجاه الرأسي، والذي يستخدم عادةً على الأجهزة المحمولة، انتقل إلى علامة التبويب Mobile في المحرر. هنا، يمكنك تصميم المحتوى الخاص بك ليتناسب مع تخطيط رأسي، مناسب لشاشات الهواتف الذكية.

الوسائط الغنية بالاتجاه الأفقي

بالنسبة للوسائط الغنية ذات الاتجاه الأفقي، والتي تظهر عادةً على شاشات أوسع مثل الأجهزة اللوحية أو في التطبيقات ذات الاتجاه الأفقي مثل الألعاب أو مشغلات الموسيقى، انتقل إلى علامة التبويب Desktop داخل المحرر. هنا، يمكنك هيكلة الوسائط الغنية الخاصة بك للاستفادة من مساحة أفقية أوسع.

إضافة أعمدة إلى الوسائط الغنية بالاتجاه الأفقي

إذا كنت بحاجة إلى إضافة أعمدة إلى الوسائط الغنية ذات الاتجاه الأفقي، فأضف أولاً عنصر Column وحدد عدد وتخطيط الأعمدة التي تحتاجها.

بعد تصميم الوسائط الغنية ذات الاتجاه الأفقي مع الأعمدة، انتقل إلى علامة التبويب Mobile.

مرر لأسفل إلى قسم RESPONSIVE DESIGN، الموجود في أسفل لوحة الإعدادات، وقم بتمكين خيار Do Not Stack on Mobile.

ملاحظة

هذه الخطوة حيوية للحفاظ على التصميم المقصود للوسائط الغنية ذات الاتجاه الأفقي عند عرضها على الأجهزة المحمولة. فهي تضمن بقاء الأعمدة جنبًا إلى جنب، بدلاً من تكديسها.

يسمح لك Pushwoosh أيضًا بخلط ومطابقة تخطيطات الأعمدة في الوسائط الغنية الخاصة بك. يمكنك تكوين أعمدة معينة لتتكدس رأسيًا مع إبقاء الأخرى أفقية. للقيام بذلك، اضبط كل كتلة عمود حسب الحاجة.

عناصر المحتوى

العنوان

يمكنك تعديل معلمات الخط واللون ومحاذاة النص وارتفاع السطر والحشو للعناوين.

ملاحظة

إذا كنت ترغب في تخصيص العنوان لكل مستخدم، أضف Tags إليه.

يمكنك أيضًا توفير الوقت عن طريق السماح للذكاء الاصطناعي بإنشاء نص العنوان لك. انقر على الزر في قسم Smart Headings، وأدخل بعض الكلمات الرئيسية، وانقر على Get Suggestions:

النص

النصوص قابلة للتخصيص بنفس طريقة العناوين: يمكنك تغيير معلمات الخط واللون ومحاذاة النص وارتفاع السطر والحشو.

ملاحظة

إذا كنت ترغب في تخصيص النص لكل مستخدم، أضف Tags إليه.

يمكنك أيضًا استخدام محرر الذكاء الاصطناعي من Pushwoosh لإعادة كتابة نسختك بنبرة صوت مختلفة، وتغيير طولها، والتحقق من القواعد النحوية. للقيام بذلك، انقر على كتلة النص ← Smart Text واختر أحد تنسيقات النسخ المدمجة:

الصورة

لإضافة صورة، انقر على كتلة الصورة واسحب ملفك إلى لوحة المحرر:

بدلاً من ذلك، يمكنك تحديد Image URL بدلاً من تحميل ملف.

يمكنك أيضًا تجربة إنشاء الصور بالذكاء الاصطناعي. للقيام بذلك، انقر على الزر في قسم Magic Image، وصف الصورة التي تريد إنشاءها، وانقر على Generate Images:

في قسم Action، يمكنك تعيين الإجراء الذي يجب تنفيذه عند النقر على الصورة: فتح موقع ويب (أو رابط عميق (deep link) إلى صفحة داخل تطبيقك) أو إغلاق النافذة المنبثقة. يمكنك أيضًا إدراج سمة معالج JavaScript مخصصة لتعيين إجراء النقر على الصورة. إذا لم يكن هناك حاجة لإجراء، تجاهل هذا الإعداد.

إذا كنت ترغب في فتح صفحة في تطبيقك المحمول عند النقر على الصورة، حدد خيار Open Website وأدخل رابطًا عميقًا (deep link).

الزر

بمجرد إضافة زر إلى قالبك، يمكنك تخصيص نصه ولونه وحشوه وحدوده.

ملاحظة

إذا كنت ترغب في تخصيص نص الزر لكل مستخدم، أضف Tags إليه.

يمكن للذكاء الاصطناعي مساعدتك في ابتكار نص الزر. ما عليك سوى النقر على الزر في قسم Smart Buttons، وإدخال الكلمات الرئيسية، والنقر على Get Suggestions:

لتحديد الإجراء الذي يجب تنفيذه بعد النقر على الزر، انتقل إلى قسم Action وحدد الخيار المطلوب: فتح موقع ويب أو إغلاق النافذة المنبثقة. يمكنك أيضًا إدراج سمة معالج JavaScript مخصصة لتعيين إجراء النقر على الزر.

إذا كنت ترغب في فتح صفحة في تطبيقك المحمول عند النقر على الزر، حدد خيار Open Website وأدخل رابطًا عميقًا (deep link).

الفاصل

الفواصل هي خطوط يمكنك وضعها بين كتل المحتوى. استخدمها لهيكلة قالبك والتأكيد على أهم الكتل. يمكنك تغيير عرض الفاصل ونوع الخط والمحاذاة وإعدادات الحشو.

النموذج

لتكوين هذا العنصر، ستحتاج إلى مساعدة مطور.

تسمح لك النماذج بجمع رسائل البريد الإلكتروني للمستخدمين وأرقام هواتفهم وتفضيلاتهم وغيرها من المعلومات التي قد تكون مفيدة للاتصالات المستقبلية. يتم تكوين هذا العنصر كنموذج HTML قياسي: يتم إرسال البيانات في طلب GET أو POST إلى العنوان المحدد في حقل URL.

انقر على اسم الحقل لتكوين معلماته:

• Field Type: نوع البيانات التي يجب إرسالها في الحقل؛
• Field Name: اسم المعلمة التي يتم تمرير البيانات من الحقل إليها؛
• Field Label: النص المعروض فوق الحقل؛
• Placeholder Text;
• مربع اختيار يشير إلى ما إذا كان الحقل مطلوبًا لإرسال النموذج.

لإضافة حقل آخر، انقر على Add New Field وحدد نوع البيانات:

يمكنك تخصيص معلمات النموذج مثل العرض والمحاذاة والمسافة بين الحقول ونص الزر والألوان والخطوط.

HTML

أضف كتلة HTML إذا كنت ترغب في تضمين كود HTML الخاص بك في القالب.

القائمة

يسمح لك عنصر Menu بوضع عدة عناصر قابلة للنقر في صف أو عمود. على سبيل المثال، يمكنك إضافة شريط تنقل أو جهات اتصال الشركة.

لإضافة عنصر قائمة، انقر على Add New Item:

أضف نص العنصر وحدد الإجراء الذي يجب تنفيذه عند النقر على العنصر:

اختر نوع القائمة الأفقي أو الرأسي وأضف فاصلاً بين العناصر إذا لزم الأمر:

تخصيص المحتوى

خصص النص الرئيسي أو العنوان أو نص الزر لجعل المحتوى الخاص بك أكثر صلة وجاذبية. على سبيل المثال، يمكنك مخاطبة المستخدمين بأسمائهم أو ذكر تفضيلاتهم.

أولاً، تحتاج إلى إعداد Tags وتكوين جمع البيانات من المستخدمين (على سبيل المثال، عبر نموذج ملاحظات). عند إنشاء Rich Media، حدد كتلة المحتوى المطلوبة، وانقر على Merge Tags، وحدد الـ Tag الذي تريد استخدامه:

قوالب متعددة اللغات

يمكنك توطين النصوص في قالب Rich Media الخاص بك لكل لغة يتحدث بها المستخدمون. للقيام بذلك، قم بالتبديل بين اللغات في قائمة Editable language وقم بتحرير المحتوى بكل لغة على حدة:

إذا لم يتم توطين المحتوى، فسيتم عرضه باللغة المحددة default في Language settings.

أي عنصر تضيفه إلى القالب يظهر بنفس المحتوى لجميع اللغات. تذكر توطين النصوص المضافة (بما في ذلك نصوص الأزرار) لجميع اللغات التي تستخدمها في قالبك.

إعدادات القالب العامة

في علامة التبويب Popup، يمكنك تكوين إعدادات القالب العامة:

• تعيين موضع النافذة المنبثقة على الشاشة؛
• تغيير عرض وارتفاع النافذة المنبثقة؛
• تعديل استدارة الحدود؛
• تكوين إعدادات المحتوى للقالب بأكمله: المحاذاة، العرض، الخطوط، والألوان؛
• تعيين لون الخلفية أو إضافة صورة خلفية؛
• تخصيص موضع ومظهر زر الإغلاق.

حفظ واستخدام القالب

انقر على Save لتطبيق التغييرات:

الآن يمكنك استخدام قالب Rich Media الخاص بك لإرسال رسائلك داخل التطبيق. يرجى اتباع هذا الدليل للقيام بذلك >