طراحی سایتوردپرس

۳ روش سفارشی کردن صفحه ورود (لاگین) در ووکامرس

نیاز دارید تا صفحه ورود مشتری ووکامرس وبسایتتان را سفارشی کنید؟ صفحه ورود به لاگین پیش فرض وردپرس ساده است و با برند فروشگاه مطابقت ندارد. سفارشی کردن صفحه ورود مشتری ووکامرس به شما کمک میکند تا تجربه کاربری بهتری را فراهم کنید. در این مقاله برای شما توضیح خواهیم داد که چگونه یک صفحه ورود به سیستم کاملا سفارشی را ایجاد کنید و همچنین نکاتی را در مورد نحوه شخصی سازی صفحه ورود به سیستم پرداخت (checkout) را نیز به اشتراک خواهیم گذاشت.

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

Standard WordPress login screen example

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

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

حالا توضیح میدهیم، یک صفحه ورود مشتری در ووکامرس را چگونه، سفارشی کنید.

  • ایجاد صفحه ورود کاملا سفارشی ووکامرس با seedprod
  • سفارشی کردن صفحه ورود ووکامرس با وردپرس
  •  پاداش: ورود به سیستم پرداخت (checkout) ووکامرس را سفارشی کنید

ایجاد صفحه ورود کاملا سفارشی ووکامرس با استفاده از SeedProd

بهترین راه برای ایجاد یک صفحه ورود مشتری سفارشی ووکامرس استفاده از SeedProd است. این روش

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

شما میتوانید با استفاده از سیستم drag-and-drop در قسمت SeedProd برای سفارشی کردن طرح و چیدمان یک صفحه و یا حتی تم وردپرس استفاده کنید. بدون اینکه حتی از یک خط کد استفاده کنید. برای این کار از لایسنس SeedProd Pro استفاده میکنیم. زیرا شامل الگوی صفحه ورود به سیستم و سایر گزینه‌های سفارشی سازی پیشرفته است. همچنین یک نسخه ساده SeedProd Lite وجود دارد که میتوانید به صورت رایگان استفاده کنید.

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

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

حالا با توجه به شکل پایین، روی قسمت login page در قسمت set up a login page کلیک کنید.

Select Login Page

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

Choose a Template for Your SeedProd Login Page

هنگامی که قالب خود را انتخاب کردید، یک پنجره باز خواهد شد. در قسمت پایین میتوانید این پنجره را مشاهده کنید. حالا یک نام برای صفحه خود را وارد کنید و بر روی ‘ Save and Start Editing the Page ‘ را کلیک کنید.

Enter a Page Name and Page URL

سپس, شما سازنده drag-and-drop را میبینید. اکنون میتوانید صفحه ورود را با افزودن بلوک‌های جدید به الگو از منوی سمت چپ خود سفارشی کنید. SeedProd مقدار استاندارد بلوک‌هایی استاندارد، مثل تیتر،متن،تصویر را میدهد.

Customize your WooCommerce login page

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

More customization options

پس از انجام سفارشی سازی صفحه ورود ووکامرس، فراموش نکنید که روی دکمه save در بالا کلیک کنید. سپس میتوانید به Page Setting بروید و در ناحیه ی page status ضامن را تغییر دهید تا از پیش نویس به انتشار تغییر کند. سپس میتوانید روی دکمه save کلیک کنید و سازنده صفحه را ببندید.

SeedProd Page Settings

از اینجا به بعد باید تمام کارهای که برای سفارشی کردن صفحه ورود خودتان کردید را برای کاربران قابل نمایش بکنید. برای این کار از داشبرد وردپرس روی SeefProd کلیک میکنیم. گزینه landing pages را انتخاب میکنیم در صفحه سمت راست در قسمت login page ضامن را تغییر میدهیم و همانند تصویر پایین آن را سبز میکنیم.

مطالعه کنید درباره   طراحی سایت شهرداری
Make Your SeedProd Login Page Active

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

WooCommerce login page preview

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

میخواهید فرم ورود به سیستم ایجاد کنید که با موضوع وب سایت شما نیز مطابقت داشته باشد و فرمی با گزینه‌ها و فیلد بیشتر در اختیار شما قرار دهد؟

فرم ورود پیش فرض وردپرس فقط به کاربران امکان میدهد ایمیل یا نام کاربری خود را به همراه رمز عبور وارد کنند. با فرم ورود به سیستم سفارشی میتوانید فیلدهای بیشتری اضافه کنید و به مشتریان اجازه دهید با نام یا شماره تلفن خود وارد سیستم شوند. بهترین راه برای انجام این کار استفاده از WPForms است. WPForms بهترین سازنده فرم وردپرس است که مبتدیان نیز میتوانند با آن کار کنند. بیش از ۵ میلیون وب سایت ازین فرم‌ها استفاده میکنند. به راحتی میتوانید فرم ورود به سیستم ووکامرس، سفارشی ایجاد کرده و در هر نقطه از فروشگاه اینترنتی خود مانند نوار کناری یا در صفحه محصول نمایش دهید. برای این کار ما از برنامه WPForms Pro plan استفاده خواهیم کرد، زیرا شامل افزونه ثبت نام کاربر است. شما همچنین میتوانید نسخه رایگان از وردپرس free version of WPForms  رابرای شروع را امتحان کنید.

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

Enter Your WPForms License Key

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

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

.

Install WPForms User Registration Addon

اکنون شما اماده ی ساختن یک فرم ورود سفارشی برای ووکامرس هستید. به سادگی از قمست WPForms >> Add New فرمساز جدید را انتخاب کنید، در صفحه بعدی میتوانید نامی برای فرم خود در قسمت بالا وارد کنید. سپس قسمت User Login را جستجو کرده و روی دکمه Use Template کلیک کنید.

Select the WPForms User Login Form Template

سپس میتوانید الگوی فرم ورود کاربر خود را با استفاده از سازنده drag and drop سفارشی کنید. اضافه کردن فیلدهای مختلف به فرم یا تنظیم مجدد فیلدهای موجود در قالب بسیار ساده است. به عنوان مثال میتوانید زمینه‌های پیشرفته ای مانند شماره تلفن را با کشیدن از منوی سمت چپ و انداختن روی الگو اضافه کنید.

WPForms Form Builder

شما میتوانید هر قسمت فرم را در الگو سفارشی کنید. به سادگی بر روی هر فیلد کلیک کنید و برچسب خود را ویرایش کنید، توضیحات را اضافه کنید و یک فیلد مورد نیاز در فرم ایجاد کنید. سپس میتوانید به برگه Settings در فرم ساز بروید. تحت تنظیمات عمومی شما میتوانید دکمه Submit Button Text به Login تغییر دهید.

Customizing the WPForms Button Text

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

Edit confirmation settings in WPForms

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

Embed a form in page

فعلا گزینه ی Create New Page را انتخاب کنید. حالا شما نیاز به یک نام برای صفحه خود دارید. در قسمت بالا روی Let’s Go کلیک کنید.

Enter a name for new login page

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

WooCommerce login page preview using WPForms

از طرف دیگر میتوانید فرم ورود ووکامرس خود را نیز به نوار کناری فروشگاه خود اضافه کنید. به این ترتیب فرم شما در هر صفحه محصول ظاهر میشود و به مشتریان اجازه میدهد تا به سرعت وارد سیستم شوند.خیلی راحت از قسمت داشبورد وردپرس گزینه ی Appearance » Widgets را انتخاب کنید، حالا با کلیک کردن روی قسمت ‘+’ در بالای پیج یک ویجت بلوک اضافه کنید. سپس میتوانید فرم ورود به سیستم خود را از منوی کشویی انتخاب کرده و عنوان را وارد کنید.

Add your login form in the sidebar

هنگامی که کار تمام شد روی دکمه ی ‘Update’ کلیک کنید. اکنون میتوانید برای دیدن فرم ورود به سیستم در نوار کناری به فروشگاه اینترنتی خود مراجعه کنید.

Login form in sidebar preview

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

ووکامرس به بازدیدکنندگان اجازه میدهد تا از صفحه پرداخت Checkout وارد سیستم شوند. اگر به دنبال سفارشی کردن صفحه ورود به سیستم ووکامرس هستید بهترین راه برای انجام این کار استفاده از یک افزونه سازنده قیف قدرتمند مانند WooFunnels است. WooFunnels به شما امکان میدهد صفحه پرداخت Checkout ووکامرس خود را سفارشی کنید. پرداخت چند مرحله ای داشته باشید و گزینه ی افزایش فروش با یک کلیک داشته باشید. شما میتوانید از بین ده‌ها الگوی پیش ساخته ی پرداخت checkout که برای مبادله بهینه شده اند، انتخاب کنید و حتی میتوانید با استفاده از هر یک ازسازنده‌های محبوب صفحه وردپرس خود را سفارشی کنید.

WooFunnels Checkout Example

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

مطالعه کنید درباره   طراحی UI و UX چیست؟

 WooFunnelها در هر مرحله ازفونل، به شما تجزیه و تحلیل دقیق میدهند.

WooFunnels A/B Testing for WooCommerce

همچنین WooFunnelها دارای یک افزونه اتوماسیون بازاریابی قدرتمند به نام Autonami هستند که به شما امکان میدهد ایمیل‌های ووکامرس را سفارشی کنید. ارسال اعلان های ایمیل قطره ای در ووکامرس برای ازادسازی سبد خرید و خوش امدگویی میباشد.

Autonami Email Library for WooCommerce

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

نویسنده:غلامرضا جوانبخت

.

نمایش بیشتر

نوشته های مشابه

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

دکمه بازگشت به بالا
مشاوره + تخفیف بلک فرایدی