1. كيفية عمل قوالب البريد الإلكتروني

يستخدم Easy Form Builder منشئ قوالب بريد إلكتروني بالسحب والإفلات يقوم بتخزين بيانات التصميم في هيكل JSON يسمى EFBDATA.
عند إرسال نموذج، يقرأ الإضافة بيانات EFBDATA، ويقوم بتحويل كل كتلة إلى HTML آمن للبريد الإلكتروني (باستخدام الجداول، والأنماط المضمنة، و VML لبرنامج Outlook)، ويرسل النتيجة عبر wp_mail().

مسار المعالجة

2. مرجع كتل البريد الإلكتروني

يدعم منشئ القوالب الكتل التالية. يتم تصيير كل كتلة على شكل HTML قائم على الجداول مع CSS مضمن.

3. الإعدادات العامة

تسري الإعدادات العامة على قالب البريد الإلكتروني بأكمله وتؤثر على جميع الكتل.

4. مشاكل تسليم البريد الإلكتروني

❌ المشكلة: لا يتم إرسال الرسائل نهائياً

السبب: يستخدم ووردبريس دالة mail() في PHP افتراضياً، والتي قد تكون معطلة أو غير مهيأة بشكل صحيح على استضافتك.

الحل:

• قم بتثبيت إضافة SMTP مثل WP Mail SMTP أو Post SMTP أو FluentSMTP.
• قم بتهيئة الإضافة باستخدام إعدادات موفر البريد الخاص بك (Gmail, Outlook, SendGrid, إلخ).
• استخدم ميزة “إرسال بريد اختباري” في الإضافة للتحقق من وصول الرسائل.
• تحقق من سجل أخطاء ووردبريس في wp-content/debug.log بحثاً عن أخطاء تتعلق بالبريد.

❌ المشكلة: يتم إرسال البريد لكن لا يصل للمستلم

السبب: يتم إرسال البريد من ووردبريس لكنه يُرفض أو يُصفى من قِبَل مزود بريد المستلم.

الحل:

• تحقق من مجلد البريد المزعج / Junk لدى المستلم.
• تأكد من أن نطاقك يحتوي على سجلات DNS صحيحة لـ SPF و DKIM و DMARC.
• تجنب استخدام عنوان بريد مجاني (gmail.com, yahoo.com) كعنوان “من” — استخدم نطاقك الخاص.
• تواصل مع مزود الاستضافة للتأكد من أن البريد الصادر غير محظور على المنفذ 25/587.

❌ المشكلة: تأخر وصول الرسائل

السبب: بعض مزودي الاستضافة يضعون البريد في قائمة انتظار أو يفرضون حدوداً على معدل الإرسال.

الحل:

• استخدم خدمة بريد إلكتروني تحويلية متخصصة (SendGrid, Mailgun, Amazon SES) لتسليم موثوق وسريع.
• تحقق مما إذا كانت الاستضافة تفرض حدوداً على إرسال البريد وقم بالتعديل وفقاً لذلك.

5. العرض عبر تطبيقات البريد المختلفة

تختلف تطبيقات البريد الإلكتروني اختلافاً كبيراً في دعمها لـ HTML/CSS. إليك ما يمكن توقعه:

6. مشاكل كتلة الهيدر (Header)

❌ المشكلة: يظهر التدرج اللوني كلون صلب واحد في Outlook

السبب: يستخدم Microsoft Outlook (سطح المكتب) محرك عرض Word الذي لا يدعم تدرجات CSS.

الحل: هذا سلوك طبيعي ومتوقع. تستخرج الإضافة تلقائياً اللون الأول من تدرجك وتستخدمه كخلفية صلبة احتياطية لـ Outlook. سيظهر التدرج بشكل صحيح في Gmail وApple Mail وYahoo والعملاء المستندين إلى الويب.

❌ المشكلة: لا يظهر لون خلفية الهيدر

السبب: يمكن للوضع الداكن (Dark Mode) في تطبيقات البريد تجاوز ألوان الخلفية.

الحل:

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

7. مشاكل كتلة الشعار (Logo)

❌ المشكلة: لا تظهر صورة الشعار

السبب: رابط URL الشعار غير متاح للعامة، أو أن تطبيق البريد يحجب الصور.

الحل:

• تأكد من أن الشعار مرفوع على مكتبة وسائط ووردبريس (وليس رابطاً خارجياً قد يكون محظوراً).
• تحقق من أن رابط الصورة متاح من خارج شبكتك — افتحه في نافذة تصفح خاص.
• إذا كان موقعك يستخدم HTTP (وليس HTTPS)، قد تحجب بعض تطبيقات البريد الصورة. استخدم HTTPS.
• بعض تطبيقات البريد تحجب الصور افتراضياً حتى يضغط المستخدم على “عرض الصور”. أضف نصاً بديلاً (alt text) وصفياً.

❌ المشكلة: يظهر الشعار كبيراً أو صغيراً جداً

السبب: إعداد العرض في منشئ القوالب لا يتوافق مع أبعاد الصورة الفعلية.

الحل: اضبط إعداد العرض في خصائص كتلة الشعار. العرض الموصى به للشعار في البريد الإلكتروني هو بين 100px و 200px.

8. مشاكل كتل النصوص والعناوين

❌ المشكلة: الخط لا يتطابق مع معاينة المنشئ

السبب: لا تدعم تطبيقات البريد خطوط الويب. الخط المرئي في المنشئ قد لا يكون متاحاً على جهاز المستلم.

الحل:

• استخدم الخطوط الآمنة للنظام: Arial, Verdana, Tahoma, Georgia, Segoe UI, Trebuchet MS.
• تضمن مجموعة الخطوط الاحتياطية إمكانية القراءة حتى عند عدم توفر الخط الأساسي.

❌ المشكلة: يبدو لون النص مختلفاً في الوضع الداكن

السبب: يمكل لـ Gmail وOutlook وApple Mail في الوضع الداكن عكس ألوان النص والخلفية أو تعديلها.

الحل:

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

❌ المشكلة: يظهر النص العربي/RTL من اليسار إلى اليمين (LTR)

السبب: إعداد اتجاه البريد الإلكتروني لا يتوافق مع لغة المحتوى.

الحل: تكتشف الإضافة RTL تلقائياً من إعدادات ووردبريس. إذا كان المحتوى بالعربية أو الفارسية أو العبرية، تأكد من تعيين اللغة الصحيحة في الإعدادات > عام > لغة الموقع.

9. مشاكل كتلة الرسالة (Message)

❌ المشكلة: تظهر كتلة الرسالة “shortcode_message” بدلاً من بيانات النموذج

السبب: لم يتم تمرير بيانات إرسال النموذج بشكل صحيح إلى محرك العرض.

الحل:

• تأكد من أن النموذج يحتوي على حقل واحد على الأقل (مثل الاسم أو البريد أو الرسالة).
• تحقق من أن النموذج محفوظ ومنشور بشكل صحيح.
• تحقق من سجل الأخطاء في wp-content/debug.log بحثاً عن أخطاء PHP.
• جرب إعادة حفظ قالب البريد في منشئ القوالب.

❌ المشكلة: تظهر بيانات النموذج لكن بدون تنسيق

السبب: تعرض كتلة الرسالة بيانات النموذج كما هي. HTML المعقد في ردود النموذج قد لا يكون منسقاً.

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

10. مشاكل كتلة الأزرار

❌ المشكلة: يظهر الزر بخلفية بيضاء ونص أبيض في Outlook

السبب: الإصدارات القديمة من الإضافة استخدمت أزراراً CSS فقط لا يستطيع محرك عرض Outlook المستند إلى Word عرضها.

الحل: تم إصلاح هذه المشكلة. تستخدم الإضافة الآن VML (لغة ترميز المتجهات) لعرض الأزرار في Outlook. ستظهر الأزرار بلون الخلفية ولون النص الصحيحين في جميع إصدارات Outlook. تأكد من استخدام الإصدار 4.0 أو أحدث.

❌ المشكلة: يُزال لون خلفية الزر في Gmail

السبب: يزيل Gmail خلفيات التدرج اللوني من الروابط.

الحل: تستخدم الإضافة background-color صلباً بدلاً من التدرجات للأزرار. هذا يضمن عرضاً متسقاً في Gmail وجميع العملاء الآخرين. إذا ظل زرك يظهر بدون خلفية، أعد حفظ قالب البريد لتطبيق أحدث كود عرض.

❌ المشكلة: لا تظهر الحواف المستديرة للزر في Outlook

السبب: لا يدعم Outlook خاصية CSS border-radius.

الحل: يستخدم البديل VML لـ Outlook خاصية arcsize لمحاكاة الحواف المستديرة. لكن النتيجة قد لا تكون متطابقة تماماً مع العملاء الآخرين. هذا قيد معروف في Outlook.

❌ المشكلة: لون الزر لا يتطابق مع المنشئ

السبب: يستخدم الزر الإعدادات العامة للون خلفية الزر ولون نصه.

الحل: تحقق من لوحة الإعدادات العامة في منشئ القوالب. إعدادا “لون خلفية الأزرار” و”لون نص الأزرار” يتحكمان في الألوان الافتراضية لجميع الأزرار.

11. مشاكل كتلة الصور

❌ المشكلة: لا تظهر الصورة في البريد الإلكتروني

السبب: رابط URL الصورة غير متاح للعامة، أو أن تطبيق البريد يحجب الصور افتراضياً.

الحل:

• ارفع الصور على مكتبة وسائط ووردبريس. لا تستخدم روابط localhost — فهي غير متاحة من تطبيق بريد المستلم.
• تأكد من أن موقعك يستخدم HTTPS. كثير من تطبيقات البريد تحجب الصور المقدمة عبر HTTP.
• افتح رابط الصورة في نافذة تصفح خاص للتأكد من تحميلها.
• أضف نصاً بديلاً (alt text) وصفياً ليرى المستخدمون معلومات مفيدة أثناء تحميل الصور.

❌ المشكلة: الصورة عريضة جداً على الموبايل

السبب: عرض الصورة يتجاوز حجم الشاشة على الأجهزة المحمولة.

الحل: تتضمن الإضافة قاعدة CSS متجاوبة (max-width: 100%) تقلص الصور تلقائياً على الموبايل. إذا استخدمت عرضاً نسبياً (مثلاً 100%)، ستتناسب الصور تلقائياً مع الحاوية.

❌ المشكلة: رابط الصورة غير قابل للنقر

السبب: حقل الرابط في المنشئ فارغ أو يحتوي على URL غير صالح.

الحل: افتح إعدادات كتلة الصورة وتأكد من أن رابط URL يبدأ بـ https://.

12. مشاكل الفواصل والمساحات

❌ المشكلة: لا يظهر الفاصل (Divider)

السبب: لون الفاصل قريب جداً من لون خلفية المحتوى.

الحل: غيّر لون الفاصل في إعدادات الكتلة لإنشاء تباين أكبر مع الخلفية. تأكد أيضاً من أن سماكة الفاصل 1px على الأقل.

❌ المشكلة: يتجاهل Outlook ارتفاع المساحة (Spacer)

السبب: بعض إصدارات Outlook تطوي خلايا الجداول الفارغة.

الحل: تستخدم الإضافة رمز   داخل خلايا المساحة لمنع الطي. إذا ظلت المساحة تبدو أقصر من المتوقع في Outlook، جرب زيادة الارتفاع قليلاً.

13. مشاكل كتلة الأعمدة

❌ المشكلة: لا تظهر الأعمدة جنباً إلى جنب في Outlook

السبب: لا يحترم Outlook أحياناً عروض الجداول النسبية بشكل صحيح.

الحل: تستخدم الإضافة تخطيطاً قائماً على الجداول (48% | فراغ 4% | 48%) يدعمه Outlook. إذا تكدست الأعمدة، فقد يكون المحتوى في أحد الأعمدة عريضاً جداً. حافظ على إيجاز محتوى الأعمدة.

❌ المشكلة: تتكدس الأعمدة على الموبايل

السبب: هذا سلوك متجاوب مقصود. على الشاشات الأضيق من 600px، تتكدس الأعمدة رأسياً لتسهيل القراءة.

الحل: لا يلزم اتخاذ أي إجراء. هذا هو السلوك الصحيح للأجهزة المحمولة.

14. مشاكل كتلة التواصل الاجتماعي

❌ المشكلة: لا تظهر أيقونات التواصل الاجتماعي في الرسائل

السبب: يتم عرض أيقونات التواصل الاجتماعي كصور PNG مستضافة على سيرفرك. إذا كان السيرفر غير متاح للعامة (مثلاً localhost أو بيئة اختبار خلف جدار ناري)، لا يستطيع تطبيق البريد تحميل الصور.

الحل:

• تأكد من أن موقعك متاح للعامة عبر الإنترنت (وليس localhost).
• تحقق من اكتمال ملفات الإضافة. ملفات الأيقونات موجودة في: public/assets/images/social/.
• تحقق من أن مجلد wp-content/uploads/ قابل للكتابة (تخزن الإضافة الأيقونات الملونة فيه مؤقتاً).
• بعد حفظ الأيقونات في المنشئ، أرسل بريداً اختبارياً لنفسك للتحقق من ظهورها.

❌ المشكلة: تظهر الأيقونات بلون خاطئ

السبب: تم تغيير لون الأيقونة في المنشئ لكن لم تتم إعادة توليد النسخة الملونة المؤقتة.

الحل:

• تولّد الإضافة تلقائياً نسخة ملونة محددة من كل أيقونة وتخزنها في wp-content/uploads/efb-icons/.
• إذا ظهرت الأيقونات بلون خاطئ، احذف مجلد wp-content/uploads/efb-icons/. ستعيد الإضافة توليد الأيقونات عند إرسال البريد التالي.

❌ المشكلة: بعض الأيقونات مفقودة والأخرى تظهر بشكل صحيح

السبب: قد يكون ملف PNG معين مفقوداً من مجلد الإضافة.

الحل:

• تحقق من وجود الملف public/assets/images/social/{اسم-الأيقونة}.png للأيقونة المفقودة.
• أعد تثبيت الإضافة أو تحديثها لاستعادة الأيقونات المفقودة.
• إذا كانت أيقونة واحدة فقط مفقودة، سيعرض البريد الإلكتروني رمز emoji نصي بديلاً.

أيقونات التواصل الاجتماعي المدعومة

15. مشاكل كتلة التذييل (Footer)

❌ المشكلة: نص التذييل مقطوع أو مفقود

السبب: تقطع بعض تطبيقات البريد (Gmail تحديداً) الرسائل التي يتجاوز حجمها حوالي 102 كيلوبايت.

الحل:

• حافظ على إيجاز قالب بريدك. تجنب إضافة كتل HTML كبيرة بشكل مفرط.
• إذا أظهر Gmail “[تم قص الرسالة] عرض الرسالة كاملة”، فإن الحجم الإجمالي لـ HTML قد تجاوز الحد.
• احذف الكتل غير الضرورية أو قلل كمية النص لتقليل الحجم دون الحد.

❌ المشكلة: لون خلفية التذييل لا يتطابق

السبب: تمتلك كتلة التذييل إعداد bgColor خاصاً بها. إذا لم يُضبط صراحةً، فإنه يرجع إلى contentBgColor العام.

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

16. مشاكل كتلة HTML

❌ المشكلة: لا يتم تصيير HTML المخصص بشكل صحيح

السبب: دعم تطبيقات البريد للـ HTML/CSS محدود جداً مقارنة بالمتصفحات.

الحل:

• استخدم فقط تخطيطات قائمة على الجداول بدلاً من div أو flexbox أو grid.
• استخدم فقط CSS مضمناً (style="..."). تزيل تطبيقات البريد كتل <style> وأوراق الأنماط الخارجية.
• لا تستخدم وسوم <script> — تزيل جميع تطبيقات البريد JavaScript.
• لا تستخدم صور SVG أو صور مشفرة بـ base64 — لن تعرضها Gmail وOutlook.
• استخدم روابط URL مطلقة لجميع الصور (مثلاً https://yourdomain.com/image.png).

وسوم HTML الآمنة لكتلة HTML

17. رسائل البريد تذهب للمزعج (Spam)

❌ المشكلة: تصل الرسائل باستمرار إلى مجلد Spam

السبب: عوامل متعددة يمكن أن تُشغّل مرشحات البريد المزعج.

الحل: تحقق من كل نقطة من النقاط التالية وعالجها:

18. قائمة فحص تصحيح الأخطاء

استخدم هذه القائمة عند استكشاف مشاكل البريد الإلكتروني:

🐛 تفعيل سجل الأخطاء في ووردبريس

أضف الكود التالي إلى ملف wp-config.php (قبل السطر “That’s all, stop editing!”):

بعد التفعيل، أرسل نموذجاً وتحقق من ملف السجل في wp-content/debug.log بحثاً عن أي أخطاء.