Как создать страницу входа в WordPress без использования плагина
Опубликовано: 2022-01-03Вы ищете лучший способ создать страницу входа в WordPress без плагина и без настройки страницы входа WordPress по умолчанию? Если вы хотите создать страницу входа в WordPress без использования популярных плагинов входа в WordPress, вы можете сделать это, добавив код входа в шорткод или в пользовательский шаблон страницы.
В этом уроке я покажу, как вы можете создать страницу входа в WordPress с помощью функции шорткода, а также как вы можете создать страницу входа в WordPress с помощью функции входа в пользовательском шаблоне страницы.
Каждый из этих способов должен без проблем работать с любой темой WordPress или любой средой хостинга WordPress.
Создать страницу входа в WordPress без плагина
Цель этого руководства — помочь вам создать страницу входа, подобную странице входа в WordPress по умолчанию, которая позволит вам получить доступ к панели управления WordPress после входа в систему.
В идеале эта настраиваемая страница входа должна быть страницей входа в систему, на которой пользователи вашего сайта входят в систему. Как я уже упоминал во введении, в этом руководстве мы рассмотрим два способа;
- Шорткод страницы входа
- Пользовательский вход в шаблон страницы
Создать шорткод страницы входа
Первым шагом, когда мы хотим создать страницу входа в любом месте WordPress, является использование шорткода. Шорткод можно добавить на любую страницу или любую публикацию или даже виджет и пользовательский шаблон страницы.
На этом этапе мы создадим шорткод для формы входа, который будет использоваться для публикации формы входа на любой странице в WordPress или в сообщении. Такой подход дает пользователю возможность создавать страницу входа в любом разделе своего сайта.
Для создания шорткода мы будем использовать следующий код:
// Создаем шорткод формы входа функция njengah_add_login_shortcode() { add_shortcode('njengah-login-form', 'njengah_login_form_shortcode'); }
Мы добавили шорткод в функцию, чтобы мы могли инициализировать его позже. Функция add_shortcode создает шорткод в WordPress. Общее выражение функции add_shortcode() выглядит следующим образом:
add_shortcode (строка $tag, вызываемый $callback)
Как видите, у этой функции есть два параметра:
Параметр | Описание |
$тег | Это текст, который будет использоваться в редакторе сообщений или страниц для публикации шорткода. Например, в данном случае это «njengah-login-form». Когда мы добавим его на страницу, он будет заключен в квадратные скобки: [njengah-login-form] |
$обратный вызов | Это функция обратного вызова, которая будет отображать функции шорткода. Например, в этом случае мы добавим код для отображения формы входа в эту функцию обратного вызова, как показано в приведенном ниже коде. |
//Шаг 2: Обратный вызов шорткода функция njengah_login_form_shortcode() { если (is_user_logged_in()) return '<p>Добро пожаловать. Вы вошли в систему!</p>'; ?> <div class="njengah-login-tutorial" > <?php вернуть wp_login_form( множество( 'эхо' => ложь, 'label_username' => __('Ваше имя пользователя'), 'label_password' => __('Ваш пароль'), 'label_remember' => __('Запомнить меня') ) ); ?> </div> <?php }
Если вы внимательно проверите код, вы заметите, что мы использовали функцию для проверки того, вошел ли пользователь в систему, как я объяснял в посте о том, как проверить, вошел ли пользователь в WordPress .
Если пользователь не вошел в систему, мы используем функцию wp_login_form() для отображения формы входа. Если пользователь вошел в систему, мы условно показываем приветственное сообщение на этой странице вместо отображения формы входа.
Функция WP wp_login_form()
wp_login_form() — это функция WordPress, которая предоставляет разработчикам тем возможность отображать форму WordPress в любом месте. В общем случае эту функцию можно выразить следующим образом:
wp_login_form(массив $args = array())
$args может быть массивом параметров, управляющих отображением формы.
Ниже приведены аргументы, которые можно использовать в массиве для изменения способа отображения формы.
Аргумент $arg | Описание |
эхо | Если отображать форму входа или возвращать HTML-код формы. Истина по умолчанию (эхо). |
перенаправить | URL для перенаправления. Должен быть абсолютным, например «<a href="https://example.com/mypage/">https://example.com/mypage/</a>". По умолчанию выполняется перенаправление обратно на URI запроса. |
form_id | Значение атрибута ID для формы. Логининформ по умолчанию. |
label_username | Метка для поля имени пользователя или адреса электронной почты. По умолчанию «Имя пользователя или адрес электронной почты». |
label_password | Метка для поля пароля. «Пароль» по умолчанию. |
label_remember | Метка для запоминающего поля. По умолчанию «Запомнить меня». |
label_login | Ярлык для кнопки отправки. По умолчанию «Войти». |
id_username | Значение атрибута ID для поля имени пользователя. По умолчанию «user_login». |
id_password | Значение атрибута ID для поля пароля. По умолчанию «user_pass». |
id_remember | Значение атрибута ID для поля запоминания. По умолчанию «запомнить меня». |
id_submit | Значение атрибута ID для кнопки отправки. По умолчанию «wp-submit». |
Помните | Проверяет, отображать ли флажок «запомнить меня» в форме |
значение_имя_пользователя | Значение по умолчанию для поля имени пользователя. |
значение_помнить | Проверяет, должен ли быть установлен флажок «Запомнить меня» по умолчанию. По умолчанию false (не отмечено) |
Например, вы можете задать массив аргументов и передать его этой функции следующим образом:
<?php wp_login_form( множество( 'эхо' => правда, // Значение «перенаправления» по умолчанию возвращает пользователя к URI запроса. 'перенаправить' => ( is_ssl() ? 'https://' : 'http://' ). $_SERVER['HTTP_HOST']. $_SERVER['REQUEST_URI'], 'form_id' => 'информация для входа', 'label_username' => __('Ваше имя пользователя'), 'label_password' => __('Ваш пароль'), 'label_remember' => __('Запомнить меня'), 'label_log_in' => __('Войти'), 'id_username' => 'user_login', 'id_password' => 'user_password', 'id_remember' => 'запомнить меня', 'id_submit' => 'wp-submit', 'помнить' => правда, 'значение_имя_пользователя' => '', // Установите 'value_remember' в true, чтобы по умолчанию был установлен флажок «Запомнить меня». 'value_remember' => ложь, ); ); ?>
Форма будет отображаться с новыми метками, которые вы добавили в массив, в отличие от меток формы входа в WordPress по умолчанию. В приведенном выше коде я изменил имя пользователя на ваше имя пользователя и пароль на ваш пароль.
После создания шорткода и функции обратного вызова нам нужно их инициализировать, чтобы теперь мы могли использовать шорткод в любом месте записи или страницы WordPress для добавления пользовательской формы входа.
Ниже приведен код, который инициализирует шорткод формы входа:
// Шаг 3: Запустите функцию шорткода add_action('init', 'njengah_add_login_shortcode');
Полный фрагмент кода для создания шорткода формы входа в WordPress
Теперь мы можем объединить все эти фрагменты кода в один фрагмент кода и добавить код в functions.php активной темы WordPress, а затем отобразить форму входа в WordPress с помощью шорткода — [njengah-login-form].
Ниже приведен полный фрагмент кода, который вы должны добавить в файл functions.php, чтобы добавить шорткод формы входа в WordPress:
/** * Создайте пользовательскую форму входа в WordPress без плагина [ Шорткод формы входа в WordPress ] * @author Джо Нженга * @ суть - https://gist.github.com/Njengah/fa96025717308df1b979e77e5da3eef2 */ // Шаг 1: Создайте шорткод функция njengah_add_login_shortcode() { add_shortcode('jay-login-form', 'njengah_login_form_shortcode'); } //Шаг 2: Обратный вызов шорткода функция njengah_login_form_shortcode() { если (is_user_logged_in()) return '<p>Добро пожаловать. Вы вошли в систему!</p>'; ?> <div class="njengah-login-tutorial" > <?php вернуть wp_login_form( множество( 'эхо' => ложь, 'label_username' => __('Ваше имя пользователя'), 'label_password' => __('Ваш пароль'), 'label_remember' => __('Запомнить меня') ) ); ?> </div> <?php } // Шаг 3: Запустите функцию шорткода add_action('init', 'njengah_add_login_shortcode'); //Шаг 4. Используйте шорткод [njengah-login-form] для встраивания формы входа на страницу или в сообщение.
Когда вы добавляете этот код в functions.php, вы должны создать страницу входа и добавить шорткод [njengah-login-form], чтобы опубликовать форму входа. Форма входа должна выглядеть так, как показано на изображении ниже:
Оформление формы входа в WordPress
Я добавил следующие стили, чтобы сделать форму входа привлекательной и использовать дизайн темы, которую я использую:
.njengah-login-tutorial { фон: #6379a4; отступ: 20 пикселей; максимальная ширина: 70%; поле: 0 авто; цвет: #fff; } метка .логин-пароль { поле справа: 120 пикселей; } .логин-имя пользователя { отступ сверху: 30px; }
Создать шаблон пользовательской страницы формы входа
Альтернативный способ создать страницу входа в WordPress без плагина — создать собственный шаблон страницы и использовать функцию wp_login_form() для публикации формы входа на этой странице.
Ниже приведен код для создания пользовательской страницы входа, расположенной в шаблоне пользовательской страницы:
<?php /** * Название шаблона: Страница входа */ получить_заголовок(); если (is_user_logged_in()){ echo '<p>Добро пожаловать. Вы вошли в систему!</p>'; }еще{ wp_login_form( множество( 'эхо' => правда, // Значение «перенаправления» по умолчанию возвращает пользователя к URI запроса. 'перенаправить' => ( is_ssl() ? 'https://' : 'http://' ). $_SERVER['HTTP_HOST']. $_SERVER['REQUEST_URI'], 'form_id' => 'информация для входа', 'label_username' => __('Ваше имя пользователя'), 'label_password' => __('Ваш пароль'), 'label_remember' => __('Запомнить меня'), 'label_log_in' => __('Войти'), 'id_username' => 'user_login', 'id_password' => 'user_password', 'id_remember' => 'запомнить меня', 'id_submit' => 'wp-submit', 'помнить' => правда, 'значение_имя_пользователя' => '', // Установите 'value_remember' в true, чтобы по умолчанию был установлен флажок «Запомнить меня». 'value_remember' => ложь, ) ); } получить_нижний колонтитул();
Сохраните этот код в файле и назовите его login-page.php и убедитесь, что он сохранен в корневой папке вашей темы WordPress.
Создайте новую страницу, и вы увидите, что шаблон входа теперь доступен в опции шаблона атрибутов страницы, как показано ниже:
Выберите шаблон и опубликуйте страницу. Когда вы проверяете внешний интерфейс, вы должны увидеть, что форма входа отображается для пользователей, которые не вошли в систему, и приветственное сообщение отображается для пользователей, которые вошли в систему.
Вывод
В этом посте я описал два способа добавления формы входа на страницу WordPress. Вы можете использовать функцию шорткода, чтобы создать шорткод формы входа в WordPress, или вы можете использовать собственный шаблон страницы, чтобы создать страницу входа в WordPress без плагина. Я надеюсь, что теперь вы можете реализовать один из этих методов для создания пользовательской формы входа в систему на вашем сайте WordPress.
Похожие статьи
- Как создать пагинацию WordPress для пользовательских типов записей
- 30 лучших плагинов безопасности WordPress для защиты вашего сайта
- Как создать страницу в WordPress программно
- Как получить доступ к панели администратора WordPress или войти в панель управления WordPress
- Как создать страницу получения пользовательского заказа WooCommerce
- Как подключить Printful к WooCommerce
- Как обновить расширения WooCommerce
- Как добавить окно поиска в верхнюю часть страницы Storefront Theme
- 40+ лучших плагинов контактной формы WordPress для удобного контакта
- Как удалить категорию без категории в WordPress WooCommerce
- Как удалить боковую панель со страницы WordPress или скрыть боковую панель WordPress
- Как создать пользовательскую разбивку на страницы запросов в WordPress на примере
- WooCommerce против Magento: какая платформа электронной коммерции лучше?
- Как сделать резервную копию базы данных WooCommerce
- Топ 30+ лучших плагинов форм WordPress » Лучший плагин форм WordPress
- Как создать отдельные страницы входа и регистрации в WooCommerce
- 35+ лучших бесплатных плагинов для WordPress
- Как перейти с Shopify на WooCommerce