如何通过wordpress中的短代码动态标签？

Question

我的标记在这里 -

 <section class="recentnews">
      <h4 class="sidebarheader">Recent News</h4>
      <ul class="tabs">
        <li><a class="active" href="#trends">Trends</a></li>
        <li><a class="" href="#fashion">Fashion</a></li>
        <li><a class="" href="#shows">Shows</a></li>
      </ul>
      <ul class="tabs-content">
        <li class="active" id="trends">
          <p>Lorem ipsum dolor sit amet, proscriptum videt ulteriori. Filiam sunt amore nec est cum autem est se in. Cellam sanctissima coniunx in lucem exempli paupers coniunx rex cum autem quod ait regem Ardalio. Filiam sunt amore nec est cum autem est se in.Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam,feugiat vitae, ultricies eget, tempor sit amet, ante.</p>
        </li>
        <li id="fashion">
          <p>Lorem ipsum dolor sit amet, proscriptum videt ulteriori. Filiam sunt amore nec est cum autem est se in. Cellam sanctissima coniunx in lucem exempli paupers coniunx rex cum autem quod ait regem Ardalio. Filiam sunt amore nec est cum autem est se in.Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p>
        </li>
        <li id="shows">
          <p>Lorem ipsum dolor sit amet, proscriptum videt ulteriori. Filiam sunt amore nec est cum autem est se in. Cellam sanctissima coniunx in lucem exempli paupers coniunx rex cum autem quod ait regem Ardalio. Filiam sunt amore nec est cum autem est se in.Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam,feugiat vitae, ultricies eget, tempor sit amet, ante.</p>
        </li>
      </ul>
    </section>

和活动标签js -

/**
 * Skeleton V1.1
 * Copyright 2011, Dave Gamache
 * www.getskeleton.com
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 8/17/2011
 */

(function ($) {
  // hash change handler
  function hashchange () {
    var hash = window.location.hash
      , el = $('ul.tabs [href*="' + hash + '"]')
      , content = $(hash)

    if (el.length && !el.hasClass('active') && content.length) {
      el.closest('.tabs').find('.active').removeClass('active');
      el.addClass('active');
      content.show().addClass('active').siblings().hide().removeClass('active');
    }
  }

  // listen on event and fire right away
  $(window).on('hashchange.skeleton', hashchange);
  hashchange();
  $(hashchange);
})(jQuery);

那么如何通过postpress查询wordpress中的短代码动态标签？

我想使用类似代码的东西 -

    function tab_shortcode($atts){
            extract( shortcode_atts( array(
                    'category' => '',
            ), $atts, 'tabid' ) );

        $q = new WP_Query(
            array('posts_per_page' => '10', 'post_type' => 'tab', 'tab_category' => $category, 'orderby' => 'meta_value','order' => 'ASC')
            );            

            $list = '
           <script type="text/javascript">
           jQuery(function() {
           jQuery(".tabnav ul li:first-child")
                   .addClass("active")
           });
           </script>
           //Start HTML code and query  
           <div style="width:100% !important;overflow: hidden;">
           <div class="col-12">
                   <div class="tabs vertical row">
                           <nav class="tabnav nav col-27">
                                   <ul>
           ';

            while($q->have_posts()) : $q->the_post();
                    $idd = get_the_ID();
                    $list .= '
                           <li><a href="#">'.get_the_title().'</a></li>
                   ';        
            endwhile;
            $list.= '
                                   </ul>
                           </nav>
           ';


            while($q->have_posts()) : $q->the_post();
                    $idd = get_the_ID();
                    $list .= '
                           <div class="tab col-9">
                                   '.get_the_content().'
                           </div>
                   ';        
            endwhile;
            $list.= '
                   </div>
           </div>
           </div>
           ';
            wp_reset_query();
            return $list;
    }
    add_shortcode('tab', 'tab_shortcode');

我想在三个标签中显示任何类别中最近的3篇帖子。

Html模板http://www.anariel.com/freebix/。

任何人都可以帮助我吗？