كيفية إضافة HTML لإظهار محتوى إضافي في نموذج تسجيل WordPress؟

هل تريد معرفة كيفية إضافة HTML لإظهار محتوى إضافي في نموذج تسجيل WordPress؟ إذا كانت الإجابة بنعم ، فهذا المقال لك!

HTML (Hyper Text Mark Up Language) هي لغة ترميز تُستخدم لإنشاء صفحات الويب من البداية.

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

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

أدناه ، قمنا بإعداد دليل بسيط لنوضح لك كيفية إضافة HTML إلى نموذج التسجيل في WordPress. لنبدأ!

ما هو حقل نموذج HTML؟ لماذا تضيف HTML في نموذج التسجيل في ووردبريس؟

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

ولكن مع حقل نموذج HTML في WordPress ، لا داعي للقلق. لا يستخدم حقل HTML سوى الحد الأدنى من الترميز ، وهو أمر سهل للغاية لفه ذهنك.

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

إلى جانب ذلك ، فإن المجال مفيد لعدة أسباب أخرى:

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

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

مع ذلك ، دعنا نستكشف أفضل طريقة لإضافة HTML في نموذج تسجيل WordPress.

أفضل طريقة لإضافة حقل HTML في نماذج التسجيل لإظهار المحتوى الإضافي

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

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

هناك الكثير من الخيارات للاختيار من بينها. ومع ذلك ، نقترح المكون الإضافي User Registration ، وهو مكون إضافي لنموذج التسجيل بالسحب والإفلات.

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

بالإضافة إلى ذلك ، يتيح لك تسجيل المستخدم:

• قم بإنشاء حساب ملف تعريف مستخدم بديهي ومصمم جيدًا مع صورة ملف تعريف.
• تصدير نماذج التسجيل بنقرة واحدة واستيرادها على نفس الموقع أو موقع مختلف.
• إنشاء استمارات تسجيل متعددة الخطوات بسهولة.
• قم بإنشاء نماذج تسجيل WooCommerce ومزامنتها مع صفحة الخروج.

ولكن قبل كل شيء ، يأتي المكون الإضافي الغني بالميزات مع العديد من الوظائف الإضافية ، بما في ذلك الوظيفة الإضافية Advanced Fields.

تساعدك هذه الوظيفة الإضافية في فتح الحقول المتقدمة مثل حقل HTML لنموذج التسجيل الخاص بك. وهذا بالضبط ما تحتاجه هنا.

نظرًا لميزاته القوية ، سنستخدم تسجيل المستخدم لهذا البرنامج التعليمي.

دليل خطوة بخطوة لإضافة HTML في نموذج التسجيل في WordPress

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

الخطوة 1: تثبيت وتنشيط User Registration Pro

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

ولإلغاء قفل هذا الحقل ، ستحتاج إلى الوظيفة الإضافية Advanced Fields ، والتي تأتي فقط مع الإصدار المتميز من المكون الإضافي.

عملية تثبيت User Registration Pro بسيطة للغاية. ما عليك سوى زيارة الموقع الرسمي للمكون الإضافي ، حيث سترى 3 خطط تسعير مختلفة.

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

بعد ذلك ، ستتلقى رابطًا إلى بريدك الإلكتروني. اتبع الرابط والوصول إلى لوحة معلومات حسابك.

من هناك ، يمكنك تنزيل الإصدار الاحترافي من المكون الإضافي والحصول على مفتاح الترخيص ضمن علامة التبويب L icense Key .

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

بعد ذلك ، اختر ملف User Registration Pro المضغوط الذي قمت بتنزيله من قبل واضغط على التثبيت الآن .

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

إذا كنت بحاجة إلى عملية التثبيت والإعداد بأكملها بالتفصيل ، فاتبع هذا الرابط حول كيفية تثبيت User Registration Pro.

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

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

الآن بعد أن أصبح لديك الإصدار المتميز ، يمكنك الوصول بسهولة إلى الوظيفة الإضافية Advanced Fields .

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

بعد ذلك ، انقر فوق الزر Install Add-on واضغط على Activate بالتسلسل. وبهذه الطريقة ، لديك الوظيفة الإضافية Advanced Fields الخاصة بك.

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

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

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

يُظهر الإصدار المتميز أن معظم القوالب الخاصة بك غير مؤمنة.

هنا ، سنستخدم نموذج نموذج تسجيل الطالب لهذا البرنامج التعليمي. يمكنك التمرير فوق النموذج المطلوب والنقر فوق الزر "البدء" .

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

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

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

لذلك ، قم بسحبه وإفلاته في القسم المناسب من نموذج التسجيل.

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

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

وبالتالي ، انقر فوق حقل HTML ، وقم بتحرير ما يلي:

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

بنفس الطريقة ، قم بتحرير خيارات الحقول لبقية الحقول أيضًا.

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

بعد اكتمال التخصيص ، احفظه بالنقر فوق الزر تحديث النموذج .

يجب أن تعلم أن محتوى حقل HTML لن يتم عرضه في منشئ النموذج. ولكن يمكنك دائمًا معاينته لترى كيف تبدو في الواجهة الأمامية.

هذه هي الطريقة التي يظهر بها النموذج للمستخدمين على الويب.

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

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

ستجد خيار إعدادات النموذج بجوار خيارات الحقل مباشرة.

سيؤدي النقر فوقه إلى نقلك إلى الإعدادات العامة . ومن هنا يمكنك تخصيص الخيارات التالية:

• خيار موافقة المستخدم وتسجيل الدخول : يمكنك تعيين معايير الموافقة وتسجيل الدخول المخصصة للمستخدمين من القائمة المنسدلة.
• دور المستخدم الافتراضي : يتيح لك المكون الإضافي تعيين دور المستخدمين المسجلين في النموذج الخاص بك. يمكنك الاختيار من بين 6 أدوار مستخدم افتراضية مثل المسؤول ، والمشترك ، والمؤلف ، وما إلى ذلك.
• تمكين كلمة مرور قوية : حدد خانة الاختيار وحدد القوة التي تريدها لكلمة مرور المستخدم.
• عنوان URL لإعادة التوجيه : يتيح لك هذا الخيار إضافة عنوان URL لإعادة التوجيه للمستخدمين بعد التسجيل بنجاح.
• إرسال فئة الزر : يمكنك إدخال أسماء فئة CSS فردية أو متعددة بشكل منفصل لزر الإرسال.
• إرسال نص الزر : أدخل النص المطلوب لزر الإرسال. يمكنك استخدام مصطلحات مثل "تطبيق" و "الانضمام الآن" وما إلى ذلك.
• موضع رسالة النجاح : يمكنك اختيار موضع رسائل النجاح ، مثل الأعلى أو الأسفل.
• تمكين دعم Captcha : يمكنك تمكين دعم CAPTCHA للحماية من البريد العشوائي والبوت.
• قالب النموذج : اختر من بين 5 أنماط مختلفة للقالب للنموذج باستخدام القائمة المنسدلة.
• فئة النموذج : أضف أسماء فئة CSS مفردة أو متعددة لملف النموذج.

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

يمكنك تمكين العديد من خيارات الحماية المهمة ، مثل تنشيط كلمة المرور المُنشأة تلقائيًا للمستخدمين ، وتنشيط الحماية من البريد العشوائي بواسطة HoneyPot ، وتمكين مجال القائمة البيضاء / القائمة السوداء .

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

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

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

الخطوة 5: انشر استمارة التسجيل على موقع الويب الخاص بك

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

لتضمين النموذج في موقعك ، انتقل إلى Post / Pages >> Add New .

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

بعد ذلك ، حدد نموذج تسجيل الطالب في WordPress من القائمة المنسدلة.

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

يوجد أدناه صورة لكيفية ظهور النموذج الخاص بك في الواجهة الأمامية.

وأخيرًا ، إذا أعجبك شكل النموذج الخاص بك ، يمكنك الضغط على نشر .

افكار اخيرة!

هذا كل شيء؛ لقد وصلنا إلى نهاية مقالتنا. نأمل أن تكون قد تعلمت إضافة HTML في نموذج تسجيل WordPress لإظهار محتوى إضافي.

بفضل المكون الإضافي User Registration ، فإن إضافة حقل HTML في نموذج التسجيل أمر سهل للغاية. كل ما عليك فعله هو سحب الحقل وإفلاته في النموذج الخاص بك وتخصيصه.

وبالمثل ، يمكنك استكشاف "تسجيل المستخدم" للميزات ، مثل إضافة حقل كلمة مرور إلى نماذج التسجيل ، وتمكين موافقة مستخدم Woo-Commerce بواسطة المسؤول ، وما إلى ذلك.

يمكنك قراءة المزيد حول هذا البرنامج المساعد القوي على مدونتنا. وللحصول على دروس فيديو سهلة ، يمكنك الاشتراك في قناتنا على YouTube.

إذا كانت لديك استفسارات حول المكون الإضافي ، فاتصل بنا عبر وسائل التواصل الاجتماعي. نحن متواجدون على Facebook و Twitter.