jQuery 탭 단축 코드 만들기

Question

WordPress 용 jQuery 탭 단축 코드를 만들려고합니다.이 코드는 내 functions.php에서 내 코드이므로 탭이 표시되지만 변경되지 않습니다. 내가 가진

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 

을 그리고 내 페이지 :

add_shortcode('tabs', 'tabs_group'); 
add_shortcode('tab', 'tab'); 

// this variable will hold your divs 
$tabs_divs = ''; 

function tabs_group($atts, $content = null) { 
    global $tabs_divs; 

    // reset divs 
    $tabs_divs = ''; 

    extract(shortcode_atts(array( 
     'id' => '', 
     'class' => '' 
    ), $atts)); 

    $output = '<ul class="nav nav-tabs '.$class.'" '; 

    if(!empty($id)) 
     $output .= 'id="'.$id.'"'; 

    $output.='>'.do_shortcode($content).'</ul>'; 
    $output.= '<div class="tab-content">'.$tabs_divs.'</div>'; 

    return $output; 
} 


function tab($atts, $content = null) { 
    global $tabs_divs; 

    extract(shortcode_atts(array( 
     'id' => '', 
     'title' => '', 
     'active'=>'n' 
    ), $atts)); 

    if(empty($id)) 
     $id = 'tab_item_'.rand(100,999); 

    $activeClass = $active == 'y' ? 'active' :''; 
    $output = ' 
     <li class="'.$activeClass.'"> 
      <a href="#'.$id.'">'.$title.'</a> 
     </li> 
    '; 

    $tabs_divs.= '<div class="tab-pane '.$activeClass.'" id="'.$id.'">'.$content.'</div>'; 

    return $output; 
} 

다음은 뭐죠 내 헤더입니다

[tabs] 
[tab title="tab" active="y" id="home"]home[/tab] 
[tab title="tab2" active="n" id="about"]about[/tab] 
[tab title="tab3" active="n" id="help"]help[/tab] 
[/tabs] 

편집!

function tabs_header() { 

//wp_enqueue_script('jquery'); 

wp_register_script('add-jquery-js', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', array('jquery'),'',true ); 
wp_register_script('add-jqueryui-js', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js', array('jquery'),'',true ); 


wp_enqueue_style('add-jquery-js'); 
wp_enqueue_style('add-jqueryui-js'); 

} 
add_action('wp_enqueue_scripts', 'tabs_header'); 

Answer 1

실제로 무엇을하고 있는지 알지 못하는 한 don't enqueue external jQuery sources. 대부분의 WordPress/jQuery 버그는이 때문에 발생합니다. WP가 번들로 제공되는 jQuery 버전을 사용하게하면 좋을 것입니다.

탭 스크립트가 표시되지 않지만 가지고 있다고 가정합니다.

add_action('wp_enqueue_scripts', 'enqueue_scripts_so_17856211'); 

function enqueue_scripts_so_17856211() 
{ 
    wp_enqueue_style( 
     'tabs-css', 
     get_stylesheet_directory_uri() . '/css/tabs.css' 
    ); 
    wp_enqueue_script( 
     'tabs-js', 
     get_stylesheet_directory_uri() . '/js/tabs.js', 
     array('jquery', 'jquery-ui'), 
     false, 
     false 
    ); 
} 

주 your-script.js 그 jquery와 jquery-ui 종속성 being enqueued입니다 : 이것은 내가 jQuery를 탭 스크립트 (I have this working plugin at GitHub for an Audio Player)을 대기열에 얼마나이다.