杭州网站建设
本内容完全由佚站互联成员原创并且免费提供交流学习,如有转载,请注明出处。

在开始使用WordPress开发你的网站建设项目之前,你需要知道如何在WordPress引入JS和CSS文件,在WordPress中引入这两种文件的方式与平常网站中引入的方式有所不同,让我们来一起看看。


对JS和CSS文件进行注册

在WordPress引入JS和CSS文件之前,需要将这些文件通过WordPress的API进行注册,从而声明它们的存在,然后在通过调用函数将它们引入到对应的页面中,注册两种文件的API函数 很简单,使用起来也很方便,我们以注册Bootstrap的JS以及CSS文件为例:
wp_register_script('bootstrap', get_template_directory_uri() . '/bootstrap/bootstrap.js', 'jquery', '3.0.1', true);
以上函数是为JS文件进行注册,让我们来看看,这个API对应的参数内容是什么意思。
第一个参数'bootstrap',可以当作是该注册脚本的名称,名称必须唯一,在之后加载的时候会用到该名称。
第二个参数就是该文件的路径了,我们采用 get_template_directory_uri()来获取到对应的主题根目录。
第三个参数是指在该脚本加载之前需要预加载的包,例如我们现在需要jquery。
第四个参数是指该脚本的版本号, 通过引入版本号能够更新客户端缓存,很有用。
最后一个参数是指是否将该脚本引入到页面底部(</body>标签之前),这样做有利于SEO搜索引擎优化原则。

接着再来看看CSS的注册函数:
wp_register_style('bootstrap', get_template_directory_uri() . '/bootstrap/bootstrap.css', '', '3.0.1');
与JS的注册函数相比较,它们的功能解释都是相同的,除了最后一个变量不是将该脚本在页脚加载。


对注册好的JS和CSS文件进行引入

在通过之前的注册流程之后,我们就可以开始在主题中引入对应的文件了,引用方式比注册要简单得多,例如我们要引入上面的bootstrap.js,那么就按照以下进行编码:wp_enqueue_script('bootstrap');如果要引入bootstrap.css,那么就按照以下进行编码:wp_enqueue_style('bootstrap');需要说明的是,JS和CSS的名称一样是没关系的,同样可以正常加载。


写在文章最后

采用WordPress的方式加载JS和CSS文件好处有很多,除了一劳永逸之外,还能够在不同功能页面引入不同文件,从而更有利于网站优化


佚站互联 YEAHZAN,杭州网站建设 创新团队。本文版权所有,转载时请注明出处。

对此文章有疑问?可以留言提问,或者通过 在线联系 我们来获得帮助。