WooCommerce：将端点分配给我的帐户页面中的自定义模板

Posted 2023-02-18

【中文标题】WooCommerce：将端点分配给我的帐户页面中的自定义模板

【英文标题】：WooCommerce: Assigning an endpoint to a custom template in my account pages

【发布时间】：2016-10-28 14:54:09

【问题描述】：

此功能在“我的帐户”标签列表中添加一个名为“特殊页面”的标签：

add_filter( 'woocommerce_account_menu_items' , 'jc_menu_panel_nav' );

function jc_menu_panel_nav() 
    $items = array(
        'dashboard'       => __( 'Dashboard', 'woocommerce' ),
        'orders'          => __( 'Orders', 'woocommerce' ),
        'downloads'       => __( 'Downloads', 'woocommerce' ),
        'edit-address'    => __( 'Addresses', 'woocommerce' ),
        'payment-methods' => __( 'Payment Methods', 'woocommerce' ),
        'edit-account'    => __( 'Account Details', 'woocommerce' ),
        'special-page' => __( 'Special Page', 'woocommerce' ), // My custom tab here
        'customer-logout' => __( 'Logout', 'woocommerce' ),
    );

    return $items;

结果如下：

但是链接指向my-account/special-page/，自然会报404错误。

如何将此 URL 分配给名为 special-page.php 的文件？

【问题讨论】：

“special-page.php”是位于您的活动主题 > woocommerce > my-account 文件夹中的自定义 woocommerce 模板页面吗？

是的，完全正确:)

【参考方案1】：

最后我可以使用 sn-p provided for the same people of WooCommerce 解决问题（该页面中有更多提示）。有兴趣的朋友，把以下代码粘贴到functions.php中：

function my_custom_endpoints() 
    add_rewrite_endpoint( 'special-page', EP_ROOT | EP_PAGES );


add_action( 'init', 'my_custom_endpoints' );

function my_custom_query_vars( $vars ) 
    $vars[] = 'special-page';

    return $vars;


add_filter( 'query_vars', 'my_custom_query_vars', 0 );

function my_custom_flush_rewrite_rules() 
    flush_rewrite_rules();


add_action( 'wp_loaded', 'my_custom_flush_rewrite_rules' );

我认为这种方式可以更好地控制菜单的排序/重命名：

function my_custom_my_account_menu_items( $items ) 
    $items = array(
        'dashboard'         => __( 'Dashboard', 'woocommerce' ),
        'orders'            => __( 'Orders', 'woocommerce' ),
        //'downloads'       => __( 'Downloads', 'woocommerce' ),
        //'edit-address'    => __( 'Addresses', 'woocommerce' ),
        //'payment-methods' => __( 'Payment Methods', 'woocommerce' ),
        'edit-account'      => __( 'Edit Account', 'woocommerce' ),
        'special-page'      => 'Special Page',
        'customer-logout'   => __( 'Logout', 'woocommerce' ),
    );

    return $items;


add_filter( 'woocommerce_account_menu_items', 'my_custom_my_account_menu_items' );

在下面的函数中，我包含了文件以维护一些“顺序”，但它也允许直接代码。

请务必将special-page.php 文件放在myaccount 文件夹中。

function my_custom_endpoint_content() 
    include 'woocommerce/myaccount/special-page.php'; 


add_action( 'woocommerce_account_special-page_endpoint', 'my_custom_endpoint_content' );

重要提示：完成此操作后，转到仪表板 > 设置 > 永久链接并单击“保存设置”以刷新重写规则（感谢 @optimiertes）

来源：Tabbed My Account page

【讨论】：

仅在本地主机中工作，现在正在在线测试，客户强迫我今天让它工作！

感谢您的解决方案。提示：例如，将“after_switch_theme”挂钩更改为任何其他标题挂钩“wp_loaded”。它可以在不切换主题的情况下工作。

转到仪表板>设置>永久链接并单击“保存设置”可能更容易刷新重写规则。

【参考方案2】：

在 woocommerce 2.6+ 中，第一个 my-account/special-page/ 应该是 myaccount/special-page/。

此解决方案不完整，我仍在努力……

你可以先使用这个钩子：

add_action( 'init', 'add_wc_endpoint' );
function add_wc_endpoint()
    add_rewrite_endpoint( 'special-page', EP_ROOT | EP_PAGES );

然后过滤wc_get_template以在请求与您的端点匹配时调用您的文件：

add_filter( 'wc_get_template', 'custom_vc_endpoint', 10, 5 );
function custom_vc_endpoint($located, $template_name, $args, $template_path, $default_path)

    if( $template_name == 'myaccount/special-page.php' )
        global $wp_query;
        if(isset($wp_query->query['special-page']))
            $located = get_template_directory() . '/woocommerce/myaccount/special-page.php';
        
    

    return $located;

如果您使用子主题，请将 get_template_directory() 替换为 get_stylesheet_directory()... 将此代码粘贴到活动子主题或主题的 function.php 文件中。

为避免 404 错误“找不到页面”，您需要刷新添加到代码中的重写规则：

flush_rewrite_rules();

---

更新：终于Dario（OP）找到了一个可行的解决方案。 Look at his answer.

参考资料：

Tabbed My Account page (Official Woocommerce 2.6+): Creating new endpoints How to add a new endpoint in woocommerce (old and incomplete)

【讨论】：

嗨。我在上面的解决方案中做了同样的事情，但是我得到了一个找不到页面的 404 错误。 wordpress 4 有什么需要更新的吗？

从永久链接页面刷新重写规则没有帮助。虽然添加了 flush_rewrite_rules();在代码中成功了。谢谢你的建议

@AkashAgrawal 好的，我已在此答案的末尾添加了此内容。谢谢

这是一个我的帐户端点，我的帐户选项卡/页面和其他选项卡以及它是安全的。用户必须登录才能访问这些页面，是否有任何程序可以在不登录的情况下访问我的自定义端点？

@AkashAgrawal 由于此端点是选项卡式我的帐户菜单的一部分，因此您将无法在没有登录的情况下访问它们，而且我真的不知道是否可以按照您的要求进行操作......应该最好在您网站的其他可访问部分（您将为未登录的用户显示）中制作相关的“我的帐户”标签的可访问克隆……

【参考方案3】：

有一种更好的方法可以在 woocommerce 的自定义页面中使用模板：

function my_custom_endpoint_content() 
    wc_get_template( 'myaccount/special-page.php' ); 


add_action( 'woocommerce_account_special-page_endpoint', 'my_custom_endpoint_content' );

这应该可以在不使用 wc_get_template 过滤器的情况下工作。

【参考方案4】：

您可以将此代码添加到主题的function.php中：

class My_Custom_My_Account_Endpoint 
/**
 * Custom endpoint name.
 *
 * @var string
 */
public static $endpoint = 'special-page';
/**
 * Plugin actions.
 */
public function __construct() 
    // Actions used to insert a new endpoint in the WordPress.
    add_action( 'init', array( $this, 'add_endpoints' ) );
    add_filter( 'query_vars', array( $this, 'add_query_vars' ), 0 );
    // Change the My Accout page title.
    add_filter( 'the_title', array( $this, 'endpoint_title' ) );
    // Insering your new tab/page into the My Account page.
    add_filter( 'woocommerce_account_menu_items', array( $this, 'new_menu_items' ) );
    add_action( 'woocommerce_account_' . self::$endpoint .  '_endpoint', array( $this, 'endpoint_content' ) );

/**
 * Register new endpoint to use inside My Account page.
 *
 * @see https://developer.wordpress.org/reference/functions/add_rewrite_endpoint/
 */
public function add_endpoints() 
    add_rewrite_endpoint( self::$endpoint, EP_ROOT | EP_PAGES );

/**
 * Add new query var.
 *
 * @param array $vars
 * @return array
 */
public function add_query_vars( $vars ) 
    $vars[] = self::$endpoint;
    return $vars;

/**
 * Set endpoint title.
 *
 * @param string $title
 * @return string
 */
public function endpoint_title( $title ) 
    global $wp_query;
    $is_endpoint = isset( $wp_query->query_vars[ self::$endpoint ] );
    if ( $is_endpoint && ! is_admin() && is_main_query() && in_the_loop() && is_account_page() ) 
        // New page title.
        $title = __( 'Special Page', 'woocommerce' );
        remove_filter( 'the_title', array( $this, 'endpoint_title' ) );
    
    return $title;

/**
 * Insert the new endpoint into the My Account menu.
 *
 * @param array $items
 * @return array
 */
public function new_menu_items( $items ) 
    // Remove the logout menu item.
    $logout = $items['customer-logout'];
    unset( $items['customer-logout'] );
    // Insert your custom endpoint.
    $items[ self::$endpoint ] = __( 'Special Page', 'woocommerce' );
    // Insert back the logout item.
    $items['customer-logout'] = $logout;
    return $items;

/**
 * Endpoint html content.
 */
public function endpoint_content() 
    include('woocommerce/myaccount/special-page.php');

/**
 * Plugin install action.
 * Flush rewrite rules to make our custom endpoint available.
 */
public static function install() 
    flush_rewrite_rules();


new My_Custom_My_Account_Endpoint();
// Flush rewrite rules on plugin activation.
register_activation_hook( __FILE__, array( 'My_Custom_My_Account_Endpoint', 'install' ) );

如果你不知道你的主题的function.php在哪里：

1.登录 WordPress 管理界面 2.在左侧边栏中，将鼠标悬停在外观上，然后单击主题编辑器 3.在右侧边栏中，点击functions.php

【讨论】：

这可能是很好的代码，但不是很好的答案。一些额外的解释可能是有用的。更重要的是：建议​​通过主题编辑器更改主题的 functions.php 只是一个糟糕的做法，尤其是没有提到主题更改应该始终在子主题中进行。

这个答案代码大部分是从WooCommerce "Tabbed “My Account” pages in 2.6"官方文档中复制而来的，作者是克劳迪奥·桑切斯（WooCommerce官方开发者）……它已经链接在the OP answer