Как создать страницу входа в WordPress без использования плагина

Опубликовано: 2022-01-03

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

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

Каждый из этих способов должен без проблем работать с любой темой WordPress или любой средой хостинга WordPress.

Создать страницу входа в WordPress без плагина

Цель этого руководства — помочь вам создать страницу входа, подобную странице входа в WordPress по умолчанию, которая позволит вам получить доступ к панели управления WordPress после входа в систему.

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

  1. Шорткод страницы входа
  2. Пользовательский вход в шаблон страницы

Создать шорткод страницы входа

Первым шагом, когда мы хотим создать страницу входа в любом месте 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 без шаблона страницы входа с плагином

После создания шорткода и функции обратного вызова нам нужно их инициализировать, чтобы теперь мы могли использовать шорткод в любом месте записи или страницы 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 без шаблона страницы входа с плагином

Оформление формы входа в 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 без плагина. Я надеюсь, что теперь вы можете реализовать один из этих методов для создания пользовательской формы входа в систему на вашем сайте WordPress.

Похожие статьи

  1. Как перейти с Shopify на WooCommerce