كيفية تخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce

نشرت: 2022-02-07

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

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

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

لماذا تخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce؟

يمكن أن يساعد تخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce في جعل موقع الويب الخاص بك أكثر سهولة في الاستخدام وزيادة التحويلات.

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

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

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

يمكن أن يساعدك تخصيص استمارات تسجيل الدخول والتسجيل في WooCommerce في تقديم تجربة مستخدم محسّنة في متجرك عبر الإنترنت.

تخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce

باستخدام ProfilePress ، من السهل تخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce وجعلها تبدو تمامًا كما تريدها.

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

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

الخطوة # 1: تثبيت وتفعيل ProfilePress

ابدأ بالحصول على المكون الإضافي ProfilePress وتثبيته على موقع WordPress الخاص بك. انتقل إلى الإضافاتإضافة جديد باستخدام لوحة إدارة WordPress وانقر على زر إضافة جديد . قم بتحميل الملف المضغوط وتثبيت البرنامج المساعد على موقع WordPress الخاص بك.

الخطوة # 2: تخصيص استمارات تسجيل الدخول والتسجيل

أول شيء يتعين علينا القيام به هو البدء في إنشاء نموذج تسجيل الدخول المخصص باستخدام ProfilePress. للقيام بذلك ، انتقل إلى ProfilePress → Forms & Profiles وانقر فوق الزر إضافة جديد ضمن قسم تسجيل الدخول . انقر فوق Drag & Drop Builder وحدد نموذجًا. لغرض هذا العرض التوضيحي ، اخترنا قالب Bash .

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

منشئ نموذج تسجيل الدخول المخصص

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

انتقل إلى Pages → Add New لإنشاء صفحة جديدة وإضافة الرمز المختصر لنموذج تسجيل الدخول إلى الصفحة. انقر فوق الزر " نشر " للمتابعة.

الآن ، سننشئ نموذج التسجيل ونضيفه إلى صفحة WordPress جديدة. للقيام بذلك ، انتقل إلى ProfilePress → Forms & Profiles وانقر فوق الزر إضافة جديد ضمن قسم التسجيل .

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

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

لإنشاء صفحة تسجيل جديدة في WordPress ، انتقل إلى Pages → Add New والصق الرمز المختصر لنموذج التسجيل. انقر فوق الزر " نشر " للمتابعة.

الخطوة # 3: اعرض استمارات تسجيل الدخول والتسجيل في الواجهة الأمامية

توجه إلى ProfilePress → Settings ثم انقر فوق علامة التبويب General . أضف صفحات تسجيل الدخول والتسجيل المخصصة المنشأة حديثًا إلى متجرك باستخدام القوائم المنسدلة وانقر على زر حفظ التغييرات للمتابعة.

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

الخطوة رقم 3.5: استبدال نماذج تسجيل الدخول والتسجيل في WooCommerce

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

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

الخطوة # 4: أضف الحقول المخصصة إلى صفحة الخروج

يمكنك أيضًا إضافة حقول مخصصة إلى صفحة الخروج لمتجر WooCommerce الخاص بك. للقيام بذلك ، ما عليك سوى الانتقال إلى ProfilePress → Settings والنقر فوق علامة التبويب Custom Fields .

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

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

بمجرد أن تصبح جاهزًا ، انقر فوق الزر حفظ التغييرات للمتابعة.

بعد ذلك ، انتقل إلى ProfilePress → Settings وانقر فوق علامة التبويب WooCommerce . أضف الحقول المخصصة في مربع التعريف " حقول التسجيل المطلوبة " وانقر فوق الزر " حفظ التغييرات " للمتابعة.

سيتمكن المستخدمون من رؤية الحقول المخصصة في صفحة تسجيل الخروج عند الخروج من متجرك عبر الإنترنت

.

بالإضافة إلى ذلك ، نريد أيضًا عرض نموذج تسجيل الدخول المخصص على صفحة الخروج واستبدال النموذج الافتراضي. للقيام بذلك ، ما عليك سوى الانتقال إلى ProfilePress → Settings والنقر فوق علامة التبويب WooCommerce .

حدد نموذج تسجيل الدخول المخصص باستخدام القائمة المنسدلة بجوار نموذج تسجيل الدخول إلى Checkout وانقر على زر حفظ التغييرات للمتابعة. سيحل هذا محل نموذج تسجيل الدخول الافتراضي في صفحة الخروج لموقع WooCommerce الخاص بك.

تخصيص نموذج تسجيل الدخول إلى WooCommerce الخروج

المكافأة: قم بإنشاء صفحة WooCommerce مخصصة "حسابي"

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

يتيح لك ProfilePress إنشاء صفحة WooCommerce "حسابي" مخصصة بالكامل حيث يمكن للمستخدمين بسهولة عرض حسابات المستخدمين الخاصة بهم وكذلك تحريرها ، كل ذلك من صفحة واحدة. للقيام بذلك ، انتقل إلى Profile Press → Forms & Profiles وانقر فوق الزر Add New .

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

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

الآن بعد أن أنشأنا نموذج "حسابي" ، نحتاج إلى إنشاء صفحة WordPress حتى نتمكن من عرضها على موقع الويب الخاص بك. انتقل إلى Pages → Add New والصق الرمز المختصر لتعديل ملف التعريف. انقر فوق الزر " نشر " بمجرد الانتهاء.

وفيما يلي معاينة لنموذج تعديل الملف الشخصي المخصص.

أو يمكنك فقط تخطي العملية بأكملها واستخدام الرمز المختصر لـ ProfilePress My Account في الصفحة التي تم إنشاؤها أعلاه بدلاً من ذلك.

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

يمكنك أيضًا السماح للمستخدمين بمشاهدة طلباتهم وتنزيلاتهم واشتراكاتهم وعضويتهم من خلال الانتقال إلى ProfilePress → Settings. انقر فوق علامة التبويب WooCommerce ، وحدد علامات التبويب التي تريد عرضها في إعداد علامات التبويب حسابي.

خاتمة

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

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

هل أنت مستعد لتخصيص نماذج تسجيل الدخول والتسجيل في WooCommerce على موقع الويب الخاص بك؟ احصل على ProfilePress اليوم!