نماذج العنصر: كيفية إنشاء نموذج اتصال Elementor

نشرت: 2022-06-07

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

Fluent Forms هو منشئ النماذج الأكثر ملاءمة للمبتدئين. قم بالتنزيل الآن وابدأ في صياغة أشكال جميلة مجانًا !!!

كيفية إنشاء نموذج العنصر

سنعرض لك طريقتين لإنشاء نموذج اتصال Elementor لمساعدتك في الاختيار حسب حاجتك.

  1. قم بإنشاء نموذج اتصال مع Elementor Pro
  2. أفضل طريقة لإنشاء نموذج اتصال Elementor (مجانًا)

قم بإنشاء نموذج اتصال مع Elementor Pro

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

خطوات إنشاء نموذج اتصال مع Elementor -

1. إضافة نموذج Elementor إلى صفحتك

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

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

2. إضافة حقول مختلفة إلى نموذج Elementor الخاص بك

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

  1. نص
  2. البريد الإلكتروني
  3. منطقة النص
  4. URL
  5. هاتف
  6. مذياع
  7. يختار
  8. خانة اختيار
  9. قبول
  10. رقم
  11. تاريخ
  12. زمن
  13. تحميل الملف
  14. كلمة المرور
  15. لغة البرمجة
  16. مختفي
  17. reCAPTCHA
  18. وعاء العسل

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

3. إعداد تقديم النموذج

بعد إرسال النموذج ، يمكنك إعداد دليل البريد الإلكتروني والبيانات التي تريد الحصول عليها من إرسال النموذج. هذا ليس علم الصواريخ. يمكنك إعداد جميع الخيارات مثل -

  • إلى
  • موضوعات
  • رسالة
  • من البريد الإلكترونى
  • من الاسم
  • الرد على
  • نسخة
  • نسخة مخفية الوجهة

كل الخيارات لإرسال بريد إلكتروني.

4. تصميم نموذج العنصر الخاص بك

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

انتقل إلى خيار النمط لإضفاء مظهر فريد على النموذج الخاص بك.

لماذا شكل Elementor ليس كافيا بالنسبة لك

بادئ ذي بدء ، لا يمكنك الاستفادة من جميع خيارات المكون الإضافي العادي لمنشئ النماذج في نماذج Elementor. ومع ذلك ، فإنه يقدم الأساسيات فقط. إذا حاولت إنشاء نماذج مختلفة وتحليل البيانات ، فستحتاج إلى مُنشئ نماذج آخر في مكدس WordPress التقني الخاص بك.

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

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

أفضل طريقة لإنشاء نموذج اتصال Elementor (مجانًا)

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

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

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

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

يمكنك أيضًا الوصول إلى كل هذه الميزات الأساسية لـ Fluent Forms -

  • أكثر من 50 حقل إدخال وأكثر من 70 نموذجًا تم إنشاؤه مسبقًا للعب بها
  • عنوان الإكمال التلقائي والإكمال التلقائي بالسحب والإفلات
  • حماية متعددة الطبقات من البريد العشوائي
  • تصور البيانات وتحليلها حسب الحاجة
  • تحميل الملفات وإدارة البيانات
  • أشكال المحادثة
  • وحدة الاختبار
  • المنطق الشرطي
  • ميزة الصفحة المقصودة

الآن بما أنك تعرف فوائد استخدام نماذج Fluent ، فلنقم بعمل نماذج اتصال Elementor في لمح البصر.

كيفية إضافة نموذج اتصال Elementor

إن أبسط طريقة لإعداد نموذج اتصال Elementor هي باستخدام Fluent Forms. لا تحتاج إلى تثبيت الوظائف الإضافية المختلفة بشكل منفصل مثل منشئي النماذج الآخرين ولا تحتاج إلى تخصيص النموذج خارج Elementor.

فيما يلي خطوات إنشاء نماذج جهات اتصال Elementor باستخدام Fluent Forms

قم بتثبيت وتنشيط Fluent Forms Pro

يشبه تثبيت Fluent Form تثبيت أي ملحقات WordPress أخرى. يمكنك تثبيته وتنشيطه من لوحة معلومات WordPress الخاصة بك أو تنزيله من WordPress.org إذا كنت تريد ذلك.

للتثبيت من لوحة تحكم WordPress ، انتقل إلى لوحة إدارة WordPress وانقر فوق Plugins → Add New. الآن ، ابحث عن Fluent Forms ، وانقر فوق Install ، ثم Activate the plugin.

للتنزيل من WordPress.org ، انقر فوق رابط Fluent Forms وقم بتنزيله. انتقل الآن إلى لوحة إدارة WordPress الخاصة بك وانقر فوق خيار إضافة جديد من الإضافات. الآن قم بتحميل ملف .zip وابحث عن Fluent Forms في قائمة المكونات الإضافية المثبتة ، انقر فوق تنشيط.

على الرغم من أن Fluent Forms تحتوي على عدد هائل من الحقول والوظائف في الإصدار المجاني ، فأنت بحاجة إلى الترقية إلى الإصدار المحترف للوصول إلى جميع ميزات نماذج Fluent Forms. راجع Fluent Forms Pro مقابل الميزات المجانية هنا.

الترقية إلى الإصدار الاحترافي بسيطة جدًا ، انقر فوق الرابط لمعرفة كيفية الترقية إلى Fluent Forms Pro.

قم بعمل نموذج اتصال Elementor

باستخدام Fluent Forms ، يمكنك إنشاء أشكال جميلة ومبتكرة في غضون دقائق. لإنشاء نموذج اتصال Elementot ، انتقل إلى لوحة معلومات WordPress الخاصة بك وقم بالمرور فوق نماذج Fluent Forms من الجانب الأيسر. انقر فوق خيار النموذج الجديد.

ستظهر صفحة جديدة ، انقر فوق "نموذج فارغ جديد" وسيتم إعادة توجيهك إلى واجهة محرر النموذج.

أضف الحقول حسب اختيارك لإنشاء نموذج اتصال لموقع الويب الخاص بك. لقد أضفنا خيار الاسم والبريد الإلكتروني والموضوع ورسالتك لنموذج اتصال Elementor البسيط.

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

الآن احفظ النموذج وانسخ الرمز القصير. يمكنك استخدام ميزة الرمز المختصر لـ Fluent Forms التي تعمل مع جميع منشئي الصفحات المتاحين بما في ذلك Elementor و Oxygen و Divi و Visual Composer وما إلى ذلك. وتمنحك هذه الميزة دعمًا مباشرًا لعنصر واجهة المستخدم Elementor في النموذج الخاص بك ، من أجل استخدام مكون إضافي واحد.

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

افكار اخيرة

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

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

احصل على Fluent Forms Pro

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