آموزش فرم ورود وردپرس به صورت فیلم آموزشی

۱۳۹۷/۰۱/۰۵ ۲ دیدگاه 213 بازدید
اگر این مطالب برای شما مفید بود با دوستان خود به اشتراک بگذارید ...

بنام و یاد خدایی مهربان سلام و عرض ادب خدمت تمام کاربران وب سایت سون ریپلای در خدمت شما هستم یا یکی دیگه آموزش وردپرس

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

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

آموزش فرم ورود وردپرس به صورت فیلم آموزشی

میخواهیم یک فرم ورود شیک با هم دیگه طراحی کنیم طبق تصویر زیر

آموزش فرم ورود وردپرس

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

من توی این آموزش از ویرایش گر phpstorm استفاده می کنم اگه دوست داشتید از این نرم افزار استفاده کنید آموزش نصب و راه اندازی توی سایت است از لینک زیر استفاده کنید

آموزش نصب و کرک کردن PhpStorm + فیلم

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

داخل فایل login.php کد زیر را قرار میدم

خوب بعد از این که کد داخل فایل login.php قرار دادم میرم سراغ ساخت برگه بعد ورود به بخش پیشخوان وردپرس
روی برگه ها کلیک کنید طبق تصویر زیر :

بعد کلیک وارد قسمت برگه ها می شید که طبق شماره گذاری برید جلو توضیح میدم خدمت شما

  • ۱: روی همه برگه ها کلیک کنید تا ببینید که چند تا برگه دارید
  • ۲: روی افزودن برگه کلیک کنید

بعد از این که روی افزودن برگه کلیک کردید وارد صفحه برگه می شید طبق تصویر زیر :

آموزش ورود وردپرس

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

بعد این که روی افزودن برگه کلیک کردیم وارد صفحه برگه تازه میشم من شماره گذاری کردم طبق شماره گذاری میرم جلو

  • ۱: نام صفحه ورود سایت
  • ۲: میتوانید از این قسمت نام فارسی تغیر بدید
  • ۳:کد که داخل login.php قرار داده بودیم توی قسمت قالب نمایش داده می شه انتخاب کنید
  • ۴: روی انتشار کلیک کنید
  • ۵: بعد از انتشار روی لینک کلیک کنید

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

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

 

 

بعد از این که کد بالا را قرار دادیم حالا چک می کنه آیا کاربر لاگین کرده یانه اگه لاگین باشه که ۱ اگه لاگین نباشه ۰ است .

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

آموزش فرم لاگین وردپرس بدونه افزونه

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

 

آموزش استایل فرم ورود وردپرس 

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

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

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

آموزش فرم ورود وردپرس

 

فرم لاگین وردپرس

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

کد فرم ورود وردپرس

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

خوب کد فرم وردپرس داخل کد های html  استفاده می کنیم .

خوب دوستان عزیز تمام کد های بالا را با کد های  html  بالا جاگذاری کنید کار تمام است .

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

هر نظر و انتقادی یا پیشنهادی دارید توی قسمت نظرات برای ما بنویسید موفق پیروز باشید 

توجه
برای دریافت تمام کد ها به صورت آماده باید در سایت ثبت نام کنید و به صورت رایگان دریافت نمایید

 

ارسال شده توسط:
یک برنامه نویس آزاد که علاقه زیادی به اشتراک گذاری اطلاعات خود با دیگران داردم. همیشه به وردپرس فکر می کنم و عاشق وردپرس هستم. من یک web developer هستم و هدف من آسان کردن ورود سایر دوستان به این شغل جذاب هست. زبان برنامه نویسی محبوب من PHP هست.

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

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

  • بابا این فایل index.js چیه همش دارین از توی اون کپی می کنید ؟ خوب اینو کجا گذاشتین هر چی تو سایتتون دنبالش می گردم نیستش

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