一些代码需要添加到一个指定的页面,而不是全局。这时,可以使用一个wp_footer钩子,再结合is_page进行页面判断,将指定代码写到页面底部
很多时候,我们需要在一些特定的页面添加js/css,这一次试试用wp_footer钩子的方法吧。
部分脚本代码或css样式
有时候,一些代码需要添加到一个指定的页面,而不是全局。这时,可以使用一个wp_footer钩子,再结合is_page进行页面判断,将指定代码写到页面底部。
function custom_script() {
if (is_page('page-slug')) {
?>
<script type="text/javascript">
$(document).ready(function(){
....
});
</script>
<?php
}
}
add_action( 'wp_footer', 'custom_script' );
JS脚本文件或css样式文件
如果要在一个指定页面中,引用一个指定的脚本文件,可以这么写:
function custom_js() {
// child theme: use get_stylesheet_directory_uri() instead of get_template_directory_uri()
wp_register_script('scrollTo', get_stylesheet_directory_uri() .'/jquery.scrollTo.min.js', array('bootstrap'), '01', true);
if (is_page('publications')) {
wp_enqueue_script('scrollTo');
}
}
add_action( 'wp_enqueue_scripts', 'custom_js' );
如果是样式文件,则使用wp_enqueue_style函数。
其它
- 页面用is_page()
- 文章用is_single()
- oocommerce的产品页,则用is_product()
相关:
通过enqueue或其它方式在wordpress中添加一些js代码后,控制台报错”TypeError: $ is not a function” 。这是一个很常见的问题。
解决方法,需要将$替换为Jquery,即:
jQuery(document).ready(function($){
$("#buttonName").onclick ....
})
jQuery('#btn').click(function() {
console.log('ok');
});
免责声明:
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,请不要用于商业用途!
3. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源均免费,可通过签到获取金币,抵制伸手党!