ساخت فرم ورود و عضویت در وردپرس با افزونه‌ user registration (بخش اول)


نویسنده:
یکشنبه ۱۵ اردیبهشت ۱۳۹۸
۸,۲۲۰ بازدید
ساخت فرم عضویت و ورود در وردپرس

ساخت فرم ورود و عضویت در وردپرس به زبان فارسی همواره از نیازهای ادمین سایت‌ها بوده است. یک افزونه‌ی مناسب می‌تواند یک صفحه‌ی ورود و عضویت را بدون نیاز به برنامه نویسی به صورت ایمن، زیبا و پرکاربرد برای وب‌سایتتان ایجاد کند.
پس برای ایجاد یک فرم ورود و عضویت در وردپرس با ما همراه باشید.

ضرورت ساخت یک فرم ورود و عضویت در وردپرس

اگر شما وب‌سایتی دارید که در آن لازم است کاربران برای دست‌یابی به بخشی از وب‌سایت، ثبت نام نمایند، (مثلاً برای نوشتن مطلب یا ثبت نظر، خرید محصول و…) به یک فرم جهت عضویت کاربران و یک فرم جهت ورود کاربران عضو شده نیاز دارید.
وردپرس به‌صورت پیش‌فرض فرمی را جهت ورود کاربر به سایت در آدرس yourdomain.com/wp-login.php قرار داده است. (به جای yourdomain.com آدرس سایت خود را وارد نمایید.)
ظاهر تکراری و ساده‌ی این فرم پیش‌فرض باعث می‌شود استفاده از آن برای کاربران خسته‌کننده باشد.
پس پیشنهاد می‌کنیم حتماً از یک فرم ورود و عضویت در وردپرس با طرح جذاب‌تر و ایمن‌تر استفاده نمایید.

افزونه‌ی ساخت فرم ورود و عضویت در وردپرس

افزونه‌های زیادی برای ساخت فرم لاگین در وردپرس وجود دارند. ما در این آموزش به معرفی افزونه‌ی User Registration پرداخته‌ایم.

مزایای استفاده از افزونه User Registration:

  • رایگان و پرکاربرد
  • طراحی فرم به‌صورت ساده با drag and drop
  • قابلیت ایجاد فرم ثبت‌ نام و ورود
  • قابلیت ایجاد پنل کاربری
  • قابلیت ترجمه به زبان‌های مختلف
  • قابلیت نمایش در بخش‌های مختلف سایت به کمک short code
  • پشتیبانی از  google reCaptcha
  • و….

ایجاد فرم عضویت کاربر با افزونه User Registration

برای ساخت فرم ثبت‌ نام در وردپرس به کمک این افزونه مراحل زیر را گام‌به‌گام انجام دهید.

گام اول: تنظیمات وردپرس

در پنل وردپرس وارد بخش تنظیمات عمومی وردپرس شوید و به کاربران اجازه نام‌نویسی دهید. اگر این بخش فعال نباشد فقط ادمین سایت می‌تواند کاربری را نام‌نویسی کند.

فرم ثبت نام کاربر در سایت با افزونه

گام دوم: نصب افزونه

وارد بخش افزونه‌ها > افزودن شوید و نام افزونه (User Registration) را در باکس جستجو نمایید. سپس افزونه را مانند سایر افزونه‌ها نصب و فعال نمایید.
همچنین می‌توانید با کلیک بر روی دکمه‌ی زیر افزونه را از وب‌سایت وردپرس دانلود نماید.

دانلود افزونه user registration

گام سوم: ایجاد فرم دلخواه

۱- ایجاد فرم عضویت

بعد از نصب افزونه بخش جدیدی به نام User Registration به پنل وردپرس اضافه می‌شود. از این قسمت دکمه‌ی add new را بزنید.
در این صفحه می‌توانید فرم ورود و عضویت در وردپرس را به سبک دلخواه خود را بسازید.
در بخش بالایی صفحه نام مناسب برای فرم خود را وارد نمایید.
در سمت راست این افزونه سه بخش fields، field options و form setting قرار دارد. در بخش fields فیلد‌های دلخواه خود را درون فرم بکشید و رها کنید.(بخش چپ)

ساخت فرم ثبت نام در وردپرس بدون کد نویسی

این افزونه برای ساخت یک فرم عضویت فیلدهای متنوعی را در اختیار شما قرار داده است. فیلدهای مناسب برای یک فرم عضویت مانند ایمیل، نام کاربری، پسورد و… را در فرم قرار دهید سپس دکمه‌ی create form را بزنید.

۲- تنظیمات فیلدها

اکنون فرم مدنظر شما ساخته‌شده است اما عبارات به زبان فارسی نیستند و ممکن است محدودیت‌های مدنظر شما بر روی فیلدها وجود نداشته باشند.
برای تنظیم کردن هر فیلد در فرم کافی است اشاره‌گر موس را روی آن فیلد قرار دهید تا دو دکمه‌ی trash و clone ظاهر شود. بر روی دکمه‌ی clone کلیک نمایید تا در سمت راست صفحه بخش field options باز شود.

 فرم عضویت در وردپرس

تنظیمات متنوعی برای هر نوع فیلد در نظر گرفته‌شده است که پایه‌ای‌ترین آنها عبارتند از:

Label:  از این قسمت عنوان فیلد را فارسی کنید.

Description: توضیحات اضافی برای فیلد

Placeholder: متن کم‌رنگی که داخل فیلد نوشته می‌شود.

Required: اجباری بودن تکمیل فیلد برای کاربر

Hide Label: مخفی کردن عنوان فیلد

Custom Class: اضافه کردن کلاس‌های دلخواه به این فیلد

۳- تنظیمات  فرم عضویت

برای تنظیمات فرم ایجاد شده از بخش راست دکمه‌ی form setting را بزنید.
تنظیمات این بخش عبارتند از:

Default User Role: نقش کاربر ثبت نام شده (ترجیحاً آن را روی subscriber یا همان مشترک قرار دهید تا پایین‌ترین دسترسی را به کاربران بدهید.)

Enable Strong Password: سنجش میزان قوی بودن رمز عبور در فرم

Minimum Password Strength: حداقل قدرت رمز عبور قابل قبول

Form Submit Button Label: عنوان دکمه‌ی ارسال فرم (به فارسی ترجمه کنید.)

Enable reCaptcha Support: فعال‌سازی reCaptcha در این فرم

Form Template: ظاهر فرم (انتخاب ظاهر فیلد‌های فرم به‌صورت دایره، با حاشیه، مستطیلی و..)

Custom CSS class: افزودن کلاس‌های css دلخواه

بعد از اعمال تنظیمات create form را بزنید.

گام چهارم: استفاده از فرم ایجاد شده

با کمک شورت کدی که افزونه به شما می‌دهد، فرم طراحی شده در همه‌ی بخش‌های سایت قابلیت نمایش دارد. کافیست short code تولید شده را کپی نمایید و در صفحه یا برگه‌ی مدنظر خود paste کنید.

ساخت فرم ثبت نام در وردپرس

برای این کار وارد بخش برگه‌ها > افزودن برگه شوید. نام و slug دلخواه را وارد کنید و کد را paste کنید. همچنین می‌توانید دکمه‌ی add Registration form را بزنید و فرم ساخته شده را انتخاب نمایید تا کد در این صفحه paste شود.

ساخت فرم لاگین در وردپرس

بدین ترتیب فرم ثبت نام کاربران به راحتی ساخته شد.
برای فارسی شدن خطاهای فرم بخش بعدی را دنبال کنید.

تنظیمات هشدارها

از بخش User Registration وارد setting شوید. تب general دارای ۴ زیر بخش است. گزینه‌ی اول General Options را بزنید.
در بخش User login option نحوه لاگین کردن کاربر بعد از ثبت نام را مشخص کنید. (ورود مستقیم بعد از ثبت نام، دریافت کد فعال‌سازی با ایمیل و..)
برای مثال اگر می‌خواهید ثبت نام کاربر با ارسال ایمیل فعال‌سازی انجام شود گزینه‌ی Email confirmation to login را انتخاب کنید. یا اگر ترجیح می‌دهید بلافاصله بعد از ثبت نام، کاربر با رمز عبور انتخابی خود وارد شود گزینه‌ی manual login را انتخاب کنید.

ساخت صفحه‌ی ورود در وردپرس

در زیر بخش سوم frontend messages مدیریت می‌شوند. در این بخش تمام پیغام‌هایی که افزونه به کاربر نمایش می‌دهد مشخص است. شما باید از این بخش پیغام‌ها را پاک نمایید و معادل فارسی آن را جایگزین کنید.

آزمایش فرم ایجاد شده

حالا برگه‌ا‌ی را که در آن فرم عضویت قرار دارد، باز کنید و یک ثبت‌نام آزمایشی انجام دهید.
سپس در پنل وردپرس به بخش کاربران > همه‌ کاربران بروید. در این بخش باید نام کاربر جدید اضافه شده باشد. حالا ایمیلی که از آن استفاده کرده‌اید را باز کنید. بر روی لینک ارسالی کلیک نمایید تا ثبت نام کامل شود.

لینک ارسالی به ایمیل قابل کلیک نیست؟

اگر ایمیلی که برای تایید ثبت‌نام برایتان ارسال می‌شود قابل کلیک نیست، وارد بخش Settings->Emails در این افزونه شوید. از بخش Email Confirmation برروی آیکون تنظیمات کلیک کنید. وارد صفحه‌ای می‌شوید که در آن قادرید متن ایمیل ارسالی را تغییر دهید.
اگر در متن ارسالی لینکی وجود ندارد، آن را خودتان به صورت زیر ایجاد کنید:




اکنون توانستید یک فرم ثبت‌نام برای کاربران خود ایجاد کنید. در بخش دوم این آموزش نحوه‌ی ایجاد فرم ورود، پروفایل کاربری و تنظیمات کلی افزونه را توضیح می‌دهیم. برای دسترسی به این مقاله از دکمه‌ی زیر استفاده کنید.


ساخت فرم ورود در وردپرس (بخش دوم)

مطالب زیر را حتما بخوانید

معرفی ۶ سایت آموزش رایگان طراحی سایت و برنامه نویسی

در این مقاله همراه ما باشید تا با ۶ وب‌سایت آموزش رایگان طراحی وب و برنامه‌نویسی آشنا شوید.

آموزش افزودن نقشه گوگل در صفحات وب‌سایت

یکی از صفحات مهم هر وب‌سایت که معمولاً توسط مشتری‌ها بررسی می‌شود، صفحه‌ی تماس با ما است. قرار دادن اطلاعات...

چگونه می‌توانیم طراح UI و UX شویم؟

 اگر با طراحی وب و دنیای آن آشنا باشید، حتما اسم طراحی ux و ui را شنیده‌اید؟ امروزه کسب‌وکارهای زیادی...

۷ اشتباه رایج برنامه‌نویسان مبتدی و تازه‌کار

همه‌ی برنامه‌نویسان در ابتدای راه اشتباهاتی را انجام می دهند که معمولاً ادامه‌ی کار را برای خود سخت‌تر می‌کنند. رایج‌ترین...

خطای ۵۰۳ چیست؟ چگونه آن را رفع کنیم؟

خطای ۵۰۳ یک خطا از سمت سرور است که باید به محض مشاهده‌ی آن از روش‌های رفع خطا استفاده کرده...

رفع خطای 404 پیوند یکتا در لوکال هاست (localhost)

بعضی اوقات ممکن است با تغییر پیوند یکتا در وردپرس، به خطای 404 بربخورید، برای رفع خطای 404 پیوند یکتا...

آموزش افزایش سرعت سایت

دوره آموزش افزایش سرعت وب‌سایت

مرورگر را باز می‌کنید و آدرس سایتتان را وارد می‌کنید. مرورگر شروع ...

دوره آموزش وردپرس فارسی

دوره آموزش وردپرس فارسی

در پکیج آموزش وردپرس فارسی یاد می‌گیرید که چطور از صفر و ...

دوره جامع آموزش سئو

دوره جامع آموزش سئو

دوره جامع آموزش سئو با هدف آموزش مفاهیم و ابزار‌های سئو به ...

دیدگاهتان را بنویسید

23 پاسخ به “ساخت فرم ورود و عضویت در وردپرس با افزونه‌ user registration (بخش اول)”

  1. علی محمدی گفت:

    درود به شما خانوم جعفر پور
    بی‌نهایت سپاسگذارم از لطفتون و از اشتراک این پست ارزشمند
    فقط و فقط یک مشکلی دارم اونم اینه که لینک فعالسازی که ارسال میشه قابل کلیک نیستش و چطور میتونم یکاری کنم که بشه روی روی لینک کلیک کرد تا ثبت نام کامل بشه
    من واسه همین مسئله کلی درگیر بودم و تا این افزونه رو معرفی کردید و همه تنظیمات رو انجام دادم و همچی به خوبی پیش رفت و همه فیلدها رو ترجمه کردم فقط تنها مشکلم اینه که لینک فعالسازی حساب کاربری قابل کلیک نیستش

  2. امين اسكندري گفت:

    باسلام و وقت بخیر
    لطفا نحوه ورود به قسمت پروفایل ایجاد شده برای کاربران رو هم بفرمایید و همچنین ویرایش پروفایل
    ممنونم

  3. کافه کتاب گفت:

    این افزونه۹ این قابلیت رو داره که کاربر رو برای مدت محدود نام نویسی کنه؟ مثلا یک ماه یا سه ماهه و بعد از منقضی شدن، اتومات به کاربر پیام بده که باید ثبت نامش رو تجدید کنه؟

  4. مهدی گفت:

    آیا افزونه ای وجود داره که بشه کاربرا بدون ایمیل ثبت نام کنن؟

  5. ابوالفضل گفت:

    سلام.آموزشی که گفتید رو انجام دادم.ایمیل ارسال نمیشه. و اینکه شورت کدی که گزاشتید [user_registration_my_account] رو در برگه ای که گفتید گزاشتم اما چنین فرمی که نشون دادید رو نمایش نمیده

    • سلام شورتکدی که مطابق تصویر افزونه به شما میده رو در یک برگه قرار بدید. اگر از گوتنبرگ استفاده می کنید یک بلاک شورتکد اضافه کنید و بعد شورتکد رو وارد کنبد.
      برای ایمیل هم همانطور که گفته شده در تنظیمات بخش User login option گزینه ی Email confirmation to login را انتخاب کنید.
      در ضمن اگر تست را در لوکال هاست انجام بدید ایمیل ارسال نمیشه.

  6. سارا گفت:

    سلام واقعا عالیه سایتتون ممنون

  7. مهدی گفت:

    سلام یکی هست به من بگه چطوری در وردپرس عضو بشم؟

  8. Pooya گفت:

    سلام/چطور لینک ثبت نام یا لاگین رو وقتی کاربر لاگین میکنه از نوار بالای سایت حذف کنم وهمچنین دسترسی به این صفحات رو هم ببندم.
    یعنی هم نمایش این دو لینک حذف بشه هم دسترسی بهشون؟

    • کافیه قبل از کدهای ایجاد کننده این دو لینک با یک if چک کنید که وقتی کاربر لاگین نکرده باشه دکمه‌ها نمایش داده شوند به این صورت:

      if(!is_user_logged_in()){ //login button }

      برای اینکه به صفحات لاگین هم دسترسی نداشته باشن می تونید کاربرهای لاگین کرده رو ریدایرکت کنید. مثلا به کمک کد زیر در فایل functions.php که باید آیدی برگه لاگین رو جای عدد ۱۲ بذارید:

      if( is_user_logged_in() && is_page(12) ){
      wp_redirect('mydomain.com/my-member-area/');
      exit;
      }

      (کد رو کپی کنید در ادیتورتون درست نمایش داده میشه!)

    • Pooya گفت:

      کد دومی رو که نوشتید در functions.php کپی میکنم ولی خطا میده

      منظورتون دقیقا از آیدی برگه چیست؟

    • این تابع خود وردپرسه اینم لینک تابع که می‌تونید کمک بگیرید. (ممکنه اشتباه سینتکس داشته باشید.)
      اگر قبلا برنامه نویسی نکردین بخاطر نیاز به کدنویسی بهتره از یک طراح وب‌سایت بخواین براتون انجام بدن.
      هر برگه یه آیدی داره می‌تونید زمانی که وارد بخش ویرایش برگه‌ها می‌شید در قسمت url‌ جلوی عبارت post‌مشاهده کنید.

      برای بخش اول سوال کامنت قبلیتون احتمالا توابع این مقاله هم کمکتون کنه: نمایش مشخصات کاربران در وردپرس

  9. نادری گفت:

    سلام .. وقت بخیر .. ممنون از مطلب ارزشمندتون .. یه سوال دارم ، addon های این افزونه رو چه شکلی میشه پیدا کرد ؟ برای ورود و عضویت با ایمیل

    • سلام جناب نادری، این افزونه به صورت پیش‌فرض قابلیت عضویت با ایمیل رو داره و نیازی به addon‌ نیست. برای سایر افزودنی‌ها می تونید در گوگل به انگلیسی سرچ کنید.

    • نادری گفت:

      منظورم با حساب جیمیل و اکانت شبکه های اجتماعی بود ، یه addon داره به نام socialconnect

    • فکر نمی‌کنم این addon که گفتید برای این افزونه باشه و باهاش هماهنگی داشته باشه. این افزونه addon‌‌های زیادی هم نداره. برای اینکار متفاوت بهتره از پلاگین‌های دیگه استفاده کنید که برای لاگین با شبکه‌های اجتماعی ساخته شده باشن.

    • نادری گفت:

      افزونه خوبی سراغ دارین که معرفی کنین بهم؟

    • خیر برای اینکار افزونه‌ای تست نکردیم. می‌تونید خودتون چند افزونه رو تست کنید تا ببنید کدوم برای هدف شما مناسب‌تره. مثل افزونه‌های زیر:
      Google Apps Login
      WordPress Social Login (Google, Twitter, Vkontakte)
      Sign In With Google

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *