طراحی فرم ویرایش اطلاعات کاربری با المنتور و افزونه Action Pack

اشتراک گذاری در telegram
اشتراک گذاری در whatsapp
اشتراک گذاری در facebook
اشتراک گذاری در twitter
اشتراک گذاری در linkedin
اشتراک گذاری در email
اشتراک گذاری در print
طراحی فرم ویرایش اطلاعات با المنتور
پخش ویدیو

در سری آموزش های افزونه Action Pack ساخت و طراحی فرم های ورود، ثبت نام و فراموشی رمز عبور را یاد گرفتیم.

ویژگی بعدی کاربرد این افزونه، ساخت و طراحی فرم ویرایش اطلاعات کاربری با استفاده از فرم ساز المنتور می باشد. در این آموزش قصد داریم تا فرم ویرایش حساب کاربری را در داشبورد طراحی شده در المنتور قرار دهیم.

برای ادامه آموزش به 2 افزونه زیر نیاز داریم:

طراحی فرم ویرایش اطلاعات کاربری با المنتور

برگه ویرایش حساب کاربری

در آموزش های قبلی نحوه طراحی حساب کاربری توسط المنتور ار توضیح داده ایم. اگر از این روش برای طراحی برگه داشبورد استفاده کرده اید، یک تب اضافه کرده و مراحل آموزش را درون این تب قرار دهید.

در غیر این صورت برگه ویرایش حساب کاربری که با المنتور طراحی کردید را باز کنید.

فرم المنتور را در جایگاه مورد نظر قرار دهید.

طراحی فرم ویرایش اطلاعات با المنتور

در بخش فیلد های فرم، دکمه افزودن آیتم را زده و باقی فیلد ها را حذف کنید. تعداد فیلد های یک فرم ویرایش حساب کاربری را ایجاد کنید. برای مثال فرم های اطلاعات حساب کاربری به شکل زیر می باشند.

نام، نام خانوادگی، شماره همراه، ایمیل، نام نمایشی و رمز عبور

این فیلد های می تواند بر اسا نیاز کاربر متغییر بوده و اطلاعات دیگری همچون شغل، تاریخ تولد، شماره کارت خرید و … را به فیلد های اطلاعات کاربری اضافه کرد.

طراحی فرم ویرایش اطلاعات با المنتور

بعد از اینکه تمامی فیلد های فرم را ایجاد کردید به مرحله بعدی، یعنی تب واکنش بعد از ارسال بروید.

واکنش بعد از ارسال

در تب واکنش بعد از ارسال، گزینه ویرایش پروفایل را انتخاب کنید. این گزینه با نصب افزونه Action Pack به فرم المنتور اضافه خواهد شد.

طراحی فرم ویرایش اطلاعات با المنتور

بعد از انتخاب گزینه ویرایش پروفایل، یک تب با همین نام به تنظیمات فرم اضافه خواهد شد. روی تب کلیک میکنیم و دکمه افزودن آیتم را می زنیم.

در اینجا باید به تعداد فیلد های فرمی که در مرحله قبل ایجاد کردیم، آیتم ویرایش پروفایل اضافه کنیم. فیلد ها رو دونه دونه ایجاد کرده و مقادیر را پر میکنیم.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد نام کوچک

بعد از ایجاد آیتم، گزینه اول فیلد کاربر را انتخاب کرده و از بین لیست، گزینه first_name را کلیک کنید.

گزینه فیلد فرم، فیلد مرتبط با نام را انتخاب کنید. گزینه سوم یعنی، قابل ویرایش را روی Yes قرار دهید. با فعال کردن این گزینه کاربر قادر به ویرایش نام خود خواهد بود.

اگر روی گزینه No قرار بگیرد، کاربر فقط می تواند فیلد را مشاهده کنید و دیگر قادر به ویرایش آن نیست.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد نام خانوادگی

آیتم دیگری اضافه می کنیم. گزینه اول را روی last_name قرار داده و فیلد فرم را روی نام خانوادگی که ایجاد کردیم.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد شماره همراه

فیلد شماره همراه به صورت پیش فرض در وردپرس وجود ندارد، بنابراین ما توسط آموزش طراحی فرم ثبت نام با استفاده از المنتور و افزونه Action Pack نحوه ایجاد فیلد اضافی کاربر را توضیح می دهیم.

سپس کلید متا وارد شده در هنگام ثبت نام را، در فیلد Custom Meta قرار میدهیم تا مقدار شماره همراه را نشان دهد. فیلد فرم را نیز بر روی شماره همراه قرار می دهیم.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد ایمیل

مجدد افزودن آیتم را زده و فیلد کاربر را روی User Email قرار دهید. گزینه دوم، فیلد فرم را روی ایمیل قرار دهید.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد نام نمایشی

برای فیلد نام نمایشی ابتدا باید گزینه فیلد کاربر را روی Dispaly Name قرار دهید. سپس فیلد فرم را روی فیلد مرتبط با نام نمایشی انتخاب کنید.

طراحی فرم ویرایش اطلاعات با المنتور

فیلد رمز عبور

فیلد آخر مربوط به رمز عبور حساب کاربری می باشد. آیتم جدید انتخاب کرده و گزینه فیلد کاربر را روی User Pass قرار دهید. همچنین فیلد فرم روی فیلد ساخته شده رمز عبور قرار بگیرد.

طراحی فرم ویرایش اطلاعات با المنتور

 

تمامی فرم های مربوط به تغییر اطلاعاتا حساب کاربری را ایجاد کردیم. حالا می توانیم استایل فرم را سفارشی سازی کنیم.

طراحی فرم ویرایش اطلاعات با المنتور

در انتها می توانید از بخش تنظیمات اضافی فرم، پیام تغییرات حساب کاربری را ویرایش کنید.

طراحی فرم ویرایش اطلاعات با المنتور

طراحی فرم ویرایش اطلاعات حساب کاربری هیچ زمان به این راحتی نبوده و حال به لطف افزونه Action Pack و افزونه المنتور قادر هستیم تا اطلاعات حساب کاربری را با ظاهر دلخواه طراحی کنیم.

امیدواریم که از این آموزش هم به خوبی استفاده کرده باشید. اگر مشکلی در طراحی فرم ویرایش اطلاعات حساب کاربری با المنتور دارید از بخش نظرات مطرح کنید.

045-microphone

مدرس :
محمدرضا احمدزاده

013-globe

سطح آموزش :
متوسط

035-essay

زمان آموزش :
8 دقیقه

فهرست مطالب

ALIAH AH
ALIAH AH در 15:39

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

پاسخ
المنتور فارسی
المنتور فارسی در 13:51

با سلام
توسط آموزش ایجاد فرم ثبت نام با فرم ساز المنتور و افزونه Action Pack می توانید فیلد های اضافی را از کاربر دریافت کرده و در حساب کاربری نمایش دهید.

پاسخ
امیرحسین عباسی نسب
امیرحسین عباسی نسب در 20:51

سلام ببخشید من یک برگه برای این کار ساختم اما چطور یک کاری کنم تا زمانی که کاربر وارد سایت نبود به صفحه ورود من ریدایرکت بشه؟

پاسخ
المنتور فارسی
المنتور فارسی در 22:42

با سلام
متاسفانه در المنتور چنین امکانی وجود ندارد و باید با استفاده از افزونه های جانبی این کار را انجام دهید.

پاسخ
Avatar
abonline در 13:01

سلام
برای عکس کاربر از افزونه جدا باید استفاده کرد ؟

پاسخ
المنتور فارسی
المنتور فارسی در 14:32

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

پاسخ
سعید حسنی
سعید حسنی در 19:32

سلام خسته نباشید
از وبسایت المنتور فارسی خیلی تشکر میکنم بابت آموزشهایی مثل این آموزش که خیلی از مشکلات وردپرس یک وردپرس کار رو برطرف میکنن !!!
لطفا باز هم از این آموزش ها بزارین !
با آرزوی موفقیت …

پاسخ
المنتور فارسی
المنتور فارسی در 20:48

با سلام
ممنون از همراهی شما

پاسخ

نظرات ارزشمند خود را به اشتراک بگذارید

نیاز به کمک دارید؟ پیام دهید