نحوه ایجاد یک پنجره ورود به سیستم وردپرس (مرحله به مرحله)

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

How to Create a Modal Login in WordPress

چرا باید یک پنجره ورود به سیستم WordPress ایجاد کنید؟ h4>

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

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

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

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

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

روش 1. با استفاده از ورود CSH یک پنجره ورود به سیستم Modal ایجاد کنید h4>

این روش برای بیشتر کاربران آسان تر و توصیه می شود.

اولین کاری که باید انجام دهید این است که پلاگین CSH Login برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .

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

Select modal login type

پس از انتخاب نوع جعبه ورود به سیستم ، می توانید به پایین پیمایش کرده و هدایت های ورود به سیستم / فرم را مدیریت کنید. همچنین می توانید به کاربران اجازه دهید رمزهای عبور خود را ایجاد کنند.

Redirect login type

بعد ، باید به قسمت سبک ها بروید و طرح ، برچسب های نمایش ، رنگ پس زمینه ، رنگ دکمه ، رنگ پیوند و موارد دیگر را انتخاب کنید.

Style your modal login form

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

Add social login form

اطمینان حاصل کنید که تغییرات را ذخیره کرده و کد کوتاه واقع در بالای این صفحه را کپی کنید. برای افزودن کد کوتاه در ویرایشگر محتوا ، باید یک صفحه جدید در WordPress ایجاد کنید یا یک صفحه موجود را ویرایش کنید.

Copy shortcode for CSH login plugin

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

Drag and drop CSH login widget

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

Modal login popup form

روش 2. ایجاد یک پنجره ورود به سیستم Modal با WPForms و OptinMonster

برای این روش به پلاگین WPForms و OptinMontser . اگر این دو افزونه را قبلاً دارید ، بنابراین این روش راه حل بهتری برای شماست.

WPForms بهترین فرم تماس با وردپرس افزونه. برای دسترسی به افزونه ثبت نام کاربر حداقل به برنامه Pro آنها نیاز دارید.

OptinMonster بهترین افزونه پنجره بازشو وردپرس است و تولید سرب کرد نرم افزار موجود در بازار. به شما کمک می کند بازدیدکنندگان وب سایت را به مشترکین و مشتری تبدیل کنید. برای دسترسی به ویژگی MonsterLinks استفاده شده در این مقاله حداقل به برنامه Pro نیاز دارید.

آماده هستید؟ بیایید شروع کنیم.

استفاده از WPForms برای ایجاد فرم ورود کاربر h4>

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

پس از فعال سازی ، برای نصب و فعال سازی افزونه ثبت نام کاربر باید به صفحه WPForms »Addons بروید.

WPForms addons page

برای ایجاد فرم ورود کاربر ، باید به صفحه WPForms »افزودن جدید بروید.

Add new form

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

Select user login form

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

Login form template

بعد ، روی قسمت گذرواژه در قسمت پیش نمایش کلیک کنید ، و این گزینه های قسمت سمت چپ را نشان می دهد. می توانید کدهای داده شده در زیر را در کادر توضیحات قسمت گذرواژه اضافه کنید تا گزینه هایی مانند فراموش کردن رمز ورود و ثبت نام کاربر نمایش داده شود.

رمز ورود خود را به خاطر نمی آورید؟  اینجا را کلیک کنید . حساب ندارید؟  اینجا ثبت نام کنید .

Add password options

بعد از آن باید روی دکمه ذخیره کلیک کنید و سپس روی دکمه جاسازی کلیک کنید

Save and embed

یک پنجره بازشو با کد تعبیه شده باز می شود. شما باید این کد را کپی کنید و آن را ذخیره کنید تا بعداً استفاده شود.

Copy embed code

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

استفاده از OptinMonster برای ایجاد یک پنجره Modal

ابتدا باید OptinMonster a را نصب و فعال کنید > پلاگین برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .

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

Create new campaign

داشبورد OptinMonster شما در یک صفحه وب جدید باز می شود.

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

Select Campaign Type

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

Select campaign template

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

Add campaign name and site

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

از اینجا ، باید به برگه Optin بروید و عرض و ارتفاع بوم را تنظیم کنید ، کد تعبیه فرم ورود را در قسمت Custom Canvas HTML اضافه کنید ، صفحه نمایش را مدیریت کنید و جلوه های صوتی برای پنجره بازشو و بیشتر.

توجه: کد تعویض فرم ورود باید کدی باشد که پس از ایجاد فرم ورود به سیستم در مرحله قبل کپی کردید.

Add login form embed code in modal popup

از آنجا که در حال ایجاد یک پنجره ورود به سیستم جدید هستید ، باید به برگه تنظیمات بروید و مقدار “0” را برای مدت زمان کوکی و مدت زمان موفقیت کوکی تنظیم کنید. این فرم هر زمان که بازدیدکنندگان روی پیوند شما کلیک کنند ، برای همه نمایش داده می شود.

Set cookie duration value

در مرحله بعدی ، باید از برگه Display Rules بازدید کرده و MonsterLink را برای تغییر وضعیت به حالت فعال گسترش دهید.

MonsterLink status active

برای فعال کردن وضعیت ، حتماً روی دکمه ذخیره در گوشه بالا سمت راست کلیک کنید و به قسمت انتشار بروید.

Save and publish campaign

اکنون می توانید این پنجره ورود به سیستم حالت رسمی را در صفحات یا پست های وردپرس خود اضافه کنید.

افزودن ورود به سیستم در وردپرس h4>

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

Edit output settings

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

Shop campaign to visitors

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

Copy campaign slug

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

 ورود / ثبت نام 

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

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

Modal login in WordPress

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

اگر این مقاله را دوست داشتید ، لطفاً در کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .

منبع:
https://www.wpbeginner.com/plugins/how-to-create-a-wordpress-login-popup-modal-step-by-step/.

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