在WordPress中创建响应式菜单通常涉及以下几个步骤：

1. 注册菜单：首先，你需要在主题的 functions.php 文件中注册一个菜单位置。

2. 使用 wp_nav_menu() 函数：在主题的模板文件中（通常是 header.php），使用 wp_nav_menu() 函数来调用注册的菜单。

3. 添加CSS和JavaScript：为了实现响应式效果，你需要添加适当的CSS和JavaScript。

以下是具体步骤的代码示例：

步骤 1: 注册菜单

在你的 functions.php 文件中添加以下代码来注册一个菜单位置：

function register_my_menu() {
    register_nav_menu('primary-menu',__( 'Primary Menu' ));
}
add_action( 'init', 'register_my_menu' );

步骤 2: 使用 wp_nav_menu() 函数

在你的 header.php 文件中，找到合适的位置，然后添加以下代码来调用菜单：

<?php
wp_nav_menu( array(
    'theme_location' => 'primary-menu',
    'menu_id'        => 'primary-menu',
    'container'      => 'nav',
    'container_id'   => 'primary-nav',
    'fallback_cb'    => 'wp_page_menu',
    'depth'          => 2
) );
?>

步骤 3: 添加CSS和JavaScript

为了使菜单响应式，你可以使用以下CSS和JavaScript代码。将这些代码添加到你的主题的 style.css 和 script.js 文件中，或者直接在相应的模板文件中通过 <style> 和 <script> 标签添加。

CSS (响应式菜单样式)

/* 基本菜单样式 */
#primary-nav {
    /* 样式根据你的需求自定义 */
}

#primary-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#primary-nav li {
    display: inline-block;
    position: relative;
}

/* 响应式菜单样式 */
@media screen and (max-width: 768px) {
    #primary-nav ul {
        display: none;
    }

    #primary-nav li {
        display: block;
    }

    /* 添加汉堡图标 */
    .menu-toggle {
        display: block;
        cursor: pointer;
    }
}

JavaScript (响应式菜单切换)

document.addEventListener('DOMContentLoaded', function () {
    var menuToggle = document.querySelector('.menu-toggle');
    var primaryNav = document.getElementById('primary-nav');

    menuToggle.addEventListener('click', function () {
        primaryNav.classList.toggle('toggled');
    });
});

确保在你的HTML中有一个可以点击的元素（如按钮）来触发菜单的显示和隐藏：

<button class="menu-toggle">Menu</button>

这样，当屏幕尺寸小于768px时，菜单会隐藏，用户可以通过点击汉堡图标来显示或隐藏菜单。

请注意，这只是一个基本的响应式菜单实现。你可能需要根据你的具体需求调整CSS和JavaScript代码。此外，如果你希望使用更高级的响应式菜单，可以考虑使用Bootstrap、Foundation或其他前端框架提供的组件。