如何利用WP原生链接功能实现轻量化导航站页面？

<?php
/**
 * Template Name: 导航站模板-mvp版本
 */
get_header();
?>
<div class="cb-nav-container">
    <!-- 搜索区域 -->
    <div class="cb-nav-search-wrap">
        <input type="search" 
               class="cb-nav-search-field" 
               placeholder="搜索资源..." 
               id="cb-nav-search-input"/>
    </div>

    <!-- 主体布局 -->
    <div class="cb-nav-main-container">
        <!-- 左侧分类菜单 -->
        <div class="cb-nav-sidebar">
            <div class="cb-nav-category-item cb-nav-active" data-category="all">
                <a>全部资源</a>
            </div>
            <?php
            $categories = get_terms([
                'taxonomy' => 'link_category',
                'hide_empty' => false
            ]);
            
            foreach ($categories as $category) : ?>
                <div class="cb-nav-category-item" data-category="<?php echo $category->term_id; ?>">
                    <a><?php echo esc_html($category->name); ?></a>
                </div>
            <?php endforeach; ?>
        </div>

        <!-- 右侧链接内容 -->
        <div class="cb-nav-content">
            <div class="cb-nav-link-section cb-nav-active" id="section-all">
                <?php 
                $all_links = get_bookmarks();
                foreach ($all_links as $link) : ?>
                    <div class="cb-nav-link-card">
                        <a href="<?php echo esc_url($link->link_url); ?>" target="_blank">
                            <?php echo esc_html($link->link_name); ?>
                        </a>
                        <?php if ($link->link_description) : ?>
                            <p><?php echo esc_html($link->link_description); ?></p>
                        <?php endif; ?>
                    </div>
                <?php endforeach; ?>
            </div>
            
            <?php foreach ($categories as $category) :
                $category_links = get_bookmarks(['category' => $category->term_id]);
                if ($category_links) : ?>
                    <div class="cb-nav-link-section" id="section-<?php echo $category->term_id; ?>">
                        <?php foreach ($category_links as $link) : ?>
                            <div class="cb-nav-link-card">
                                <a href="<?php echo esc_url($link->link_url); ?>" target="_blank">
                                    <?php echo esc_html($link->link_name); ?>
                                </a>
                                <?php if ($link->link_description) : ?>
                                    <p><?php echo esc_html($link->link_description); ?></p>
                                <?php endif; ?>
                            </div>
                        <?php endforeach; ?>
                    </div>
                <?php endif;
            endforeach; ?>
        </div>
    </div>
</div>

<script>
jQuery(function($) {
    // 分类切换功能
    $('.cb-nav-category-item').click(function() {
        $('.cb-nav-category-item').removeClass('cb-nav-active');
        $(this).addClass('cb-nav-active');
        
        $('.cb-nav-link-section').removeClass('cb-nav-active');
        $('#section-' + $(this).data('category')).addClass('cb-nav-active');
    });
    
    // 搜索功能
    $('#cb-nav-search-input').on('keyup', function() {
        var searchTerm = $(this).val().toLowerCase();
        var $currentSection = $('.cb-nav-link-section.cb-nav-active');
        
        $currentSection.find('.cb-nav-link-card').each(function() {
            var text = $(this).text().toLowerCase();
            $(this).toggle(text.indexOf(searchTerm) > -1);
        });
    });
});
</script>

<?php get_footer(); ?>