本文介绍如何使用 WordPress 原生函数 is_user_logged_in() 实现前端菜单项的条件渲染，精准控制通知图标、广告入口等元素在用户登录态下的显隐逻辑，并安全替换登录链接为用户专属操作入口。
本文介绍如何使用 wordpress 原生函数 `is_user_logged_in()` 实现前端菜单项的条件渲染，精准控制通知图标、广告入口等元素在用户登录态下的显隐逻辑，并安全替换登录链接为用户专属操作入口。
在 WordPress 主题开发中，根据用户登录状态动态调整导航栏内容（如隐藏“NEW ADVERT”按钮、显示通知图标、替换登录链接为个人中心入口）是常见需求。仅依赖 CSS 类（如 .not-logged-in { display: none; }）无法真正解决问题——因为 HTML 结构仍被输出到页面，且登录后未移除该类或未插入新内容，导致视觉与逻辑脱节。
正确做法是服务端条件渲染：利用 WordPress 提供的 is_user_logged_in() 函数，在 PHP 层直接控制 HTML 输出逻辑，确保登录态下仅输出对应结构，登出态下完全不输出无关元素。
以下是优化后的完整代码示例，已整合进您的原始结构：
<div class="fusion-secondary-main-menu">
<div class="fusion-row">
<?php avada_main_menu(); ?>
<?php avada_mobile_menu_search(); ?>
<ul id="odp-main-menu-right" class="odp-pl-0">
<!-- 仅当用户已登录时显示通知图标 -->
<?php if ( is_user_logged_in() ) : ?>
<li class="logged-in-only">
<a href="<?php echo esc_url( admin_url('admin.php?page=notifications') ); ?>">
<i class="far fa-bell odp-mr-1"></i>
<span class="notification-badge">0</span>
</a>
</li>
<?php endif; ?>
<!-- 登出时显示登录跳转入口；登录时显示用户操作入口 -->
<li id="upload-ad">
<?php if ( is_user_logged_in() ) : ?>
<!-- 登录后：替换为可点击的 ID 元素（如下拉菜单触发器或个人中心链接） -->
<a href="<?php echo esc_url( wp_logout_url( home_url() ) ); ?>"
class="odp-logout-link"
data-user-id="<?php echo esc_attr( get_current_user_id() ); ?>">
<i class="fas fa-user-circle odp-mr-1"></i>
My Account
</a>
<?php else : ?>
<!-- 登出时：保留登录链接，自动回跳至当前页面 -->
<a href="<?php echo esc_url( wp_login_url( trailingslashit( home_url( $wp->request ) ) ) ); ?>"
style="color: #fff;">
NEW ADVERT
</a>
<?php endif; ?>
</li>
</ul>
</div>
</div>✅ 关键要点说明：
-
避免 CSS 伪装逻辑：
.not-logged-in { display: none; }仅做样式隐藏，无法阻止 DOM 渲染和潜在 SEO/可访问性问题；服务端条件判断更安全、高效、语义清晰。 -
始终校验并转义输出：使用
esc_url()防止 XSS，esc_attr()转义属性值，esc_html()（如需输出文本）保障安全性。 -
登录后行为建议：将
wp_login_url()替换为实际功能入口（如/wp-admin/、自定义投稿页、wp_logout_url()或用户仪表盘），而非仅用空#或未定义 ID。示例中添加了data-user-id属性，便于后续 JS 交互扩展。 -
扩展性提示：如需更复杂逻辑（如角色权限控制），可组合
current_user_can()函数，例如if ( is_user_logged_in() && current_user_can('publish_posts') )。
通过此方案，您不仅能精准实现登录/登出状态下的 UI 切换，还能提升页面性能、安全性与可维护性。
