首先你要去官网下载并安装好wordpress,官方网站:https://cn.wordpress.org/
然后你要制作好你的网站所有页面的静态页
都做好后,就可以开始制作主题了
1、新建一个style.css,放在你的主题包根目录下,内容如下:
这个css文件起到的作用就是在后台的主题菜单里面显示你的主题名字
2、做一张300×225尺寸的PNG图片当作你的主题缩略图,名字叫 screenshot.png
3、把你做好的静态页以及相关资源文件都放到主题文件夹内复制到 wp-content\themes\ 目录内
4、把 index.html 改名为 index.php ,然后修改头部的css等文件链接地址,比如改为:
<link href="<?php bloginfo('template_url'); ?>/css/index.css" rel="stylesheet" type="text/css">
这里面:<? php bloginfo('template_url'); ?>
就是读取模板所在目录的URL地址,再加上你后边写的css文件的存放目录,就能正确显示你的css文件了
1、把 index.html 里面共用的头部和尾部抠出来,分别存为 header.php 和 footer.php,注意修改里面的资源链接地址,改为动态获取的当前模板路径:
<?php bloginfo('template_url'); ?>
2、把 index.php 页面里面需要调用头部或尾部的地方用php代码获取:
<?php get_header(); ?> <?php get_footer(); ?>
3、修改header.php头部的一些代码,改为动态获取,比如:
<title><?php bloginfo('name'); ?></title>
↑ 把title改为调用后台配置的文字,还有 bloginfo(‘description’); 网站描述
<link href="<?php bloginfo('template_url'); if (is_home()) {echo '/css/index.css';} else {echo '/css/page.css';} ?>" rel="stylesheet" type="text/css">
↑判断当前显示的页面是否为首页 “is_home()”如果是首页就显示 index.css ,如果不是就显示 page.css
列出几个常用的判断:
is_home():当前页面为主页时返回true
is_category():当前页面为分类页时返回true
is_single():当前页面为单文章页时返回true
is_page():当前页面为单页面时返回true,多个页面判断方法: “is_page(array(‘help’,’help-zjsla’,’help-ypsla’))”
4、制作默认的文章分类页模板“category.php”
把你已经做好的分类页的html模板重命名为 category.php ,引入头部和尾部,如果有侧边栏,同样也可以引入,这样文章分类页基本就做好了,例如:
<?php get_header(); ?> <?php get_footer(); ?> <?php get_sidebar(); ?>
()括号里面可以写一些参数,比如你有多个header就可以写get_header(1)、get_header(a),对应的php文件就是 header-1.php,header-a.php,其他同理。
如果你有多个分类,可以在 category.php 后边加上 – 分隔符,例如:category-activities.php
接下来是显示指定分类目录下的文章,并显示文章缩略图,这个缩略图功能要首先在 functions.php 页面里增加一段代码后才能调用,后边有单独介绍。
① 显示指定分类下的文章列表,搭配缩略图
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); <li> <?php if ( has_post_thumbnail() ) : ?> <?php the_post_thumbnail(); ?> <?php else: ?> <img src="<?php bloginfo('template_url'); ?>/images/xxxxxx.jpg" width="370" height="171" alt=""> <?php endif; ?> <h4 class="am-text-center"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h4> </li> <?php endwhile; endif; ?>
如果你想显示日期,可以使用 “get_the_date()”函数。
5、制作默认的文章内容显示页模板 “single.php”
① 把你已经做好的文章内容页的html模板重命名为 single.php ,并替换里面的头部和尾部模板。
② 在文章标题处填写动态获取代码:
<?php the_title(); ?>
③ 在发表时间处填写动态获取代码:
<?php the_time('Y年-n月-j日') ?>
④ 在文章内容处,必须先写上主循环代码,然后才能加入文章内容获取代码,例如:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> <?php the_content(); ?> <?php endwhile; endif; ?>
the_post() 函数被调用之后,我们就可以使用许多模板函数和全局变量,以下是获取文章的一些属性方法:
- the_author:获取作者的名字。
- the_title:显示当前日志的标题。
- the_content:显示日志的内容。
- the_permalink:显示日志的永久链接的 URL。
- the_ID:显示日志的 ID。
6、制作文章页的侧边栏 “sidebar.php”
① 把你已经做好的文章内容页侧边栏div代码抠出来,新建一个php文件命名为 sidebar.php,把抠出来的代码粘贴进去。
② 修改循环列表处的代码如下:
<ul class="aside-list-news"> <?php query_posts('showposts=3&cat=1'); if(have_posts()) : while (have_posts()) : the_post(); ?> <li> <figure> <?php if ( has_post_thumbnail() ) : ?> <?php the_post_thumbnail(); ?> <?php else: ?> <img src="<?php bloginfo('template_url'); ?>/images/xxxxxxx.jpg" width="370" height="171" alt=""> <?php endif; ?> <figcaption><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></figcaption> </figure> </li> <?php endwhile; endif; ?> </ul>
如果你想显示日期,可以使用 “get_the_date()”函数。
7、新建一个函数库文件 “functions.php”
里面写一些必要的函数,比如你想给发布的文章搭配一个缩略图,就需要在functions.php里面增加一段代码:
<?php add_theme_support( 'post-thumbnails' ); ?>
这样你发布文章的时候就可以添加缩略图了
原文链接:https://blog.csdn.net/xjtarzan/article/details/78539251?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522171852351316800222846063%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=171852351316800222846063&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-15-78539251-null-null.nonecase&utm_term=wordpress%E4%B8%BB%E9%A2%98