如何在不使用插件的情況下在 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_shortcode() {
	
	if (is_user_logged_in())
		
	返回'<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 = 數組（））

$args 可以是控製表單顯示方式的選項數組。

以下是您可以在數組中使用的參數來更改表單的顯示方式。

例如，您可以設置參數數組並將其傳遞給此函數，如下所示：

 <?php 

wp_login_form( 

	 大批（
			'迴聲' => 真的，
			// 默認“重定向”值將用戶帶回請求 URI。
			'重定向' => ( is_ssl() ? 'https://' : 'http://' ) 。 $_SERVER['HTTP_HOST'] 。 $_SERVER['REQUEST_URI'],
			'form_id' => 'loginform',
			'label_username' => __('你的用戶名'),
			'label_password' => __( '你的密碼' ),
			'label_remember' => __('記住我'),
			'label_log_in' => __( '登錄' ),
			'id_username' => 'user_login',
			'id_password' => 'user_pass',
			'id_remember' => 'rememberme',
			'id_submit' => 'wp-submit',
			'記住' => 真的，
			'value_username' => '',
			// 將 'value_remember' 設置為 true 以默認選中“記住我”複選框。
			'value_remember' => 假，
		);
		
); ?>

表單將顯示您添加到數組中的新標籤，而不是默認的 WordPress 登錄表單標籤。 在上面的代碼中，我將用戶名更改為您的用戶名，將密碼更改為您的密碼。

創建短代碼和回調函數後，我們需要對其進行初始化，以便我們現在可以在 WordPress 帖子或頁面的任何位置使用短代碼來添加自定義登錄表單。

以下是將初始化登錄表單短代碼的代碼：

 // 第三步：初始化簡碼函數

add_action('init', 'njengah_add_login_shortcode');

在 WordPress 中創建登錄表單簡碼的完整代碼片段

現在我們可以將所有這些代碼片段放在一個代碼片段中，並將代碼添加到活動 WordPress 主題的 functions.php 中，然後使用簡碼 - [njengah-login-form] 顯示 WordPress 登錄表單。

以下是您應該添加到 functions.php 文件以添加 WordPress 登錄表單短代碼的完整代碼片段：

 /**
 * 創建沒有插件的自定義 WordPress 登錄表單 [WordPress 登錄表單簡碼] 
 * @作者喬恩傑加 
 * @ gist - https://gist.github.com/Njengah/fa96025717308df1b979e77e5da3eef2
 */ 


// 第 1 步：創建簡碼
功能 njengah_add_login_shortcode() {
	add_shortcode('jay-login-form', 'njengah_login_form_shortcode');
}

//第二步：短代碼回調
功能 njengah_login_form_shortcode() {
	
	if (is_user_logged_in())
		
		返回'<p>歡迎。 您已登錄！</p>'; ?> 
		
		<div class ="njengah-login-tutorial" >  
		
			<?php 返回 wp_login_form( 
							大批（ 
								'迴聲' => 假，
								'label_username' => __('你的用戶名'),
								'label_password' => __( '你的密碼' ),
								'label_remember' => __('記住我')
			              )
			); ?> 
		
		</div>
  <?php 
   }

// 第三步：初始化簡碼函數
add_action('init', 'njengah_add_login_shortcode');

//第 4 步：使用簡碼 [njengah-login-form] 將登錄表單嵌入頁面或帖子 

當您將此代碼​​添加到 functions.php 時，您應該創建一個登錄頁面並添加短代碼 [njengah-login-form] 以發布登錄表單。 登錄表單應如下圖所示：

WordPress登錄表單樣式

我添加了以下樣式以使登錄表單具有吸引力並採用我正在使用的主題的設計：

 .njengah-登錄教程 {
    背景：#6379a4；
    填充：20px；
    最大寬度：70%；
    邊距：0 自動；
    顏色：#fff;
}

.登錄密碼標籤{
    右邊距：120px；
}

.登錄用戶名 {
    填充頂部：30px；
}

創建登錄表單自定義頁面模板

在沒有插件的情況下在 WordPress 中創建登錄頁面的另一種方法是創建自定義頁面模板並使用 wp_login_form() 函數在該頁面上發布登錄表單。

以下是用於創建位於自定義頁面模板中的自定義登錄頁面的代碼：

 <?php
/**
 * 模板名稱：登錄頁面 
 */
 
 get_header(); 
 
 
 if (is_user_logged_in()){
	 
	     迴聲'<p>歡迎。 您已登錄！</p>'; 
		 
 }別的{ 
	 
	 wp_login_form( 

		 大批（
				'迴聲' => 真的，
				// 默認“重定向”值將用戶帶回請求 URI。
				'重定向' => ( is_ssl() ? 'https://' : 'http://' ) 。 $_SERVER['HTTP_HOST'] 。 $_SERVER['REQUEST_URI'],
				'form_id' => 'loginform',
				'label_username' => __('你的用戶名'),
				'label_password' => __( '你的密碼' ),
				'label_remember' => __('記住我'),
				'label_log_in' => __( '登錄' ),
				'id_username' => 'user_login',
				'id_password' => 'user_pass',
				'id_remember' => 'rememberme',
				'id_submit' => 'wp-submit',
				'記住' => 真的，
				'value_username' => '',
				// 將 'value_remember' 設置為 true 以默認選中“記住我”複選框。
				'value_remember' => 假，
			)
						
		);
    }			
	
get_footer();		
				

將此代碼保存在一個文件中並將其命名為 login-page.php 並確保它保存在 WordPress 主題的根文件夾中。

創建一個新頁面，您將看到登錄模板現在在頁面屬性模板選項上可用，如下所示：

選擇模板並發布頁面。 當您檢查前端時，您應該看到為未登錄的用戶顯示登錄表單，並為已登錄的用戶顯示歡迎消息。

結論

在這篇文章中，我概述了在 WordPress 頁面中添加登錄表單的兩種方法。 您可以使用簡碼功能創建 WordPress 登錄表單簡碼，也可以使用自定義頁面模板在 WordPress 中創建登錄頁面，無需插件。 我希望您現在可以實施其中一種方法來在您的 WordPress 網站上創建自定義前端登錄表單。

類似文章

1. 如何為自定義帖子類型創建 WordPress 分頁
2. 保護您的網站的 30 個最佳 WordPress 安全插件
3. 如何以編程方式在 WordPress 中創建頁面
4. 如何訪問 WordPress 管理儀表板或登錄到您的 WordPress 儀表板
5. 如何創建自定義訂單接收頁面 WooCommerce
6. 如何將 Printful 連接到 WooCommerce
7. 如何更新 WooCommerce 擴展
8. 如何在頁麵店面主題頂部添加搜索框
9. 40 多個用於輕鬆聯繫的最佳 WordPress 聯繫表單插件
10. 如何在 WordPress WooCommerce 中刪除未分類的類別
11. 如何從 WordPress 頁面中刪除側邊欄或隱藏 WordPress 側邊欄
12. 如何通過示例在 WordPress 中創建自定義查詢分頁
13. WooCommerce vs Magento：哪個是最好的電子商務平台？
14. 如何備份 WooCommerce 數據庫
15. 前 30 多個最佳 WordPress 表單插件 » 最佳 WordPress 表單插件
16. 如何在 WooCommerce 中創建單獨的登錄和註冊頁面
17. 35+ 最佳自由形式插件 WordPress
18. 如何從 Shopify 遷移到 WooCommerce