我想将http://os.alfajango.com/easytabs/添加到 TwentyTwelve 子主题我知道有一种“正确的方法”可以使用 wp_enqueue_script 将 jquery 插件添加到 Wordpress 并在子主题 functions.php 中添加操作
有人可以提供一步一步的指南来添加这个特定的插件,这样我就可以分析它并从中学习。
我想将http://os.alfajango.com/easytabs/添加到 TwentyTwelve 子主题我知道有一种“正确的方法”可以使用 wp_enqueue_script 将 jquery 插件添加到 Wordpress 并在子主题 functions.php 中添加操作
有人可以提供一步一步的指南来添加这个特定的插件,这样我就可以分析它并从中学习。
您应该使用wp_register_script
和wp_enqueue_script
。将文件添加到您的主题文件夹。
function include_jquery_easytabs(){
wp_enqueue_script( 'jquery');
wp_register_script( 'jq_easytabs', get_template_directory_uri() . 'PATH TO YOUR JS FILE' );
wp_enqueue_script( 'jq_easytabs' );
}
add_action( 'wp_enqueue_scripts', 'include_jquery_easytabs' );
将以下剪辑添加到您footer.php
的</body>
标签之前或您header.php
的</head>
标签之前:
<script>
jQuery(document).ready(function($){
$('your-target-element').easytabs();
});
</script>
添加到functions.php
/**
* if jQuery not been
* added already
**/
wp_enqueue_script('jquery');
/**
* Register the script to Wordpress
**/
wp_register_script('easytabs','js/easytabs.js');
/**
* Add the Registered script to queue.
**/
wp_enqueue_script('easytabs');
<head>
您可以通过在(wp_head()
调用的地方)中查看您的 HTML 源代码来检查它是否有效。
将下面的代码段放在jQuery(document).ready(function($){ /** Your code **/ });
添加中:
$('#container-name-for-tabs').easytabs();