chaihongjun.me

wordpress根据不同页面类型输出不同的css或者js

wordpress根据不同页面类型输出不同的css或者js

最近在学习使用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 } ?>


知识共享许可协议本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可。作者:柴宏俊»