WordPress+WooCommerce站点登录后切换头部注册/账户按钮咨询

你使用的[xoo_el_action]短代码本身会输出完整的<a>标签结构（包含链接地址、文本、点击属性等全部内容），并不是单纯返回跳转链接。你将短代码输出内容放到<a>标签的href属性中，相当于把整段HTML代码塞进了链接地址字段，最终生成了畸形的跳转URL，就是你遇到的异常跳转问题。

不需要自己手动套<a>标签，直接输出短代码即可：

<div class="btn-cta">                                      
    <?php echo do_shortcode('[xoo_el_action type="register" change_to="logout"]'); ?>
</div>

该代码会自动生成符合要求的按钮，登录状态切换、跳转逻辑都会由插件自动处理。

可以直接用WordPress + WooCommerce原生函数实现需求，完全不需要第三方登录插件，代码如下：

<div class="btn-cta">                                      
    <?php if ( is_user_logged_in() ) : ?>
        <!-- 已登录状态显示账户按钮，跳转到WooCommerce账户页 -->
        <a href="<?php echo esc_url( get_permalink( wc_get_page_id( 'myaccount' ) ) ); ?>">账户</a>
        <!-- 如需单独显示退出按钮，可取消注释下方代码 -->
        <!-- <a href="<?php echo esc_url( wp_logout_url( get_permalink( wc_get_page_id( 'myaccount' ) ) ) ); ?>">退出</a> -->
    <?php else : ?>
        <!-- 未登录状态显示注册按钮，跳转到账户页的注册/登录区域 -->
        <a href="<?php echo esc_url( get_permalink( wc_get_page_id( 'myaccount' ) ) ); ?>">注册</a>
    <?php endif; ?>
</div>

使用该方案只需要提前在WooCommerce设置中开放普通用户注册权限即可，WooCommerce默认的账户页面已经自带完整的注册、登录、账户信息管理功能。如果你不需要使用WooCommerce，也可以替换为WordPress原生的wp_login_url()、wp_registration_url()函数实现同样效果。

• 输出跳转链接时建议用esc_url()函数包裹，可避免XSS安全漏洞，同时保证链接格式合法
• 要自定义按钮样式的话，直接针对.btn-cta下的<a>标签写CSS规则即可
• 若需要保留弹窗登录注册效果，自己写简单的JS模态框逻辑就能实现，不需要依赖第三方插件

内容的提问来源于stack exchange，提问作者Kieran Spencer