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

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

ساخت صفحه حساب کاربری با المنتور

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

در صفحه حساب کاربری طراحی شده با المنتور، معمولاً بخش‌ هایی مانند اطلاعات کاربر، تاریخچه سفارش ‌ها، لیست علاقه ‌مندی‌ ها، فرم ویرایش پروفایل، آدرس‌ های ذخیره شده و دکمه خروج از حساب کاربری گنجانده می ‌شود. ویژگی قابل توجه المنتور این است که امکان شخصی ‌سازی کامل ظاهر و ترتیب این اجزا را فراهم می ‌سازد و طراحی نهایی را از حالت پیش ‌فرض و یکنواخت خارج می ‌کند. نتیجه این فرایند، صفحه‌ای است که علاوه بر کاربردی بودن، از نظر بصری نیز جذاب و منسجم خواهد بود.

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

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

مزایا طراحی صفحه حساب کاربری با المنتور

• رابط کاربری آسان: المنتور برای ساده سازی فرآیند ایجاد وب سایت های وردپرس طراحی شده و حتی برای کسانی که دانش برنامه نویسی حرفه ای ندارند بسیار مناسب می باشد. المنتور دارای یک سازنده کشیدن و رها کردن است که به کاربران اجازه می دهد صفحات دلخواه خود را سفارشی کنند و طرح های پیچیده را به راحتی ایجاد نمایند. علاوه بر این، المنتور طیف گسترده‌ای از قالب‌های آماده را ارائه می‌دهد که کاربران را قادر می‌سازد تا به سرعت یک وب‌سایت منحصربه‌فرد بدون صرف زمان زیاد طراحی کنند.
• طراحی وب سایت با کیفیت بالا: المنتور به طراحان وب کمک می کند تا بدون نیاز به کدنویسی، طرح های با کیفیت بالا و مخصوص برند ایجاد کنند. این امر بسیار مفید است زیرا امکان توجه دقیق به جزئیات را فراهم می کند و اطمینان حاصل می کند که محصول نهایی با طراحی اولیه مطابقت دارد.
• طراحی پاسخگو و سازگار با موبایل: با استفاده از المنتور شما می توانید یک صفحه حساب کاربری و ثبت نام کاملاً ریسپانسیو طراحی کنید تا کاربران در هر دستگاهی از جمله موبایل به بهترین شکل به این صفحه دسترسی داشته باشند.

بیشتر بخوانید: افزونه Customize My Account Page | افزونه ویرایشگر صفحه حساب کاربری

طراحی صفحه ورود و ثبت نام با المنتور

با استفاده از المنتور، می‌ توان فرم‌ های ورود و ثبت نام را به‌ گونه‌ای طراحی کرد که تمامی فیلدها، دکمه‌ ها، رنگ ‌ها و تایپوگرافی‌ ها با دیگر بخش‌های سایت هماهنگ باشند. همچنین امکان افزودن ویژگی‌ هایی مانند نمایش پیام خوش ‌آمدگویی، لینک بازیابی رمز عبور، گزینه‌های ورود با حساب‌ های اجتماعی یا حتی استفاده از کپچا برای افزایش امنیت وجود دارد. این انعطاف ‌پذیری باعث می ‌شود که صفحه ورود و ثبت نام نه تنها کارآمد، بلکه حرفه‌ای و کاربرپسند باشد.

آموزش ساخت پنل کاربری با المنتور

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

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

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

آموزش ساخت حساب کاربری با المنتور

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

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

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

سپس ویجت User Registration Form یا فرم ثبت نام کاربر را بکشید و در موقعیت دلخواه رها کنید. پس از آن فیلدهای فرم پیش فرض را مشاهده خواهید کرد.

همچنین می توانید فیلدهای دیگری مانند نام کاربری، نام و نام خانوادگی را حذف و یا اضافه کنید. علاوه بر آن؛ در فیلدهای فرم جداگانه، می ‌توانید ابعاد ستون و برخی از تنظیمات دیگر را به دلخواه خود سفارشی کنید. همچنین می‌ توانید اندازه ورودی را مدیریت کنید، برچسب فیلدها یا علامت مورد نیاز را نمایش یا پنهان کنید.

بیشتر بخوانید: آموزش گرفتن بکاپ از وردپرس با افزونه BackUpWordPress

مرحله 2: تنظیمات فرم را پیکربندی کنید

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

• New User Role (نقش کاربر جدید)

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

بیشتر بخوانید: ۱۰ صفحه ای که هر سایت ودرپرسی باید داشته باشد

• Actions After Registration ( اقدامات پس از ثبت نام)

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

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

در ادامه گزینه های این بخش را به شما توضیح می دهیم:

– Redirect after Register: با استفاده از این گزینه می توانید کاربر را پس از ثبت نام موفق به یک صفحه تشکر یا یک صفحه ورود هدایت کنید. برای انجام اینکار کافیستURL صفحه مورد نیاز را در قسمت آدرس در زیر این گزینه جای ‌گذاری کنید.

– Hide after Register: در برخی از مواقع ممکن است لازم باشد تا پس از اینکه کاربری در سایت شما عضو شد، فرم ثبت نام کاربر را مخفی کنید. این گزینه فرم ثبت نام را مخفی می کند و پیام موفقیت آمیز را نمایش می دهد و پیوندی برای بازدید از صفحه ورود برای ورود به وب سایت مربوطه ارائه می دهد. همچنین این گزینه را می توانید در تب Content ویجت ها مشاهده کنید.

– Auto Login: این گزینه به کاربر این امکان را می دهد تا به صورت خودکار وارد وب سایت شما شود. کاربر پس از ثبت نام نیازی به ورود به سایت نخواهد داشت زیرا پس از ثبت نام موفق مستقیماً وارد وب سایت می شود.

– Send Email: با انتخاب این گزینه، یک ایمیل برای کاربر ارسال می شود که به آن نشان می دهد که با موفقیت در وب سایت شما ثبت نام کرده است. همچنین شما می توانید محتوای ایمیل را در بخش ایمیل به دلخواه خود سفارشی سازی کنید.

همچنین می توانید از تب Style ظاهر فرم ورود و ثبت نام سایت خود را شخصی سازی نمائید.

بیشتر بخوانید: آموزش طراحی قالب با المنتور | چگونه با المنتور قالب وردپرس بسازیم؟ 

مرحله 3: فرم ثبت نام کاربر را به وب سایت خود اضافه کنید

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

بیشتر بخوانید: آموزش غیرفعال کردن زوم، لایت باکس و گالری تصاویر برای محصولات خاص در ووکامرس

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

همچنین شما می توانید در صفحه ووکامرس خود فرم ثبت نام کاربر را درج کنید. برای انجام اینکار، می توانید یک صفحه (برگه) ایجاد و نام آن را ” صفحه حساب سفارشی یا Custom Account Page ” قرار دهید. حالا روی دکمه “ویرایش با المنتور” کلیک کنید تا وارد صفحه ویرایشگر افزونه المنتور شوید.

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

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

بیشتر بخوانید: آموزش افزونه دیجیتس | نصب و تنظیمات افزونه Digits

نحوه ایجاد فرم ثبت نام کاربر در المنتور به روشی دیگر

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

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

برای سفارشی کردن فرم به پنل سمت چپ بروید. اولین بلوک گزینه ای که باید باز کنید بلوک Form Fields در زیر تب Content است. فرم ثبت نامی که ما ایجاد خواهیم کرد از 5 فیلد به شرح زیر تشکیل شده است:

• نام
• نام خانوادگی
• نام کاربری
• ایمیل
• رمز عبور

نکته مهمی که باید به آن توجه کرد این است که از برچسب‌های فیلد دقیقاً مانند موارد موجود در جدول بالا استفاده کنید، از جمله حروف بزرگ و کوچک، زیرا آنها به عنوان متغیرهای اسکریپت PHP مورد استفاده قرار خواهند گرفت. همچنین مطمئن شوید که به فرم خود یک نام اختصاص داده اید.

پس از تنظیم فیلدهای فرم، بلوک ” اقدام پس از ارسال “را باز کنید. از آنجایی که می خواهید یک فرم ثبت نام کاربر ایجاد کنید، می توانید عمل را روی Redirect تنظیم نمائید.

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

بلوک Additional Options را باز کرده و گزینه Custom Message را فعال کنید. می توانید پیام موفقیت را با چیزی مانند “کاربر ایجاد شد” جایگزین نمائید.

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

ساخت صفحه 404 در وردپرس به صورت سفارشی

چه تفاوت‌های کلیدی بین نسخه رایگان المنتور و المنتور پرو (Elementor Pro) وجود دارد که آن را برای کاربران حرفه‌ای جذاب‌تر می‌کند؟

نسخه رایگان المنتور ابزارهای اولیه برای ساخت صفحات را فراهم می‌کند، اما المنتور پرو برای کاربران حرفه‌ای بسیار کارآمدتر است. المنتور پرو بیش از ۹۰ ابزارک پیشرفته (مثل فرم‌ساز، اسلایدر، و ابزارک‌های ووکامرس) دارد، در حالی که نسخه رایگان حدود ۳۰ ابزارک را ارائه می‌دهد.

مهم‌ترین تفاوت، قابلیت Theme Builder در المنتور پرو است. این ویژگی به شما اجازه می‌دهد تا تمام بخش‌های یک قالب وردپرس، شامل سربرگ (Header)، پابرگ (Footer)، صفحات نوشته و آرشیو را بدون کدنویسی طراحی کنید. این امکان برای طراحی قالب وردپرس با المنتور به صورت حرفه‌ای ضروری است و در نسخه رایگان وجود ندارد.

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

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

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

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

جمع بندی: ساخت صفحه ورود و ثبت نام با المنتور

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

منبع: ultimateelementor