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

ساخت فرم ورود پاپ آپ وردپرس با المنتور
Share on twitter
Share on facebook
Share on telegram
Share on whatsapp
Share on email

چکیده مقاله

آیا می خواهید برای وب سایت خود یک فرم ورود پاپ آپ وردپرس سفارشی ایجاد نمایید؟

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

مراحل ساخت فرم ورود پاپ آپ در وردپرس با المنتور

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

نحوه ایجاد و تنظیمات فرم ورود پاپ آپ در المنتور

به قالب ها – Templates > پاپ آپ ها – Popups  > اضافه کردن جدید – Add New بروید و یک نام جدید برای پاپ آپ وارد نموده و روی دکمه سبز رنگ ایجاد قالب کلیک نمایید.
یک قالب پاپ آپ از پیش طراحی شده انتخاب نمایید یا اینکه از کتابخانه المنتور خارج شوید و خودتان یک پاپ آپ طراحی نمایید. در این آموزش ما خودمان یک پاپ آپ طراحی می نماییم.

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

تنظیمات

در پنل کناری المنتور تنظیمات مربوط به پاپ آپ را مشاهده می کنید با کلیک بر روی آیکون چرخدنده در قسمت پایین پنل تنظیمات المنتور به شما نمایش داده می شود.در تب تنظیمات، تغییرات زیر را انجام دهید.

  1. عرض – Width: را روی۴۰۰px تنظیم کنید.
  2. ارتفاع – Height: سفارشی را انتخاب نمایید.
  3. ارتفاع سفارشی – Custom Height: را روی ۶۰۰px تنظیم کنید.
  4. پوشش – Overlay: را روی مخفی تنظیم کنید.
  5. به تب پیشرفته – Advanced Tab بروید و گزینه جلوگیری از بستن پاپ آپ با کلیک روی صفحه – Prevent Closing On Overlay را روی بله – Yes تنظیم نمایید.
مشاهده مقاله  اضافه کردن افکت در المنتور

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

نحوه ساخت بخش محتوای پاپ آپ فرم ورود در المنتور

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

  1. حالا ابزارک سربرگ را انتخاب کرده و آن را به پاپ آپ بکشید و عنوان صفحه ورود خود را وارد نمایید و تنظیمات آن مثل رنگ، پدینگ و … را به سلیقه خود تغییر دهید.
  2. ابزارک ورود – Login را به بخش دوم پاپ آپ اضافه نمایید و متن و استایل مورد نیاز خود را با توجه به سلیقه خود تغییر بدهید. توجه داشته باشید برای تغییر لیبل ها باید روی Custom Label کلیک کرده و متن های جایگزین را وارد نمایید.
  3. در تنظیمات ابزارک ورود – Login به بخش محتوا – Content > تنظیمات اضافی – Additional Options بروید و گزینه ریدایرکت بعد از ورود – Redirect After Login را فعال نمایید و آدرسی را که می خواهید کاربر به آن منتقل شود را وارد نمایید.

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

انتشار پاپ آپ

روی دکمه انتشار – publish کلیک نمایید. برای این نوع هیچکدام از تنظیمات شرایط Conditions، Triggers و Advanced Rules لازم نیست. فقط در آخر روی دکمه Save and Close کلیک نمایید.

ساخت دکمه نمایش پاپ فرم ورود

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

  1. دکمه ورود را ویرایش کنید و متن و تایپوگرافی آن را به دلخواه خود عوض کنید.
  2. در تب محتوا به قسمت پیوند – Link بروید و روی آیکون داینامیک کلیک کرده و در زیر مجموعه اقدامات – Actions پاپ آپ را انتخاب نمایید.
  3. مجدداً روی پاپ آپ کلیک کرده و گزینه بازکردن پاپ – Open Popup را انتخاب کنید.
  4. حالا در فیلد بعدی پاپ آپی را که برای ورود ایجاد کردید را جستجو و انتخاب کنید.
  5. روی دکمه به روز رسانی – Update کلیک نمایید.
مشاهده مقاله  آموزش اضافه کردن فونت به المنتور

تنظیمات دکمه فرم ورود پاپ آپ وردپرس با المنتور

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

 

Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on telegram
Share on whatsapp
Share on email
Share on print

دریافت مقالات ناب

مقالات شبیه مقالات بالا رو هر هفته میفرستیم به ایمیلتون

پاسخی بگذارید

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

سوالی داری؟ چت با واتساپ