• Главная»
  • Уроки»
  • Wordpress»
  • Собственное управление пользователями в WordPress — Часть 1: Замена страницы входа в систему

Собственное управление пользователями в WordPress — Часть 1: Замена страницы входа в систему

Благодаря широкой возможности создания плагинов и тем, WordPress из простой блог-платформы в одночасье превратилась в надёжный костяк для различного рода приложений, начиная онлайн-магазинами, заканчивая платформами по распространению электронных книг.

Традиционно, только администратор может заходить в панель управления, однако в более гибких приложениях данная возможность более расширена: многие пишут собственные плагины для входа клиентов в систему.

В WordPress есть отличные инструменты для управления пользователями, их ролями и возможностями. Вдобавок ко всему этому, мы можем расширять данные возможности, используя плагины и убедиться, что новые возможности полностью удовлетворяют наши требования. После всего этого, посмотрев на стандартную страницу входа пользователя в систему, понимаешь, что чего-то не хватает.

В этой серии уроков, состоящей из 3х частей мы покажем как создать собственную страницу регистрации, входа пользователя в систему и систему восстановления пароля.

Какова цель данного урока?

По умолчанию страницу входа пользователя в систему выглядит так:

Вообще говоря, страница свою роль выполняет и выглядит неплохо. Однако при разработке более серьёзного сайта, непристижно использовать стандартную тему, поэтому зачем нам использовать данный функционал?

У нас есть возможность создать форму самим, оформить через CSS и добавить целый набор фильтров для собственной валидации данных. Всё это вполне реализуемо, однако, ещё есть ещё один не очень приятный факт: на данный момент страница входа полностью отсоединена от всего остального сайта.

Исходя из этого нам не подойдут простые косметические изменения. Мы будем создавать форму с нуля. В данном уроке мы начнём создавать WordPress плагин, который заменит стандартную страницу входа в систему. В процессе вы увидите как вообще организована логика входа пользователя в систему.

В следующих двух частях мы продолжим работу, создав форму регистрации и механизм восстановления пароля.

Вы можете создавать плагин по ходу изучения урока, или скачать полный вариант с GitHub репозитория.

Приступим!

Создание плагина

В основном подгонка под себя заключается в создании собственной темы. У нас же будет свой собственный функционал, поэтому мы будет разрабатывать плагин.

Итак, первое что нам нужно сделать, так это создать плагин, где мы будем хранить все файлы.

Создаём папку personalize-login в каталоге plugin. Внутри неё создаём ещё одну папку под названием templates. В ней мы будем хранить HTML шаблоны форм.

Теперь в корневой папке вашего плагина создаём одноимённый файл personalize-login.php. В нём будет храниться основной код плагина, включая его инициализацию:

<?php
/**
 * Plugin Name:       Personalize Login
 * Description:       A plugin that replaces the WordPress login flow with a custom page.
 * Version:           1.0.0
 * Author:            Jarkko Laine
 * License:           GPL-2.0+
 * Text Domain:       personalize-login
 */

class Personalize_Login_Plugin {

    /**
     * Инициализация плагина.
     */
    public function __construct() {

    }

}

// Инициализация плагина
$personalize_login_pages_plugin = new Personalize_Login_Plugin();

Конструктор плагина пока пуст, но это ненадолго: вскоре мы добавим в него фильтрацию и хуки.

Теперь давайте создадим несколько страниц в WordPress.

Создаём страницу для входа пользователя в систему

По умолчанию, при попытке войти в панель администрирования или, кликнув по кнопке Log In, WordPress перенесёт вас на страницу wp-login.php. Сейчас мы это подправим, создав для этого специальную страницу.

В перспективе можно создать отдельный раздел настроек в панели администрирования, где можно будет выбрать подходящую страницу, а так же выставить другие настройки. Сейчас же мы делаем акцент на другом и не хотим излишне усложнять процесс. Поэтому на данный момент нужные нам страницы будут создаваться напрямую при активации плагина.

В WordPress существуют специальные функции, называемые хуками. У каждой из них своё предназначение. Мы же воспользуемся той, которая выполняется непосредственно при активации плагина.

Отметим, что хук активации не будет запускаться при обновлении плагина. Именно по этой причине, если вы внесёте какие-то изменения в саму функцию хука, то плагин нужно будет деактивировать и активировать снова.

Для регистрации хука активации просто добавьте следующий код в файл плагина:

// Создаём страницы при активации плагина
register_activation_hook( __FILE__, array( 'Personalize_Login_Plugin', 'plugin_activated' ) );

Теперь внутри плагина пишем функцию plugin_activated:

/**
 * Хук активации.
 *
 * Создаёт все нужные страницы для входа пользователя в систему.
 */
public static function plugin_activated() {
    // Information needed for creating the plugin's pages
    $page_definitions = array(
        'member-login' => array(
            'title' => __( 'Sign In', 'personalize-login' ),
            'content' => '[custom-login-form]'
        ),
        'member-account' => array(
            'title' => __( 'Your Account', 'personalize-login' ),
            'content' => '[account-info]'
        ),
    );

    foreach ( $page_definitions as $slug => $page ) {
        // Проверка существования страницы
        $query = new WP_Query( 'pagename=' . $slug );
        if ( ! $query->have_posts() ) {
            // Добавляем страницы, исходя из представленного массива данных
            wp_insert_post(
                array(
                    'post_content'   => $page['content'],
                    'post_name'      => $slug,
                    'post_title'     => $page['title'],
                    'post_status'    => 'publish',
                    'post_type'      => 'page',
                    'ping_status'    => 'closed',
                    'comment_status' => 'closed',
                )
            );
        }
    }
}

Итак, в данной функции (строки 8-17) происходит создание страниц, исходя из данных, представленных в переменной $page_definitions. Используя данный массив мы можем создать сколько угодно страниц. Для этого достаточно добавить новый элемент массива, в нём указать: slug и другие данные.

В данном примере я добавляю две страницы: одну для входа пользователя в систему (member-login); другую - куда будут попадать пользователи (не админы) после успешного входа (member-account).

На строках 19-36 происходит само создание страниц. Функция проходится по каждому элементу массива и создаёт страницу с заданным slug-ом, если её ещё не существует.

Создание страниц осуществляется функцией wp_insert_post. Более подробную информацию можно найти на сайте WordPress Кодекс.

Теперь давайте активируем плагин и убедимся, что нужные страницы действительно создаются. Отправляемся в панель управления, секцию Плагины и активируем наш плагин. Теперь заходим в раздел страниц и ищем наши:

Если зайти на страницу Sign In, то там не будет ничего кроме названия и slug-а.

Скоро мы это исправим.

Добавляем контент на страницу входа в систему

Теперь когда у нас есть несколько страниц, можем начать их заполнять.

В данном уроке мы создадим страницу входа пользователей (на заметку статья по созданию удобной страницы входа). В следующих уроках пойдём дальше и создадим страницу регистрации и восстановления пароля.

Когда у вас своя собственная страница входа в систему, то вы абсолютно никак не ограничены в её оформлении. Вы можете воспользоваться редактором WordPress для добавления текста и графики (описания преимуществ регистрации). В качестве альтернативы можем создать отдельный HTML шаблон и забацать форму там.

В данном уроке мы создадим шорткод, который будет заменяться нашей формой. Его же можно использовать в своём собственном шаблоне.

Шаг 1: Создание шорткода

На шаге создания страницы (в хуке активации) мы уже добавили шорткод (custom-login-form). Однако до тех пор, пока мы его не зарегистрируем, WordPress не будет о нём подозревать.

Давайте сделаем это. Открываем класс плагина и добавляем в конструктор следующий код:

add_shortcode( 'custom-login-form', array( $this, 'render_login_form' ) );

Данная строка - ничто иное, как регистрация функции render_login_form внутри плагина, для создания шорткода custom-login-form.

Далее пишем саму функцию:

/**
 * Шорткод формы входа в систеиу.
 *
 * @param  array   $attributes  Атрибуты шорткода.
 * @param  string  $content     Текст шорткода.
 *
 * @return string  The shortcode output
 */
public function render_login_form( $attributes, $content = null ) {
    // Разбор атрибутов шорткода
    $default_attributes = array( 'show_title' => false );
    $attributes = shortcode_atts( $default_attributes, $attributes );
    $show_title = $attributes['show_title'];

    if ( is_user_logged_in() ) {
        return __( 'You are already signed in.', 'personalize-login' );
    }

    // Передаём параметр для перенаправления: по умолчанию,
    // Если будет передан валиндый параметр, то
    // обрабатываем его.
    $attributes['redirect'] = '';
    if ( isset( $_REQUEST['redirect_to'] ) ) {
        $attributes['redirect'] = wp_validate_redirect( $_REQUEST['redirect_to'], $attributes['redirect'] );
    }

    // Отображаем форму входа
    return $this->get_template_html( 'login_form', $attributes );
}

Во-первых, на строчках 10-13, функция считывает данные шорткода — на данный момент параметр только один, show_title, который принимает логическое значение. Если значение параметра не указать, то оно будет равно false.

Затем шорткод-функция проверяет был ли уже осуществлён вход пользователем, и в зависимости от этого определяет будет ли отображена форма входа в систему.

На строках 19-25, функция проверяет была ли передана переменная redirect_to. После ввода данных пользователь будет отправлен на данный адрес, так что это нужно учитывать, поскольку мы заменяем стандартную систему входа пользователя в систему. Если redirect_to не задан или URL неверен, то функция будет использовать ссылку на текущую страницу.

Для разделения функционала и отображения, мы разместим весь HTML в папке templates, которую создали в начале урока.

В дальнейшем содержимое этой папке будет заполняться другими шаблонами (к примеру формой регистрации для новых пользователей). В то же время осуществим рендеринг шаблона в одном месте во избежании повторения кода (строки 27-28). Переменные, которые будут передаваться в шаблон следует указывать в массиве $attributes.

Добавляем функцию get_template_html в класс плагина:

/**
 * Renders the contents of the given template to a string and returns it.
 *
 * @param string $template_name The name of the template to render (without .php)
 * @param array  $attributes    The PHP variables for the template
 *
 * @return string               The contents of the template.
 */
private function get_template_html( $template_name, $attributes = null ) {
    if ( ! $attributes ) {
        $attributes = array();
    }

    ob_start();

    do_action( 'personalize_login_before_' . $template_name );

    require( 'templates/' . $template_name . '.php');

    do_action( 'personalize_login_after_' . $template_name );

    $html = ob_get_contents();
    ob_end_clean();

    return $html;
}

Данная функция будет искать шаблон в каталоге templates и рендерить её, используя буфер (строки 14-23). Буфер, грубо говоря, собирает все выводы, которые осуществляются в шаблоне между ob_start и ob_end_clean, таким образом полную строку можно будет получить используя ob_get_contents.

В самом конце функции, шорткод возвращает сформированную строку.

Вызов метода do_action, который окружает require не обязателен, но открывает дополнительные возможности, а именно позволяет совершить какие-то действия до и после обработки шаблона.

Для завершения шорткода нужно создать HTML шаблон: создаём PHP файл в каталоге templates, называем его login_form.php. Чтобы протестировать отображение, внутри шаблона выводим текст Sign In. Теперь после захода на собственную страницу логина мы должны увидеть что-то типа этого (если используем тему Twenty Fifteen):

Наш шорткод работает. Теперь самое время заняться самой формой.

Шаг 2: Добавление контента в HTML Шаблон

Продолжаем работу над login_form.php, убираем весь текст и заменяем на полностью функциональную форму входа:

<div class="login-form-container">
    <?php if ( $attributes['show_title'] ) : ?>
        <h2><?php _e( 'Sign In', 'personalize-login' ); ?></h2>
    <?php endif; ?>

    <?php
        wp_login_form(
            array(
                'label_username' => __( 'Email', 'personalize-login' ),
                'label_log_in' => __( 'Sign In', 'personalize-login' ),
                'redirect' => $attributes['redirect'],
            )
        );
    ?>

    <a class="forgot-password" href="<?php echo wp_lostpassword_url(); ?>">
        <?php _e( 'Forgot your password?', 'personalize-login' ); ?>
    </a>
</div>

В верхней части шаблона выводится название страницы, отображение которого контролируется через параметр show_title.

Изучив строки 6-14, вы можете понять, что мы используем возможности WordPress для создания формы, а именно функцию wp_login_form. Данная функция принимает один единственный аргумент - массив настроек, с помощью которых можно изменить содержание формы входа.

А вот и настройки, которые я использовал в нашем коде:

  • Во-первых, я хотел использовать фразу "Sign In", а не "Log In".
  • Во-вторых, я хочу использовать email пользователя в качестве его имени, поэтому текст элемента был изменён на "Email".
  • В третьих, был указан редирект URL на скрипт шорткода.

Для большей подгонки под себя можете ознакомиться с всевозможными настройками параметров, которые можно передать в метод wp_login_form:

Параметр Описание Значение по умолчанию
echo Должен ли быть возвращён код формы. Если передать false, то ответ будет возвращён в качестве строки. true
redirect URL, на который будет отправлен пользователь после успешного входа. Редирект на текущую страницу.
form_id Идентификатор формы. loginform
label_username Текст элемента label для поля имени пользователя. __( 'Username' )
label_password Текст элемента label для поля пароля. __( 'Password' )
label_remember Текст элемента label для чекбокса "Запомнить Меня". __( 'Remember Me' )
label_log_in Текст элемента label для кнопки "Log In". __( 'Log In' )
id_username Идентификатор HTML элемента имени пользователя. user_login
id_password Идентификатор HTML элемента пароля. user_pass
id_remember Идентификатор HTML элемента чекбокса “Запомнить меня”. rememberme
id_submit Идентификатор HTML кнопки отправки формы. wp-submit
remember Показывать кнопку "Запомнить Меня" или нет. true
value_username Значение по умолчанию для поля имени пользователя. Пусто
value_remember Должен ли быть зажат чекбокс "Запомнить Меня" или нет. false

На строках 16-18 указана ссылка на стандартный функционал WordPress по восстановлению пароля — данный сегмент мы изменим в третьей части данной серии.

Теперь страница входа в систему будет выглядеть так:

Для большинства пользователей данных действий буде достаточно, однако если вы хотите пойти дальше, то ничего не должно вам мешать, и вы можете полностью создать форму с нуля.

В этом случае вам просто нужно создать HTML форму, указав в качестве скрипта обработчика wp-login.php — полный URL на скрипт обработчик форм можно получить, воспользовавшись функцией wp_login_url. В форме должны присутствовать поля log и pwd для логина и пароля.

Вот так вот можно создать форму без использования wp_login_form:

<div class="login-form-container">
    <form method="post" action="<?php echo wp_login_url(); ?>">
        <p class="login-username">
            <label for="user_login"><?php _e( 'Email', 'personalize-login' ); ?></label>
            <input type="text" name="log" id="user_login">
        </p>
        <p class="login-password">
            <label for="user_pass"><?php _e( 'Password', 'personalize-login' ); ?></label>
            <input type="password" name="pwd" id="user_pass">
        </p>
        <p class="login-submit">
            <input type="submit" value="<?php _e( 'Sign In', 'personalize-login' ); ?>">
        </p>
    </form>
</div>

Далее все формальности по вопросам аутентификации WordPress берёт на себя, так что наша форма теперь полностью функциональна: вводим валидные данные, нажимаем на кнопку Sign In и без проблем входим в систему.

При вводе неверных данных функционал чуть не доделан: вместо редиректа на страницу логина, вы увидите обычную страницу WordPress логина. Так же если не обратиться напрямую к нашей форме, мы будем видеть стандартный вариант входа в систему WordPress.

Теперь нам нужно сделать так чтобы при любом раскладе пользователь попадал на нашу страницу логина.

Направление пользователя на страницу логина

Давайте начнём с перенаправления пользователя на нашу форму.

Шаг 1: Направление пользователя на страницу логина

Если пользователь хочет зайти на любую страницу админки или кликнет на кнопку Log in, то по умолчанию он будет направлен на страницу wp-login.php. Мы хотим это изменить и вместо этого отображать страницу member-login.

Весь функционал WordPress, который мы подвергаем обработке, начиная от входа пользователя в систему, заканчивая сменой пароля, обрабатывается в различных частях wp-login.php в зависимости от параметра action.

Если посмотреть на код внутри PHP файла, то перед функционалом аутентификации можно заметить два метода: login_init и login_form_{action}, где {action} - это название метода, который будет выполнен (к примеру login, postpass, или logout).

Для решения нашей задачи мы воспользуемся хуком login_form_login, где сами предусмотрим условия при которых должен быть совершён редирект пользователя на страницу логина.

Добавьте следующий код в конструктор плагина:

add_action( 'login_form_login', array( $this, 'redirect_to_custom_login' ) );

Затем добавляем новую функцию:

/**
 * Направление пользователя на собственную страницу аутентификации вместо wp-login.php.
 */
function redirect_to_custom_login() {
    if ( $_SERVER['REQUEST_METHOD'] == 'GET' ) {
        $redirect_to = isset( $_REQUEST['redirect_to'] ) ? $_REQUEST['redirect_to'] : null;

        if ( is_user_logged_in() ) {
            $this->redirect_logged_in_user( $redirect_to );
            exit;
        }

        // В остальных случая направляем на страницу логина
        $login_url = home_url( 'member-login' );
        if ( ! empty( $redirect_to ) ) {
            $login_url = add_query_arg( 'redirect_to', $redirect_to, $login_url );
        }

        wp_redirect( $login_url );
        exit;
    }
}

Функция redirect_to_custom_login будет вызываться в двух случаях: во-первых, при заходе на страницу логина; во вторых, если пользователь аутентифицируется, заполнив форму. Для того чтобы различить один случай от другого мы смотрим на тип запроса: отправка формы будет осуществляться через тип POST, а простой заход на страницу через GET.

Итак, для того чтобы wp-login.php обрабатывал нашу форму аутентификации, на строке 5, мы ставим проверку, чтобы быть уверенным в том, что редирект будет осуществляться при GET запросах.

На строке 6, проверяется условие передачи переменной redirect_to. Если это так, то сохраним это значение во временной переменной $redirect_to.

Так же бессмысленно показывать страницу аутентификации пользователю, который уже вошёл в с систему, поэтому в этом случае мы направим его на страницу информации о его профиле (строки 8-11). Чтобы не дублировать код редиректа, который будет ещё использоваться не раз, выведем его в отдельную функцию, redirect_logged_in_user.

На данный момент непосредственно указываем слаг страницы, на которую следует направить пользователя. Для того чтобы всё работало нормально, следует выставить любое значение, кроме значения по умолчанию в настройках Permalinks (Настройки постоянных ссылок).

На строках 15-17 мы добавляем параметр redirect_to в новый объект запроса.

На стоке 20 можно заметить, что мы напрямую заканчиваем скрипт, выполнением функции exit. Если этого не сделать, то после нашего кода запустится стандартный функционал wp-login.php, что может вызвать некоторые проблемы. Это следует учитывать.

Теперь добавляем функцию redirect_logged_in_user:

/**
 * Направление пользователя в зависимости является ли он администратором или нет
 *
 * @param string $redirect_to   An optional redirect_to URL for admin users
 */
private function redirect_logged_in_user( $redirect_to = null ) {
    $user = wp_get_current_user();
    if ( user_can( $user, 'manage_options' ) ) {
        if ( $redirect_to ) {
            wp_safe_redirect( $redirect_to );
        } else {
            wp_redirect( admin_url() );
        }
    } else {
        wp_redirect( home_url( 'member-account' ) );
    }
}

Данная функция будет перенаправлять пользователя на тот или иной URL в зависимости от его уровня доступа. В случае, если это администратор, то проверяем параметр $redirect_to: если он задан, то пользователь будет направлен именно туда вместо стандартного адреса admin_url.

Шаг 2: Перенаправление в случае ввода неверных данных

Итак, мы реализовали первый пункт при котором пользователь заходит на страницу wp-login.php или пытается попасть в раздел администрирования. Это ещё не всё: если при заполнении формы будут допущены ошибки (неверное имя пользователя или пароль, пустые значение и так далее), то пользователю до сих пор отобразится форма аутентификации в обычном виде.

В WordPress аутентификация пользователя происходит при вызове функции wp_authenticate, расположенной в pluggable.php.

В данной функции происходит фильтрация параметров, а затем передача данных в хук authenticate. Именно на этом шаге мы можем вмешаться и заменить стандартную процедуру аутентификации нашей собственной.

На данный момент мы не заинтересованы в замещении процесса аутентификации. Что нам нужно, так это фильтрация данных для того чтобы получить сообщения об ошибках при вводе некорректных данных:

  1. Совершаем хук на функцию authenticate с высоким приоритетом (в WordPress фильтрах и действиях чем выше цифра приоритета, тем позже вызовется функция).
  2. Функция фильтра примет результаты из предыдущей функции. Полученные данные можно проверить на наличие ошибок.
  3. Если ошибок не найдено, то WordPress может продолжить процесс аутентификации.
  4. При наличии ошибок, нам нужно отобразить их на странице аутентификации.

В текущей версии WordPress (4.2) существует два фильтра, которые можно “захукать”:

add_filter( 'authenticate', 'wp_authenticate_username_password',  20, 3 );
add_filter( 'authenticate', 'wp_authenticate_spam_check',         99    );

Обычный приоритет для аутентификации равен 20, а wp_authenticate_spam_check равен 99, так что нам нужно выбрать значение больше 99 (Я выбрал 101). Таким образом наш функционал запустится после двух предыдущих. В будущем данное значение может быть увеличено, если какой-то другой плагин будет использовать фильтр с данным приоритетом.

Для начала нам нужно добавить объявление фильтра в конструктор класса:

add_filter( 'authenticate', array( $this, 'maybe_redirect_at_authenticate' ), 101, 3 );

Затем мы добавляем функцию maybe_redirect_at_authenticate в конце класса плагина:

/**
 * Направление пользователя при вводе неверных данных аутентификации
 *
 * @param Wp_User|Wp_Error  $user       Аутентифицированный пользователь или ошибки, возникшие в процессе аутентификации.
 * @param string            $username   Имя пользователя.
 * @param string            $password   Пароль.
 *
 * @return Wp_User|Wp_Error Аутентифицированный пользователь или ошибки, возникшие в процессе аутентификации.
 */
function maybe_redirect_at_authenticate( $user, $username, $password ) {
    // Проверка на наличие ошибок аутентификации
    if ( $_SERVER['REQUEST_METHOD'] === 'POST' ) {
        if ( is_wp_error( $user ) ) {
            $error_codes = join( ',', $user->get_error_codes() );

            $login_url = home_url( 'member-login' );
            $login_url = add_query_arg( 'login', $error_codes, $login_url );

            wp_redirect( $login_url );
            exit;
        }
    }

    return $user;
}

Фильтр authenticate принимает три параметра:

  1. $user объект пользователя или класса Wp_Error.
  2. $username наличие имени пользователя.
  3. $password наличие пароля.

Для нас наиболее интересен первый параметр: если предыдущие фильтры обнаружили ошибку, то в $user будет записана соответствующая информация.

Это происходит начиная с строчки 13, на строках 15-18 происходит передача этих данных в URL. В конце концов происходит редирект на нашу страницу логина и отображение ошибок.

Шаг 3: Вывод сообщений об ошибках

На данный момент наш плагин успешно перехватывает сообщения об ошибках. Теперь нам осталось осуществить вывод этих сообщений пользователю.

Далее мы создадим функцию для преобразования кодов ошибок в сообщения, используя switch...case.

/**
 * Находит и возвращает сообщение об ошибки в зависимости от кода.
 *
 * @param string $error_code    Код ошибки.
 *
 * @return string               Сообщение об ошибке.
 */
private function get_error_message( $error_code ) {
    switch ( $error_code ) {
        case 'empty_username':
            return __( 'You do have an email address, right?', 'personalize-login' );

        case 'empty_password':
            return __( 'You need to enter a password to login.', 'personalize-login' );

        case 'invalid_username':
            return __(
                "We don't have any users with that email address. Maybe you used a different one when signing up?",
                'personalize-login'
            );

        case 'incorrect_password':
            $err = __(
                "The password you entered wasn't quite right. Did you forget your password?",
                'personalize-login'
            );
            return sprintf( $err, wp_lostpassword_url() );

        default:
            break;
    }

    return __( 'An unknown error occurred. Please try again later.', 'personalize-login' );
}

Когда у нас есть сообщения об ошибках можем их собрать воедино перед формированием формы render_login_form:

// Сообщения об ошибках
$errors = array();
if ( isset( $_REQUEST['login'] ) ) {
    $error_codes = explode( ',', $_REQUEST['login'] );

    foreach ( $error_codes as $code ) {
        $errors []= $this->get_error_message( $code );
    }
}
$attributes['errors'] = $errors;

Сам вывод ошибок будет осуществляться в шаблоне login_form.php. Добавьте следующий код прямо перед выводом формы:

<!-- Show errors if there are any -->
<?php if ( count( $attributes['errors'] ) > 0 ) : ?>
    <?php foreach ( $attributes['errors'] as $error ) : ?>
        <p class="login-error">
            <?php echo $error; ?>
        </p>
    <?php endforeach; ?>
<?php endif; ?>

Теперь можем протестировать сообщения об ошибках. Введите изначально неверные данные и посмотрите на результат:

Шаг 4: Отображение сообщения после успешного входа

Мы почти что закончили. Осталось ещё два момента: отображение сообщения об успешном входе и выходе из системы.

Давайте начнём с выхода.

Для выхода из системы WordPress использует функцию wp_logout. Как раз это место нам нужно “захукать”, совершив перенаправление, опередив WordPress.

В конструктор класса логина вставьте следующие строки:

add_action( 'wp_logout', array( $this, 'redirect_after_logout' ) );

Теперь добавляем функцию:

/**
 * Отображение собственной страницы аутентификации после выхода.
 */
public function redirect_after_logout() {
    $redirect_url = home_url( 'member-login?logged_out=true' );
    wp_safe_redirect( $redirect_url );
    exit;
}

Данная функция направляет пользователя на страницу member-login, передавая параметр logged_out.

Теперь немного модифицируем шорткод формы, добавив обработку нового параметра:

// Проверяем был ли осуществлён выход
$attributes['logged_out'] = isset( $_REQUEST['logged_out'] ) && $_REQUEST['logged_out'] == true;

В конце концов нам необходимо вывести соответствующее сообщение в шаблоне:

<!-- Show logged out message if user just logged out -->
<?php if ( $attributes['logged_out'] ) : ?>
    <p class="login-info">
        <?php _e( 'You have signed out. Would you like to sign in again?', 'personalize-login' ); ?>
    </p>
<?php endif; ?>

Вот и всё. Теперь после входа и выхода вы увидите следующее:

Направление пользователя на страницу профиля после успешного входа в систему

Теперь у нас есть полностью функциональная страница входа пользователя в систему и вывод ошибок. Завершающим шагом будет осуществление перенаправления пользователя после успешного входа.

Администраторов мы пустим в панель управления, а пользователей на страницу member-account.

Поскольку в WordPress есть специальный фильтр, который возвращает URL для перенаправления после успешной аутентификации, то мы можем его заменить.

Для этого добавим последний фильтр в конструкторе плагина:

add_filter( 'login_redirect', array( $this, 'redirect_after_login' ), 10, 3 );

Теперь добавляем фильтр-функцию:

/**
 * Возвращает URL на который должен быть перенаправлен пользователь после успешной аутентификации.
 *
 * @param string           $redirect_to           URL для перенаправления.
 * @param string           $requested_redirect_to Запрашиваемый URL.
 * @param WP_User|WP_Error $user                  Объект WP_User если аутентификация прошла успешна или объект WP_Error в обратном случае.
 *
 * @return string URL для перенаправления
 */
public function redirect_after_login( $redirect_to, $requested_redirect_to, $user ) {
    $redirect_url = home_url();

    if ( ! isset( $user->ID ) ) {
        return $redirect_url;
    }

    if ( user_can( $user, 'manage_options' ) ) {
        // Используем параметр redirect_to, если в нём было передано значение.
        if ( $requested_redirect_to == '' ) {
            $redirect_url = admin_url();
        } else {
            $redirect_url = $requested_redirect_to;
        }
    } else {
        // Не администраторы будут направляться на страницу информаци о профиле
        $redirect_url = home_url( 'member-account' );
    }

    return wp_validate_redirect( $redirect_url, home_url() );
}

Затем функция проверяет состоянии авторизации юзера (строка 13) и возвращает на предыдущую страницу, если пользователь в базе не найден.

Затем происходит перенаправление пользователя в зависимости от его роли:

  • Администраторы (проверка на строке 17, используя функцию user_can) направляются на страницу сводки в панели администрирования WordPress (строка 20), если не задан иной адрес в параметре redirect_to.
  • Обычные пользователи перенаправляются на страницу member-account чтобы не попасть на страницу администрации. Если вы с этим не согласны, то можете поиграть с настройками и направить его на страницу профиля в панели администрирования WordPress.

В зависимости от ваших нужд можете добавить ещё несколько редиректов в зависимости от роли пользователя.

Что дальше?

Вот и всё. Теперь у нас есть плагин, который замещает стандартную страницу входа пользователя в систему.

В следующем уроке мы создадим свой собственный процесс регистрации пользователя, добавим нужные поля и каптчу.

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: http://code.tutsplus.com/tutorials/build-a-custom-wordpress-user-flow-part-1-replace-the-login-page--cms-23627
Перевел: Станислав Протасевич
Урок создан: 18 Августа 2015
Просмотров: 11543
Правила перепечатки


5 последних уроков рубрики "Wordpress"

или авторизуйтесь, чтобы добавлять комментарии, оценивать уроки и сохранять их в личном кабинете
  • 19 Августа 2015 16:29
    ksans
    А можно ссылку на полный вариант с GitHub дать?
    • 20 Августа 2015 08:45
      stas.protasevich
      https://github.com/tutsplus/personalize-login-tutorial-part-1
      • 1 Сентября 2015 00:35
        kalisto
        Спасибо за отличный пост!
  • 14 Декабря 2015 08:34
    Gevorg Sargsyan
    Я новичок и хочу у меня в блоге сделать так как сделали вы, ну на счет входа пользоваетльей, регистрация, личний кабинет и все что связанно с этим.. Можете как то помочь.? Какое то руководство о всем как вы делали есть?
^ Наверх ^