Feito minha pesquisa e achei isso é como chamar o built-in ui guias jquery script em wp para a área de administração, mas eu estou preso na implementação do outros scripts de jquery necessários que eu acredito que estão embutidos no wp. Eu sei como adicionar o css e apenas adicionado html, eu só não quero causar problemas com outros plugins existentes, então eu quero adicionar esses scripts abaixo corretamente que são necessários.
http://code.jquery.com/jquery-1.8.3.js
http://code.jquery.com/ui/1.9.2/jquery-ui.js
Aqui está o que eu vou usar para o javascript (novamente como adicionar os scripts acima?):
function my_plugin_load_js() {
wp_enqueue_script('jquery-ui-tabs');
}
add_action('admin_enqueue_scripts', 'my_plugin_load_js' );
function mypluginjs() {
echo '<script>
jQuery(function() {
jQuery( "#tabs" ).tabs();
});
</script>';
}
add_action( 'admin_enqueue_scripts', 'mypluginjs' );
Aqui está o que eu tenho até agora para html:
<div class="wrap">
<h2>My plugin</h2>
<form method="post" action="options.php">
<?php settings_fields('my_plugin_options'); ?>
<?php $options = get_option('my-plugin'); ?>
<div id="tabs">
<ul>
<li><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">Third</a></li>
</ul>
<table class="form-table">
<div id="tabs-1"> options tr/td go here </div>
<div id="tabs-2"> options tr/td go here </div>
<div id="tabs-3"> options tr/td go here </div>
<p class="submit">
<input type="submit" class="button-primary" value="<?php _e('Save Changes') ?>" />
</p>
</table>
</form>
</div> <!--- wrap end -->
Se houver problema apenas com a marcação html, você deve verificar o exemplo do site oficial da jQuery UI aqui: http://jqueryui.com/tabs/
Parece o seu, mas para o trabalho você deve verificar se o seu site inclui coisas como jquery e jquery ui script, jquery css também é importante. Depois disso você deve ter script com:
$( "#tabs" ).tabs();
E tudo deve funcionar bem. Se você acha que está tudo bem com a configuração e não vê nenhum resultado, verifique o console do seu navegador para obter mais informações sobre erros do mecanismo de JavaScript.