您的位置：首页 > 其它

WordPress主题制作教程1：主题基本文件

2015-04-06 15:46 369 查看
在最简单的情况下，一个WordPress主题由两个文件构成：

index.php ------------------主模版

style.css -------------------主样式表

以下不是必须的，但是有特殊意义的模版列表：

404.php404模板
rtl.css如果网站的阅读方向是自右向左的，会被自动包含进来
comments.php评论模板
single.php文章模板。显示单独的一篇文章时被调用，如果模板不存在会使用 index.php
single-<post-type>.php自定义单独页面模板如： single-books.php 展示自定义文章类型为 books的文章，如果模板不存在会使用 index.php
page.php页面模板
category.php分类模板
tag.php标签模板
taxonomy.php术语模板。请求自定义分类法的术语时使用
author.php作者模板
date.php日期/时间模板
archive.php存档模板。查询分类，作者或日期时使用的模板。需要注意的是，该模板将会分别被category.php， author.php， date.php所覆盖（如果存在的话）
search.php搜索结果模板
attachment.php查看单个附件时使用的模板
image.php图片附件模板，查看单个图片时将调用此模板，如果不存在此模板，则调用attachment.php 模板
sidebar.php边栏
header.php 顶部
footer.php底部
function.php模版函数
嵌入方法：

包含头部 header， 使用get_header();

包含侧栏 sidebar， 使用 get_sidebar();

包含底部 footer， 使用 get_footer();

包含搜索框 search form， 使用 get_search_form();

　

创建自定义模版：声明这个模板注释

<?php
/*
Template Name: my
*/
?>


文件基本内容：

style.css 需要有效的主题信息标记，如：（注意的是两个不同的主题是不允许拥有相同的表述 ， 这样会导致主题选择出错的。）

/*
Theme Name: youjiuyou
Theme URI: http://youjiuyou.cn/ Description: The 2015 default theme for WordPress.
Author: tinyphp
Author URI: http://youjiuyou.cn/ Version: 1.0
*/


用于声明主题名称、主题url、主题版本、主题描述、作者、作者网址

头部文档（header.php）

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php wp_title(); ?></title>
<meta name="description" content="<?php bloginfo( 'description' ); ?>">
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php if ( is_singular() && get_option( 'thread_comments' ) ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_head(); ?>
</head>


<html> 开始标签应该包含 language_attributes()

使用 bloginfo() 设置 <meta> 字符集和description元素

使用 wp_title() 设置 <title> 元素

使用 get_stylesheet_uri() 来获取当前主题的样式表文件

使用 Automatic Feed Links 添加 feed 链接

需添加声明 wp_head() 到 </head> 结束标签的前面

文档（footer.php）

在body前加入

<?php wp_footer(); ?>


搜索结果（search.php）

使用 the_search_query() 或 get_search_query() （显示或返回值

引用js：

方法1

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


bloginfo('template_url') ;输出模版地址绝对路径

方法2

<?php
wp_enqueue_script( 'init_js',get_bloginfo('template_url').'/js/init.js');
?>


引用样式：

引用style.css

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />


引用某个样式方法1

<link rel="stylesheet" href="<?php bloginfo('template_url');?>css/mystyle.css" type="text/css" media="screen" />


引用某个样式方法2

<?php
wp_enqueue_style( 'init_style',get_bloginfo('template_url').'/css/mystyle.css');
?>


主题安装：

主题预览图：命名为 screenshot.png ，放在你的主题的根目录下。

主题的安装：在后台外观->添加主题，把.zip格式的主题上传即可在后台编辑。

WordPress主题安装后，目录位于 wp-content/themes/

基本主题包下载>>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航