要在 WordPress 首页的顶部菜单或目录上实现 hover 显示二级菜单的效果，您可以按照以下步骤进行操作：

创建 WordPress 自定义菜单：
在 WordPress 后台的外观 -> 菜单中创建一个自定义菜单。
添加您的一级菜单项和对应的二级菜单项。
使用拖放功能将二级菜单项缩进到对应的一级菜单项下，以表示它们是二级菜单。

添加自定义 CSS 样式：
使用自定义 CSS 样式来隐藏二级菜单项，例如：

.sub-menu {
    display: none;
}

编写 JavaScript 代码：
编写 JavaScript 代码，以在一级菜单项 hover 时显示对应的二级菜单项。您可以使用 jQuery 来简化操作。

jQuery(document).ready(function($) {
    $('.menu-item-has-children').hover(function() {
        $(this).find('.sub-menu').stop(true, true).slideDown('fast');
    }, function() {
        $(this).find('.sub-menu').stop(true, true).slideUp('fast');
    });
});

将 JavaScript 代码添加到 WordPress 主题中：
将上述 JavaScript 代码添加到您的 WordPress 主题的 JavaScript 文件中，或者直接添加到页面模板的 < script > 标签中。

保存并预览：
保存您对主题文件的更改，并在前台预览您的网站，看看是否成功实现了 hover 显示二级菜单的效果。

通过以上步骤，您可以在 WordPress 首页的顶部菜单或目录上实现 hover 显示二级菜单的效果。