2014年7月1日

wordpress主题的javascript和css文件的引入方式

<?php wp_head();?>

<?php wp_head();?> 需放在主题的头文件header.php;包在<head>标签里。默认函数将挂钩自动引入主题下的javascript和css

不添加<?php wp_head();?>的话,javascript和css的引入可以通过以下的方式。

javascript的两种引入方式
方式1:

<script src="<?php bloginfo('template_url');?>/js/jquery.js"></script>

(一般可行)应该可以直接添加到header.php

方式2:

wp_enqueue_script( 'init_js',get_bloginfo('template_url').'/js/init.js');

(更专业)直接添加到header.php应该不可用

css的两种引入方式;
方式1:

<link rel="stylesheet" href="<?php bloginfo('template_url');?>/css/style-wide.css" />

(一般可行)可以直接添加到header.php

方式2:

wp_enqueue_style( 'init_style',get_bloginfo('template_url').'/css/mystyle.css');

更专业,直接添加到header.php不可用

<?php wp_footer(); ?>

<?php wp_footer(); ?>需放在脚步文件footer.php的</body>前,另外<body>在header.php里,脚步文件应该也可以引入css和js。

参考资料

1.wordpress官网主题制作说明文档:
http://codex.wordpress.org/Function_Reference/wp_enqueue_style
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
2.WordPress花园网站作者录制的视频介绍:wordpress模板制作教程:3头尾文件的创建