从 WooCommerce v2.6.0 起,WooCommerce 的 “我的帐户” 区域已经使用了所谓的 “端点” 。这意味着 WordPress 中只有 1 页设置(像 “/ my-account”),其中的子页面是动态加载的(如 “/ my-account / orders”)。这是 WooCommerce 实施的一个好方法,因为这意味着您不需要在 WordPress 管理员中管理多达几页; 基于 “端点”(在我们的示例中为 “订单”)动态地加载该页面的内容。
这样做会增加一个新的子页面到我的帐户区域有点复杂,但这绝对是可能的!看看它是如何做的
注意:我将在标准函数中编写这个函数,您可以将其添加到主题的 functions.php
文件中,但我建议您创建一个功能插件,并在类中执行。
添加一个 “信息” 链接到我的帐户导航
首先,我们添加一个信息链接到我的帐户导航。
/**
* Account menu items
*
* @param arr $items
* @return arr
*/
function iconic_account_menu_items( $items ) {
$items[‘information’] = __( ‘Information’, ‘iconic’ );
return $items;
}
add_filter( ‘woocommerce_account_menu_items’, ‘iconic_account_menu_items’, 10, 1 );
|
- 的
woocommerce_account_menu_items
过滤器接受 1 个参数:的导航项目阵列。 - 在
iconic_account_menu_item()
我们将 “信息” 链接添加到$items
数组的末尾。我们正在使用键/值对; 数组键是端点 URI(“信息”),该值是链接标题(“信息”)的可翻译字符串。
添加一个 “我的帐户” 端点
在这个例子中,我们将添加一个名为 “Information” 的新页面 my-account/information
。这意味着我们的终端是简单的 information
,按照我们上面的自定义菜单链接。
/**
* Add endpoint
*/
function iconic_add_my_account_endpoint() {
add_rewrite_endpoint( ‘information’, EP_PAGES );
}
add_action( ‘init’, ‘iconic_add_my_account_endpoint’ );
|
- 我们正在添加一个
iconic_add_my_account_endpoint
在该init
动作上调用的函数。 - 我们正在使用
add_rewrite_endpoint()
来添加我们的端点。这将需要您刷新固定链接(只需访问设置 > 固定链接)。 add_rewrite_endpoint()
接受 2 个参数。第一个是我们的端点 URI,第二个是端点可用的位置。作为 “我的帐户” 是一个页面,我们已经分配了我们的端点EP_PAGES
。您可以查看所有可用的 “邻居” 的手抄本。
添加完毕后,/my-account/information
网址应返回常规帐户信息中心,而不是 404 页面。
向我们的新端点添加内容
而不是使用自定义模板,我认为最好使用可用的钩子。这样我们可以保留默认帐户布局,包括边栏导航。 WooCommerce 为您的端点提供一个自定义钩子,可以这样访问:
/**
* Information content
*/
function iconic_information_endpoint_content() {
echo ‘Your new content’;
}
add_action( ‘woocommerce_account_information_endpoint’, ‘iconic_information_endpoint_content’ );
|
我们正在使用该 woocommerce_account_information_endpoint
动作。这是一个自定义操作,您可以通过格式化它创建的任何端点使用 woocommerce_account_{your-endpoint-slug}_endpoint
。
添加一个 “端点?” 帮手
我们可以添加一个帮助函数来检查当前查看的页面是否是一个端点。我看不到 WordPress 中的任何本机功能(如果我错了,请更正我),所以我为此写了这个简单的功能。
|
/**
* Helper: is endpoint
*/
function iconic_is_endpoint( $endpoint = false ) {
global $wp_query;
if( !$wp_query )
return false;
return isset( $wp_query->query[ $endpoint ] );
}
|
所以现在我们可以 if( iconic_is_endpoint('information') ) { ... }
用来检查当前页面是否是我们的端点。注意:您可以将任何端点传递到函数中。
结论
这应该让您开始!显然有几行代码添加,但是一旦您完成了,修改和演变就相当直接。如果您在 WooCommerce 网站上使用本教程,请告诉我们。我有兴趣知道您添加了哪些标签。