كيفية إضافة حقول مختارة بواسطة Select2 في نموذج تسجيل WordPress؟

إذا كنت ترغب في إنشاء نماذج تسجيل متقدمة ، يمكنك استخدام حقول Select2 WordPress بدلاً من حقل Select.

أتساءل كيف يمكنك فعل ذلك؟ حسنًا ، أنت في المكان الصحيح!

في هذه المقالة ، ستتعرف على ماهية حقل WordPress Select2 وأهميته واختلافه عن حقل التحديد القياسي.

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

ما هو Select2؟ كيف يختلف عن التحديد القياسي؟

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

الآن ، يجب أن تتساءل عن كيفية اختلاف حقل Select2 عن حقل التحديد القياسي. هيا نكتشف!

حدد مقابل Select2

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

يحتوي حقل Select2 على جميع العمليات التي يوفرها حقل التحديد القياسي. وبالتالي ، فإنه يسمح أيضًا للمستخدمين بتحديد أحد الخيارات المتاحة.

ومع ذلك ، يوفر Select2 مزيدًا من المرونة والتخصيص.

يمنح المستخدم مربع بحث حيث يمكنه الكتابة في الخيار. ثم يتم عرض خيار المطابقة تلقائيًا للمستخدم.

علاوة على ذلك ، تسهل حقول Select2 أيضًا وضع العلامات والتمرير اللانهائي ، على عكس حقول التحديد القياسية.

Select2 مقابل Multi Select2

تدعم تقنية Select2 مربعات الاختيار أحادية القيمة ومتعددة القيم. يُعرف مربع التحديد أحادي القيمة ببساطة باسم حقل Select2.

من ناحية أخرى ، يُشار إلى مربع التحديد متعدد القيم باسم حقل Multi Select2 أو Pillbox.

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

الاختلاف الرئيسي الوحيد هو أن Multi Select2 يتيح للمستخدمين اختيار خيارات متعددة من الخيارات المتاحة. تظهر جميع الخيارات التي يحددها المستخدم داخل الصندوق ، مثل علب الأقراص ، ومن هنا جاء الاسم.

هذه الميزة غير موجودة في حقل Select2 العادي.

لماذا تضيف حقل Select2 WordPress في نموذج التسجيل؟

ساعدتك مقدمة حقول Select2 على فهم هذه التقنية بشكل أفضل.

ولكن ما هي القيمة التي يضيفها إلى نموذج التسجيل؟ لماذا لا تستخدم فقط حقل التحديد القياسي للتسجيل؟

حسنًا ، دعنا نلقي نظرة على بعض الأسباب التي تجعلك تضيف حقل Select2 WordPress إلى نموذج التسجيل:

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

لهذا السبب نقترح إضافة حقل Select2 إلى نماذج التسجيل بدلاً من حقل Select القياسي.

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

أفضل طريقة لإضافة حقول Select2 في نموذج التسجيل

لا يسمح لك WordPress بإضافة حقول Select2 إلى نموذج التسجيل الافتراضي بدون ترميز شامل.

ولكن لماذا الاعتماد على الترميز عندما يمكنك استخدام حقول Select2 بطريقة أسهل بكثير؟

يساعدك المكون الإضافي تسجيل المستخدم على إدراج حقلي Select2 و Multi Select2 وتخصيصهما في نماذج التسجيل بدون تشفير.

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

إلى جانب ذلك ، يعد تسجيل المستخدم مكونًا إضافيًا لنموذج التسجيل.

وبالتالي ، يمكنك إنشاء نماذج تسجيل مخصصة غير محدودة مع حقول Select2 لموقعك. كما أن واجهة أداة السحب والإفلات تجعل العملية سريعة للغاية!

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

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

في الوقت الحالي ، دعنا ننتقل إلى الدليل خطوة بخطوة ، حيث سنستخدم تسجيل المستخدم لتوضيح العملية.

كيفية إضافة حقل Select2 في نموذج تسجيل WordPress؟

فيما يلي دليل كامل لإضافة حقول WordPress Select2 في نموذج التسجيل.

قم بتنفيذ جميع الخطوات بعناية ، ويجب أن يكون لديك نموذج تسجيل مخصص مع حقل Select2 جاهز في أي وقت من الأوقات!

الخطوة 1: إعداد User Registration Pro

الخطوة الأولى هي تثبيت وتنشيط User Registration Pro على موقع الويب الخاص بك. إنه الإصدار المتميز من المكون الإضافي المجاني لتسجيل المستخدم.

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

بعد ذلك ، قم بإعداد User Registration Pro على موقع الويب الخاص بك. إذا كنت بحاجة إلى مساعدة للقيام بذلك ، فاتبع دليلنا حول كيفية تثبيت تسجيل المستخدم بشكل صحيح.

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

الخطوة 2: تثبيت وتنشيط الوظيفة الإضافية الحقول المتقدمة

يتيح لك User Registration Pro الوصول إلى الوظيفة الإضافية Advanced Fields.

كما يوحي الاسم ، فإنه يضيف العديد من الحقول المتقدمة إلى منشئ النماذج ، بما في ذلك حقلي Select2 و Multi Select2.

لذلك ، لاستخدامها ، يجب عليك تثبيت وتفعيل الوظيفة الإضافية Advanced Fields .

يمكنك القيام بذلك بسهولة من تسجيل المستخدم >> صفحة الإضافات على لوحة معلومات WordPress الخاصة بك.

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

الآن ، أنت جاهز لاستخدام حقول Select2 WordPress في نموذج التسجيل الخاص بك.

الخطوة 3: قم بإنشاء نموذج تسجيل جديد مع Select2 Fields

في الخطوة الثالثة ، لنقم بإنشاء نموذج تسجيل جديد حيث يمكنك إضافة حقول Select2.

ابدأ بالانتقال إلى تسجيل المستخدم >> إضافة جديد .

كما ترى ، يمكنك اختيار قالب مصمم مسبقًا لبداية سريعة.

يقدم تسجيل المستخدم نماذج متنوعة مثل نموذج تسجيل الطالب ونموذج إرسال الإعلان والمزيد.

خلاف ذلك ، يمكنك البدء في إنشاء نموذج التسجيل من البداية. انقر فوق Start From Scratch وقم بتسمية النموذج.

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

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

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

والأهم من ذلك ، تأكد من إضافة حقول Select2 إلى النموذج.

يأتي تسجيل المستخدم مع نوعين من حقول Select2: Select2 و Multi Select2 . يمكنك إضافة أي من هذه الحقول إلى النموذج وفقًا لمتطلباتك.

عند الانتهاء ، اضغط على زر تحديث النموذج في الأعلى.

لذلك ، قمت بإنشاء نموذج تسجيل جديد باستخدام حقل Select2 WordPress.

الخطوة 4: تخصيص حقلي Select2 و Multi Select2

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

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

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

الاعدادات العامة

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

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

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

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

تتيح لك الإعدادات المتقدمة إضافة فئات CSS مخصصة للحقل. يمكنك أيضًا السماح بتعبئة الحقل ديناميكيًا عن طريق توفير اسم معلمة.

من المهم ملاحظة أن خيارات الحقول تختلف باختلاف حقل النموذج.

على سبيل المثال ، يحتوي حقل Multi Select2 على إعدادات عامة مماثلة. ومع ذلك ، تقدم الإعدادات المتقدمة خيارين جديدين:

• حد الاختيار: قم بتعيين الحد الأقصى لعدد الاختيارات التي يمكن للمستخدم تحديدها.
• تحديد الكل: تمكين المستخدمين من تحديد جميع الخيارات المتاحة في القائمة.

لذلك ، قم بتخصيص كل حقل وفقًا لذلك واضغط على زر تحديث النموذج .

الخطوة 5: تكوين إعدادات نموذج التسجيل

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

للقيام بذلك ، انتقل إلى علامة التبويب "إعدادات النموذج" في المنشئ. هنا ، يمكنك تكوين نوعين من الإعدادات: عام وإضافات .

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

يمكنك أيضًا تمكين كلمات مرور قوية ودعم CAPTCHA. بصرف النظر عن ذلك ، يمكنك تعيين عنوان URL لإعادة التوجيه وإرسال نص الزر وفئة النموذج والمزيد.

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

عندما تنتهي من التكوين ، اضغط على زر تحديث النموذج .

الخطوة 6: اعرض نموذج التسجيل المخصص على موقعك

أخيرًا ، نموذج التسجيل الخاص بك مع حقل Select2 جاهز للنشر على موقعك.

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

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

بعد ذلك ، حدد زر الاختيار "نموذج التسجيل" واختر النموذج الذي قمت بإنشائه مسبقًا من القائمة المنسدلة.

أخيرًا ، اضغط على زر التحديث في الجزء العلوي لجعل النموذج مباشرًا على موقعك.

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

تهانينا! الآن ، يحتوي موقع الويب الخاص بك على نموذج تسجيل مخصص مع حقل Select2 WordPress.

تغليف!

بهذا نختتم مقالتنا حول كيفية إضافة حقول Select2 WordPress في نموذج التسجيل.

للتلخيص ، يمكنك إضافة حقول Select2 بدلاً من حقول Select القياسية لإنشاء نماذج تسجيل أكثر تقدمًا.

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

بالإضافة إلى ذلك ، يعد تسجيل المستخدم مفيدًا بنفس القدر في منع تسجيل البريد العشوائي ، وتغيير عنوان URL الافتراضي لتسجيل الدخول إلى عنوان URL مخصص ، والمزيد.

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

أيضًا ، تابعنا على Twitter و Facebook لتبقى على اطلاع بالمقالات الجديدة.