كيفية إنشاء نموذج اتصال في WordPress بدون إضافة

نشرت: 2022-09-11

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

أفضل طريقة لإنشاء نموذج اتصال WordPress بدون أي مكونات إضافية هي استخدام WordPress نفسه. سوف تحتاج إلى إنشاء قالب الصفحة. يجب تطوير النموذج في الخطوة الثانية. يجب عليك التحقق مما إذا كان قد تم تقديم النموذج ، وكذلك ما إذا كانت الحقول قد تم ملؤها بشكل صحيح. سيتم عرض الأخطاء المتعلقة بمعالجة البيانات ومعالجة الأخطاء للمستخدم. يجب تنزيل المكون الإضافي للتحقق وتحميله في دليل السمات / js (ضمن المكون الإضافي للتحقق من الصحة). الخطوة 2: بعد نسخ الملف التالي ، أعد تسميته.

يمكنك استخدام الدليل / js لحفظه كملف verif.js. في الخطوة 3 ، يجب علينا ربط المكون الإضافي بموضوع WordPress. الخطوة الرابعة هي استخدام المكون الإضافي Validate jQuery للتحقق من جانب العميل. نتيجة لذلك ، يمكنك التأكد من ملء النموذج بشكل صحيح وأنه تم إكماله في الوقت المناسب.

هل يوجد نموذج اتصال مجاني لبرنامج WordPress؟

الائتمان: formidableforms.com

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

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

يمكن استخدام علامة تبويب البريد لتغيير عنوان البريد الإلكتروني الذي يظهر في نماذج جهات الاتصال وكذلك لتعديل بعض الخيارات الإضافية المتعلقة بتخطيط البريد الإلكتروني. تحتوي علامة التبويب "الرسائل" على قائمة طويلة من الحقول التي يمكنك من خلالها تغيير النص القياسي لأي رسالة. يتضمن الإصدار المجاني حقولًا مثل الاسم وعنوان البريد الإلكتروني ورقم الهاتف وعنوان URL والتاريخ والوقت. Formidable هو منشئ نماذج WordPress بواجهة جذابة ومجموعة متنوعة من القوالب. في إصدار Pro ، هناك المزيد من القوالب والحقول التي يجب ملؤها ، بما في ذلك تحميل الصور والملفات ، مقابل 99 دولارًا لكل ترخيص من خمسة مواقع. يمكنك أيضًا إضافة عدد كبير من الحقول المميزة مقابل 99 دولارًا إلى 699 دولارًا ، بنطاق سعري من 99 دولارًا إلى 599 دولارًا. تتمتع Formidable Ninja Forms أيضًا بتصنيف رائع من 4 نجوم ونصف.

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

نموذج اتصال بسيط لـ WordPress

الائتمان: WPForms

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

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

باستخدام WPForms Lite ، يمكنك إنشاء نماذج اتصال مجانية جميلة في WordPress وتخصيصها باستخدام رموز التحقق مثل reCAPTCHA 2 و 3. في WordPress ، يمكنك إنشاء نموذج متعدد الخطوات إذا كنت تريد إنشاء نموذج أطول. قد ترغب أيضًا في التحقق من هذه الاختراقات الذكية لنماذج الويب التي يمكن أن تساعدك في الكشف عن معلومات العميل المخفية.

نموذج اتصال WordPress Ajax بدون البرنامج المساعد

الائتمان: WPForms

أصبحت نماذج اتصال Ajax شائعة بشكل متزايد لأنها توفر طريقة سريعة وسهلة لإرسال المعلومات دون الحاجة إلى إعادة تحميل الصفحة. هناك عدة طرق لإنشاء نموذج اتصال Ajax دون استخدام مكون إضافي. طريقة واحدة هي استخدام jQuery Form Plugin . يتيح لك هذا المكون الإضافي إرسال المعلومات عبر Ajax دون الحاجة إلى كتابة أي رمز مخصص. هناك طريقة أخرى وهي استخدام WordPress API. تحتوي واجهة برمجة تطبيقات WordPress على وظيفة تسمى wp_ajax_nopriv_contact_form تتيح لك إرسال المعلومات عبر Ajax دون استخدام مكون إضافي.

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

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

كيفية إنشاء نموذج php في ووردبريس

لإنشاء نموذج php في ووردبريس ، ستحتاج إلى تثبيت مكون إضافي مثل Gravity Forms. بمجرد التثبيت ، ستحتاج إلى إنشاء نموذج في واجهة البرنامج المساعد. بمجرد إنشاء النموذج ، ستحتاج إلى نسخ الكود ولصقه في منشور أو صفحة على موقع Wordpress الخاص بك.

الرمز المختصر لنموذج الاتصال في ووردبريس

كيف أقوم بإضافة نموذج اتصال إلى مقال؟ لإضافة نموذج جهة اتصال ، انتقل إلى صفحة جهة الاتصال (جهة اتصال). لكل نموذج اتصال رمز قصير خاص به ، مثل [contact-form-7 id = 1234 ″ title = Contact form 1 ″].