1、建立基本主题模板和安装主题
2、页头和页脚,加载引入我们主题必须的css,js文件
3、主题注册Bootstrap菜单、搜索框和导航
4、首页设计index.php
5、创建single.php页
6、创建sidebar.php页
7、创建comments.php页
8、创建archive.php页
1、为了调试方便,要在自己的电脑上搭建wordpress运行环境。建议阅读:
(1)XAMPP最流行的PHP开发环境|511遇见强烈推荐 http://www.511yj.com/wordpress-xampp-php.html
(2)Windows 服务器最傻瓜的Apache+PHP+mysql( APM 环境)ComsenzEXP安装图文教程 http://www.511yj.com/windows-apm-comsenzexp.html
(3)phpStudy 2016 (支持PHP7)让天下没有难配的php环境 http://www.511yj.com/wordpress-phpstudy-2016.html
2、懂一些html,css,php,mysql的基础。
3、能在自己的电脑上安装wordpress。建议阅读 自己动手在你的主机上安装wordpress图文教程。
4、掌握Boorstap的一些基础知识。
您可以看看《WordPress主题制作基本模版文件以及基本函数》了解一下主题制作的基础知识。 http://www.511yj.com/wordpress-template-functiosn.html
在最简单的情况下,一个WordPress主题由两个文件构成:
index.php ------------------主模版
style.css ---------------------主样式表
以下不是必须的,但是有特殊意义的模版列表:
1、在wp-content > themes > 建我们的主题文件夹bootstrapwp
2、下载最新版 bootstrap
3、解压后把css,js,font三个文件放在我们的主题文件bootstrapwp里面,如下图
4、在文件夹bootstrapwp下建立两个文件index.php,style.css
用文本编辑器打开主题的style.css文件复制以下内容,复制时把注释删掉。
/*
Theme Name: bootstrapwp //这里填主题名称
Theme URI: http://www.511yj.com //这里填主题介绍的网址,没有就填你的博客网址吧
Description: 基于Bootstrap框架构建的自适应Wordpress主题 //这里填主题的简短介绍
Version: 0.1
Author: 511遇见
Author URI: http://www.511yj.com //作者的网址
Tags: Bootstrap,自适应,Wordpress //标签,多个用半角逗号隔开
*/
5、往主题目录里面上传一个名为screenshot.png的图片就行了,图片尺寸是300 * 225,我们现在准备进入到wordpress后台控制面板安并且到外观>主题。可应该可以看到“ Bootstrap WP”做为主题中的一个被列出来。
点击主题详情
点击 Bootstrap WP题下面的启用置它为网站的当前主题。
6、文件夹bootstrapwp下建立以下三个文件
头部 header.php, 使用get_header()嵌入;
侧栏 sidebar.php, 使用 get_sidebar();嵌入;
底部 footer.php, 使用 get_footer()嵌入;
在index.php中分别使用以上命令嵌入这三个文件
<?php get_header(); ?>//调用头部文件的内容
<?php get_sidebar(); ?>//调用边栏文件的内容
<?php get_footer(); ?>//调用网页底部文件的内容
如果你想加载多个边栏,比如右边栏,先建立一个sidebar-right.php,主意命名格式sidebar-right
,让后在引入文件中,php get_sidebar('right');
这样就能加载多个边栏文件了。
<?php get_header(); ?>//调用头部文件的内容
<?php get_sidebar('right'); ?>//调用右边栏文件的内容
<?php get_sidebar(); ?>//调用边栏文件的内容
<?php get_footer(); ?>//调用网页底部文件的内容
当然不同的页头,页脚都可以使用这种载入方法,所以你可以在一个主题中创建不同的页脚,和页头文件,让你的主题风格多样性。