最近在学习使用wordpress仿站,发现使用php函数的频率比较高,再加上一般的主题只有一个header,才发现遇到复杂的网站有多个页面的时候需要调用的CSS/JS会有所有不同,默认的方法只是调用一个style.css文件,这个文件包含整站所有的CSS样式,显然不是最优方法。因此根据wordpress不同页面类型输出不同的css或者js的方法显然有必要掌握:
首先是CSS的引入,
<?php if (is_home()) { ?>//如果是主页 <link rel="stylesheet" href="cssA文件" type="text/css" /> <?php } elseif( is_single() ) { ?>//如果是文章内页 <link rel="stylesheet" href="cssB文件" type="text/css" /> <?php } elseif( is_archive() || is_search() ) { ?>//如果是归档页面或搜索页面 <link rel="stylesheet" href="cssC文件" type="text/css" /> <?php } elseif( is_page() ) { ?>//如果是单页页面 <link rel="stylesheet" href="cssD文件" type="text/css" /> <?php } elseif( is_category() ) { ?>//如果是分类栏目 <link rel="stylesheet" href="cssE文件" type="text/css" /> <?php } else { ?>//其余的页面 <link rel="stylesheet" href="cssF文件" type="text/css" /> <?php } ?>
以上代码可以灵活运用:
<?php if (is_home()) { ?> <!-- //如果是主页 --> <link rel="stylesheet" href="cssA文件" type="text/css" /> <?php } elseif( is_single() ) { ?><!-- //如果是文章内页 --> <link rel="stylesheet" href="cssB文件" type="text/css" /> <?php } elseif( is_archive() || is_search() ) { ?><!-- //如果是归档页面或搜索页面 --> <link rel="stylesheet" href="cssC文件" type="text/css" /> <?php } elseif( is_page() ) { ?><!-- //如果是单页页面 --> <link rel="stylesheet" href="cssD文件" type="text/css" /> <?php } elseif( is_category() ) { ?><!-- //如果是分类栏目 --> <link rel="stylesheet" href="cssE文件" type="text/css" /> <?php } else { ?><!-- //其余的页面 --> <link rel="stylesheet" href="cssF文件" type="text/css" /> <?php } ?>
以上的代码放置在全站调用的header文件内(如果没有其他头部文件的话),以此类推,JS文件的写法一样:
<script src="公共js文件" type="text/javascript" charset="utf-8"></script><!-- //首页引用公共CSS,然后再判断 --> <?php if (is_home()) { ?><!-- //如果是主页 --> <script src="首页js文件" type="text/javascript" charset="utf-8"></script> <?php } elseif( is_single() ) { ?><!-- //如果是文章内页 --> <script src="文章页js文件" type="text/javascript" charset="utf-8"></script> <?php } elseif( is_archive() || is_search() ) { ?><!-- //如果是归档页面或搜索页面 --> <script src="归档或者搜索页js文件" type="text/javascript" charset="utf-8"></script> <?php } elseif( is_page(200) ) { ?><!-- //如果是ID=200单页页面 --> <script src="单页面js文件" type="text/javascript" charset="utf-8"></script> <?php } elseif( is_category(100) ) { ?><!-- //如果是分类ID=100栏目 --> <script src="栏目页js文件" type="text/javascript" charset="utf-8"></script> <?php } else { ?><!-- //其余的页面 --> <script src="其他的js文件" type="text/javascript" charset="utf-8"></script> <?php } ?>