با سلام خدمت شما همراهان گرامی ،

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

جایگزین صفحه فراموشی رمز وردپرس

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

1 – کاربر با وارد کردن نام کاربری و یا ایمیل خود، درخواست تغییر رمز خود را ارسال میکند.

2 – یک کلید موقت (token) برای کاربر تولید و در پایگاه داده ذخیره شده و یک لینک شامل این کلید برای کاربر ایمیل می شود.

3 – کاربر ایمیل را چک کرده و روی لینک موجود در ایمیل کلیک می کند.

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

چرخه تغییر رمز با ورورد کاربری که رمز عبور خود را فراموش کرده به صفحه فراموشی رمز عبور از طریق لینک wp-login.php?action=lostpassword که در صفحه لاگین قرار گرفته شده شروع میشود، در این مرحله لازم است که کاربر به جای صفحه فراموشی رمز با صفحه سفارشی ما روبرو شود.

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

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

طراحی جایگزین صفحه فراموشی رمز وردپرس :

در ابتدا به مسیر پوسته رفته و یک فایل  php به نام custom-lost-password.php میسازیم و سپس کدهایHtml  زیر را به فایل ساخته شده اضافه کرده و ذخیره میکنیم.

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

کدهای php انتهای صفحه جهت نمایش پیام های خطای مناسب در شرایط مختلف در نظر گرفته شده اند.

جایگزین صفحه فراموشی رمز وردپرس

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

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

جایگزین صفحه فراموشی رمز وردپرس

در صفحه افزودن برگه عبارت lost-password را تایپ کرده و سپس از قسمت ویژگی های برگه بخش قالب گزینه Lost Password (همان نامی که در ابتدای فایل custom-lost-password.php وارد کرده بودیم) را انتخاب کرده و گزینه انتشار را کلیک می کنیم.

جایگزین صفحه فراموشی رمز وردپرس

اگر تا اینجای آموزش با ما همراه بوده باشید باید صفحه به شکل زیر برای شما نمایش داده شود:

جایگزین صفحه فراموشی رمز وردپرس

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

 

با اضافه کردن کد بالا به فایل functions.php وقتی کاربر بخواد وارد صفحه فراموشی رمز پیش فرض وردپرس بشه به صفحه سفارشی ما هدایت میشه!

  • توجه : در کدهای بالا تابع redirect_logged_in_user در آموزش جایگزین صفحه لاگین وردپرس توضیح داده شد و اگر آموزش های ما رو دنبال کرده باشید باید این تابع رو در حال حاضر در فایل functions.php داشته باشید ، برای اون دوستانی که با این تابع آشنایی ندارن مجدد کدهای مربوطه در زیر قرار میدم:

بعد از اینکه کاربر به صفحه فراموشی رمز راهنمایی شد باید کدهای مربوط به اعتبارسنجی کاربر و ارسال ایمیل تغییر رمز را هم به ادامه فایل functions.php اضافه کنیم.

تابع بالا چک میکند که کاربری با ایمیل دریافتی وجود دارد یا خیر ، در صورت وجود برای کاربر ایمیلی حاوی لینک تغییر رمز ارسال میکنید و سپس کاربر را به صفحه لاگین (user-login) که در آموزش قبل ساختیم هدایت کرده و پیام مناسبی به کاربر نمایش میدهد و در صورت بروز خطا در صفحه فراموشی رمز (lost-password) آن خطا را نمایش می دهد.

جهت نمایش پیام مناسب در صفحه لاگین باید کدهای زیر را به صفحه لاگین (custom-login.php) اضافه کنیم :

برای سفارشی سازی ایمیل ارسالی جهت تغییر رمز عبور کدهای زیر را به فایل functions.php اضافه میکنیم:

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

طراحی صفحه تغییر رمز:

ابتدا یک فایل php با نام custom-reset-password.php ساخته و کدهای زیر را به این صفحه اضافه میکنیم :

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

جایگزین صفحه فراموشی رمز وردپرس

در صفحه افزودن برگه عبارت reset-password را تایپ کرده و سپس از قسمت ویژگی های برگه بخش قالب گزینه Reset Password (همان نامی که در ابتدای فایل custom-reset-password.php وارد کرده بودیم) را انتخاب کرده و گزینه انتشار را کلیک می کنیم.

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

جایگزین صفحه فراموشی رمز وردپرس

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

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

  • توجه : جهت نمایش پیام مناسب در صفحه لاگین کد زیر را به switch..case  موجود در صفحه لاگین (custom-login.php) اضافه میکنیم :

حالا وقت اون رسیده تا کدهای مربوط به تغییر رمز را به ادامه توابع اضافه کنیم :

در اینجا نیز ابتدا معتبر بودن کاربر و کلید موقت تغییر رمز توسط تابع check_password_reset_key بررسی می شود و در صورت تایید اعتبار رمز عبور وارد شده توسط کاربر مورد بررسی قرار میگیرد. در صورت وجود خطا در صفحه reset-password نمایش داده شده و اگر خطایی وجود نداشته باشد رمز عبور کاربر تغییر داده شده و در صفحه user-login به کاربر پیام تغییر رمز نمایش داده میشود.

  • توجه: برای نمایش پیام تغییر رمز در صفحه لاگین باید کد زیر را به فایل صفحه لاگین (custom-login.php) اضافه کنیم :

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

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

4 دیدگاه برای “جایگزین صفحه فراموشی رمز وردپرس + فیلم آموزشی

  • محمد مقدم
    - ۲۲ آبان , ۱۳۹۶

    با سلام لطفا در صورت امکان ویدیو برای این آموزش قرار بدین.
    درخواست گذاشتن این اموزش رو هم دارم :
    میشه بهمون یاد بدید چطوری زیر منوی افقی بسازیم مثل خبر انلاین؟ همیشه بهمون عمودیشو یاد دادن و این برای سایت های شرکتی و وبلاگی خوبه. برای سایت های خبری زیر منوی افقی خیلی بهتره اینم عکس :

    http://s8.picofile.com/file/8311612968/05.jpg

    فک کنم با تسلطی که شما دارین تو یه ویدیو ۱۰ دقیقه ای َرندَش کنید و به ما یادش بدید منتظریم مرسی.

    • الناز
      - ۲۲ آبان , ۱۳۹۶

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

  • محمد مقدم
    - ۳۰ آبان , ۱۳۹۶

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

    http://s8.picofile.com/file/8312329550/1.png

    http://s9.picofile.com/file/8312330218/Untitled.png

    • سیروس اسدی
      - ۳ آذر , ۱۳۹۶

      سلام دوست عزیز. حتما مقاله درخواستیتون رو آماده و منتشر میکنیم.

دیدگاه خود را بیان کنید

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

Captcha loading...