WordPress如何实现类似Vue Router的动态页面URL跳转

你之前的写法存在两个典型的实现问题：

• 用get_theme_file_uri('login.php')生成跳转地址逻辑错误：这个函数返回的是主题目录下的文件物理路径，不是前台用户可访问的Web路由，自然无法正常跳转
• 硬写/login这类固定slug的可维护性极差：不仅会因为管理员修改页面slug失效，如果站点安装在子目录、或者调整了固定链接结构，链接也会直接报错

方案1：适配后台可配置场景（可维护主题优先选用） #

如果你已经在WordPress后台创建了专门的登录页面，绑定自定义登录模板，完全不需要硬编码页面slug：

• 只需要把这个登录页的ID存入主题固定配置项（可以在主题激活时自动存储，也可以在主题设置页提供选项让管理员手动选择对应的登录页）
• 生成跳转链接时，直接用WordPress内置的get_permalink()函数传入存储好的页面ID即可

示例代码：

<?php
// 从WP选项中读取预先存好的登录页ID
$login_page_id = get_option('custom_login_page_id');
?>
<!-- 生成的链接自动适配最新slug、站点安装路径 -->
<a href="<?php echo esc_url(get_permalink($login_page_id)); ?>">Login</a>

这种实现方式和Vue中通过路由名称跳转的逻辑完全对齐：路由的映射关系是固定存储的，不管对应的页面slug怎么变化，生成的链接永远指向正确的登录页，完全不需要手动修改代码。

方案2：纯自定义独立路由（完全不依赖后台页面设置） #

如果你不需要后台额外配置，想完全自主控制登录页的路由规则，直接用WordPress内置的重写规则注册自定义命名路由即可，这是最贴近Vue路由机制的实现方式：

• 在主题的functions.php中用add_rewrite_rule注册固定的路由别名，绑定对应的登录模板
• 生成链接时通过home_url()自动适配站点的安装路径、固定链接结构，完全不需要硬写路径

示例路由注册代码：

// 注册自定义登录路由
add_action('init', function() {
    add_rewrite_rule(
        '^custom-login/?$',
        'index.php?custom_login_flag=1',
        'top'
    );
});

// 将自定义路由加入允许的查询变量列表
add_filter('query_vars', function($vars) {
    $vars[] = 'custom_login_flag';
    return $vars;
});

// 路由匹配成功时加载对应的登录模板
add_action('template_include', function($template) {
    if (get_query_var('custom_login_flag')) {
        // 指向项目中自定义的登录模板文件
        return locate_template('templates/login.php');
    }
    return $template;
});

生成跳转链接的代码：

<a href="<?php echo esc_url(home_url('/custom-login')); ?>">Login</a>

这种方式的稳定性最高：路由规则由代码掌控，管理员在后台无法随意修改路由路径，就算站点更换域名、调整安装路径、修改固定链接结构，生成的链接都会自动适配，完全不会出现跳转失效的问题。

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