求助：TI WooCommerce Wishlist为空时隐藏对应菜单项

问题分析 #

你尝试的CSS和PHP代码存在几个关键问题：

• CSS选择器逻辑错误：你写的.wishlist_products_counter_number:empty .nav-menu-primary li.menu-item-142是反向后代选择器，逻辑完全颠倒，还多了个多余的右括号，导致规则无法匹配目标元素。
• PHP代码执行无效：
  • 第一段用$_SESSION['wishlist']无法正确获取TI Wishlist的心愿单数据，插件有专属的API接口，不能直接读取Session。
  • 第二段函数onze_wishlist_has_items没有绑定任何WordPress动作钩子，代码根本不会被执行。

解决方案 #

方法一：CSS（依赖插件计数器结构） #

如果你的心愿单菜单项内嵌了.wishlist_products_counter_number计数器元素，可利用CSS的:has()选择器实现动态隐藏。假设菜单结构如下：

<li class="menu-item-142">
  <a href="#">Wishlist <span class="wishlist_products_counter_number">0</span></a>
</li>

添加以下CSS代码到主题自定义样式区域：

/* 当计数器为空或数值为0时隐藏菜单 */
.nav-menu-primary li.menu-item-142:has(.wishlist_products_counter_number:empty),
.nav-menu-primary li.menu-item-142:has(.wishlist_products_counter_number:contains("0")) {
    display: none;
}

注意：:has()选择器需要现代浏览器支持，若需兼容旧版浏览器，建议使用下面的PHP或JS方案。

方法二：PHP（调用插件官方API） #

在主题的functions.php文件中添加以下代码，通过插件官方方法准确判断心愿单状态：

add_action('wp_head', 'hide_empty_wishlist_menu_item');
function hide_empty_wishlist_menu_item() {
    // 确保TI Wishlist插件已加载
    if (!class_exists('TInvWL_Wishlist')) return;

    // 获取当前用户/访客的心愿单商品数量
    $wishlist_instance = TInvWL_Wishlist::get_instance();
    $items_count = $wishlist_instance->get_items_count();

    // 心愿单为空时输出隐藏样式
    if ($items_count === 0) {
        ?>
        <style>
            .nav-menu-primary li.menu-item-142 {
                display: none !important;
            }
        </style>
        <?php
    }
}

该方案直接调用插件官方接口，数据准确，同时支持登录用户和访客的心愿单判断。

方法三：JavaScript（兼容缓存场景） #

如果PHP方案因页面缓存导致判断失效，可使用JS动态检测计数器状态：

document.addEventListener('DOMContentLoaded', function() {
    const wishlistCounter = document.querySelector('.wishlist_products_counter_number');
    const wishlistMenu = document.querySelector('.nav-menu-primary li.menu-item-142');
    
    if (wishlistCounter && wishlistMenu) {
        const count = parseInt(wishlistCounter.textContent.trim());
        // 计数器为空或数值为0时隐藏菜单
        if (!count || isNaN(count)) {
            wishlistMenu.style.display = 'none';
        }
    }
});

将这段代码添加到主题的自定义JavaScript区域，或通过wp_enqueue_script方式加载。

验证步骤 #

1. 清除WordPress后台缓存和浏览器缓存。
2. 确保心愿单为空，刷新页面检查菜单是否隐藏。
3. 添加商品到心愿单，确认菜单重新显示。

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