# صيغة قوالب الوسائط الغنية ## بنية القالب القالب هو ببساطة أرشيف .zip يمكن أن يحتوي على HTML و JavaScript و CSS وصور كأصول للوسائط الغنية. يجب أن يحتوي الأرشيف على ملف **index.html** في جذره. ## العناصر النائبة للقالب يمكنك استخدام العناصر النائبة في قوالب الوسائط الغنية التي ستسمح لك بتغيير وتوطين القيم في محتوى الوسائط الغنية. يجب أن يتبع العنصر النائب التنسيق أدناه: ```liquid {{ Placeholder name | Type | Default value }}` ``` حيث: * **Placeholder name** — هو اسم العنصر النائب الذي سيكون مرئيًا في محرر الوسائط الغنية. * **Type** — هو نوع العنصر النائب. يمكن أن يكون النوع أيًا من القيم التالية: * **color** — إدخال لون * **text** — إدخال نص * **html** — منطقة نصية (نص متعدد الأسطر) * **Default value** — القيمة الافتراضية التي يتم استخدامها إذا لم يتم توفير قيمة في المحرر. إذا لم يتم تعيين أي قيمة، فسيتم استخدام **Placeholder name** كقيمة افتراضية. مثال: ```liquid {{Header text|text|Tell Us What You Think}}` ``` ## إضافة Pushwoosh.json يمكنك تجميع العناصر النائبة بحيث تكون مرتبطة معًا في محرر الوسائط الغنية: واجهة محرر الوسائط الغنية تعرض العناصر النائبة المجمعة والمرتبطة معًا في مجموعات إدخال

واجهة محرر الوسائط الغنية تعرض العناصر النائبة المجمعة والمرتبطة معًا في مجموعات إدخال

لتحقيق ذلك، أضف ملف **pushwoosh.json** إلى الأرشيف مع قالب الوسائط الغنية الخاص بك بجوار ملف **index.html**. بنية الملف بسيطة جدًا ويجب أن تكون واضحة بذاتها: ``` { "input_groups": [ ["Logo image URL", "Logo background color"], ["Topic text", "Topic text color", "Topic background color", "Sub-topic text"], ["Main text", "Text background color"], ["Button text", "Button URL", "Button text color", "Button background color"] ] } ``` ## مثال تعد النماذج المخصصة للاستطلاعات حالة استخدام شائعة لقوالب الوسائط الغنية المخصصة. تسمح لك هذه النماذج بجمع ملاحظات قيمة من المستخدمين. يتوفر قالب مصمم مسبقًا مع نموذج استطلاع مخصص في القوالب الافتراضية. استخدم هذا كنقطة انطلاق لاستطلاعاتك الخاصة. مثال على قالب نموذج استبيان مخصص مع حقول إدخال لجمع ملاحظات المستخدمين

مثال على قالب نموذج استبيان مخصص مع حقول إدخال لجمع ملاحظات المستخدمين

عند إنشاء النماذج، [اتبع بعض أفضل الممارسات](#أفضل-الممارسات-للعناصر-المخصصة-في-الوسائط-الغنية) لضمان التوافق والوظائف السلسة داخل محرر الوسائط الغنية. إليك مثال آخر من أحد القوالب الافتراضية المتاحة في لوحة التحكم. ```txt

``` ## مراقبة أداء الوسائط الغنية المخصصة يمكنك أيضًا مراقبة أداء محتوى الوسائط الغنية المخصص الذي تقوم بإنشائه وتحميله إلى Pushwoosh كملف ZIP. يمكنك تتبع كيفية تفاعل الأشخاص مع الوسائط الغنية الخاصة بك عن طريق: * نقرات الأزرار * نقرات الروابط * إرسال النماذج لتمكين Pushwoosh من تتبع هذه التفاعلات: 1. أضف سمة "id" إلى كل عنصر ترغب في تتبعه. على سبيل المثال: **لتتبع نقرات الروابط:** ```html … ``` **لتتبع إرسال النماذج:** ```html ``` **لتتبع نقرات الأزرار:** ```html // السمة type="button" مطلوبة ``` 2. أضف رابطًا إلى ملف JavaScript من CDN في نهاية المستند: ```html ``` ## أفضل الممارسات للعناصر المخصصة في الوسائط الغنية ### إدارة أنماط CSS بعناية تأكد من أن أنماط CSS الخاصة بك محددة لتجنب التعارض مع أنماط محرر الوسائط الغنية (Rich Media Editor). قد يؤثر استخدام أنماط ذات تحديد منخفض، مثل تلك المطبقة على أسماء الوسوم أو أسماء الفئات الشائعة، على مظهر محرر الوسائط الغنية. من الأفضل أن تبقي أنماطك محلية—قم بتغليف المحتوى الخاص بك في حاوية ذات ID أو class فريد واستخدم هذا المعرف في محددات CSS الخاصة بك للعناصر الفرعية. ### تضمين المكتبات الخارجية يمكنك دمج مكتبات CSS أو JavaScript (مثل Font Awesome، Bootstrap، Tailwind CSS، إلخ) للاستفادة من أساليبها، وأيقوناتها، وخطوطها، ورسومها المتحركة، والمزيد.

{{Topic text|text|TOPIC TEXT}}