طراحی فرم ورود با فرم ساز المنتور و افزونه Action Pack

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

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

حالا در این مقاله، قصد داریم تا فرم ورود را توسط فرم ساز المنتور طراحی کنیم. برای طراحی فرم ورود به 2 افزونه زیر نیاز داریم:

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

ایجاد پاپ آپ فرم ورود

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

فرم ورود با المنتور

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

ما در اینجا یک پاپ آپ با عرض 940 پیکسل ایجاد کردیم.

فرم ورود با المنتور

صفحه را به 2 ستون مجزا تقسیم می کنیم. در ستون سمت راست، یک تصویر قرار میدیم. در ستون سمت چپ ویجت فرم المنتور.

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

ایحاد فیلد های ورود

فیلد نام کاربری

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

فرم ورود با المنتور

فیلد رمز عبور

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

فرم ورود با المنتور

فیلد مرا به خاطر بسپار

برای ایجاد دکمه مرا به خاطر بسپار، یک فیلد جدید اضافه کرده و نوع فیلد را روی پذیرش قرار دهید.

فرم ورود با المنتور

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

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

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

فرم ورود با المنتور

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

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

فرم ورود با المنتور

در فیلد دوم قسمت ورود با استفاده، 3 گزینه دارد.

  • Password: ورود با رمز عبور کاربر
  • OTP: ورود با استفاده از کد ارسالی به ایمیل یا SMS
  • OTP & Password: ورود با استفاده از رمز عبور کاربر و کد ارسالی به ایمیل یا SMS

فرم ورود با المنتور

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

فرم ورود با المنتور

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

فرم ورود با المنتور

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

با روشن کردن گزینه مخفی کردن فرم ورود، کاربران وارد شده دیگر این فرم را مشاهده نخواهند کرد. توجه کنید پاپ آپ همچنان نشان داده خواهد شد و فقط فرم ورود نمایش داده نمی شود.

حالا می توانید استایل فرم ورود را به دلخواه تغییر دهید و پاپ آپ را ذخیره کنید.

فرم ورود با المنتور

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

045-microphone

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

013-globe

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

035-essay

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

امتیاز دهید

اشتراک گذاری

اشتراک گذاری در telegram
اشتراک گذاری در whatsapp
اشتراک گذاری در facebook
اشتراک گذاری در twitter
اشتراک گذاری در linkedin
اشتراک گذاری در email

آخرین مقالات

آخرین محصولات

آخرین محصولات

برچسب ها

لینک کوتاه

https://elementorfa.ir/?p=61684

فهرست مطالب

Avatar
علیرضا در 08:07

سلام. لطفا سامانه های پیامکی ایرانی مثل ippanel, maxsms فرانگار و … اضافه کنید تا مشکل ما هم حل بشه و برای خریدش مطمئن بشیم!

پاسخ
المنتور فارسی
المنتور فارسی در 10:56

با سلام
بله حتما این مورد در حال پیگیری و اضافه شدن است.

پاسخ
Avatar
meysam در 12:52

سلام
چندتا سوال قبل از خرید داشتم:
1- اس ام اس رو چطور می تونیم برای این افزونه فعال کنیم و با کدوم سرویس دهنده هماهنگ است؟
2- امکان ارسال ایمیل تاییدیه هم دارد؟
3- چطور میشه مثل سایت خودتون “ورود با گوگل” را به فرم ورود اضافه کرد؟
4- امکان استفاده از کپچای عددی “ریاضی” در افزونه Action Pack وجود دارد چون کپچای عددی با اکثر افزونه ها مشکل داره؟
ممنون میشم این 4 سوال منو پاسخ بدید

پاسخ
المنتور فارسی
المنتور فارسی در 12:57

با سلام
1- در حال حاضر با سرویس دهنده های داخلی هماهنگ نیست بزودی این امکان فراهم خواهد شد.
2 – بله می تونید ارسال ایمیل تایید به صورت لینک یا رمز یک بار مصرف قرار دهید.
3 – برای اضافه کردن ورود با گوگل باید از افزونه های جانبی مانند Nextend استفاده کنید. (رایگان در مخرن وردپرس)
4- برای این افزونه و فرم المنتور فقط از کپچا گوگل می توان استفاده کرد.

پاسخ
ALIAH AH
ALIAH AH در 11:04

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

پاسخ
المنتور فارسی
المنتور فارسی در 11:55

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

پاسخ
ALIAH AH
ALIAH AH در 12:09

پس افزونه اکشن پک کجاش استفاده شد؟

پاسخ
المنتور فارسی
المنتور فارسی در 12:16

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

پاسخ
مهدی
مهدی در 15:41

عالی عالی
همش به کنار اون ورود با اس مس من خیلی امیدوار کرد
امیدوارم هرچه زودتر اپراوتور های مثل ملی پیامک یا کاونگار بهش اضافه بشن که غوغا کنه المنتور عملا از نصب چندین افزونه خلاص میشیم
درود بر تیم المنتور فارسی و آموزش های حرفه ای تون

پاسخ
وحید
وحید در 14:34

سلام
بسیار عالی ممنون

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

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

پاسخ

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

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