码迷,mamicode.com
首页 > 其他好文 > 详细

做一个WordPress主题需要哪些准备

时间:2016-04-03 01:46:09      阅读:255      评论:0      收藏:0      [点我收藏+]

标签:

1.配置wordpress的开发环境

运行环境

首先本地主机上得安装了wordpress的运行环境。可以是WAMP或者MAMP,这样可以实时看到更新,而不需要经常下载或者上传文件到服务器上来检查更新。并且,有一个本地的安装环境意味着不需要有网络的链接来测试你的作品。然后,你就从underscores这个网站上下载一个scratch模板放到你的wordpress安装目录-> wp-content -> themes 下面,比如我创建了一个名为photographic-baby的主题。在wordpress网站中激活这个主题,可以看到非常原始的界面。技术分享

技术分享

集成开发环境 - IDE

一个好用的IDE,可以是eclipse,netbeans,sublime text,phpstorm等等,在本文中将使用netbeans来开发。

单元测试

不管你打算做什么样的网站,你都需要进行单元测试。比如说内容的类型,html的tag,图像的对齐等等。测试那些内容可能要花很长时间,但是幸运的是,你不要自己去做那些测试内容。你只需要下载一个Theme Unit Test data for WordPress 。然后再进入WordPress的工具->导入->WordPress, 导入刚才下载的Unit Test data。

浏览器

使用尽量多的浏览器来测试你的页面,比如Chrome,Firefox,IE,Mac上的Safari等等。

插件

WordPress的插件库里有很多好用的帮助你debug的插件。有一个很好用的插件叫做Developer, 在插件->安装插件->搜索“Developer”,可以下载安装。激活之后,会有一个提示框问你在开发什么类型的网站。因为我们讲的是开发WordPress 主题,所以选择第二个。技术分享

之后会弹出一个插件列表。之所以安装“Developer”这个插件是因为里面集成了很多其他开发插件可供选择。我们先装“Debug Bar”,“Monster Widget”,“Pagegenerate Thumbnails”和“Theme Check”。其他的插件以后用到再安装。这样,在工具下面,就可以看到多了一个“developer”这个选项。里面的配置跟一开始的简易配置是一样的。在Constants里,检查“WP_DEBUG”有没有设置成“SET”,如果没有的话在wp-config.php这个文件里更改。在菜单栏右上角,就多了“Debug”和“Developer”这两个链接。

2.设计开发的过程

理解wordpress的主题的结构。有个插件叫做“Show Current Template”,可以知道现在工作的这个页面用的什么主题页面。建议从插件库里搜索并安装。

技术分享
WordPress模板架构

新的css和javascript

如果想注册新的css和javascript,比如说加入第三方提供的javascript链接,或者字体,找到themes下面的function.php, 然后可以更新下面一段代码:

/**
 * Enqueue scripts and styles.
 */
function photographic_baby_scripts() {
	wp_enqueue_style( ‘photographic-baby-style‘, get_stylesheet_uri() );

	wp_enqueue_script( ‘photographic-baby-navigation‘, get_template_directory_uri() . ‘/js/navigation.js‘, array(), ‘20151215‘, true );

	wp_enqueue_script( ‘photographic-baby-skip-link-focus-fix‘, get_template_directory_uri() . ‘/js/skip-link-focus-fix.js‘, array(), ‘20151215‘, true );

	if ( is_singular() && comments_open() && get_option( ‘thread_comments‘ ) ) {
		wp_enqueue_script( ‘comment-reply‘ );
	}
}
add_action( ‘wp_enqueue_scripts‘, ‘photographic_baby_scripts‘ );

  

知道怎么添加css和javascript,你就可以发挥你的创造力来做自己心目中的模板了。

做一个WordPress主题需要哪些准备

标签:

原文地址:http://www.cnblogs.com/fteng/p/5348785.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!