WordPress 主题开发 - (三) 开发工具 待翻译
Before we get started building any WordPress Theme, we’re going to need to get our development tools in place. In this post, we’ll run through the best of the best and build ourselves a cross-platform WordPress Theme test environment that would do a professional Theme developer proud.
着手构建WordPress主题之前,我们需要安装一些工具,本文中,将使用一些最好的开发工具,以构建我们的跨平台WordPress主题测试环境。
A Local Test Server: XAMPP or MAMP
The best place to develop your custom WordPress Theme is off the web, on your home computer. To do that though, you’ll need to turn your computer into a “local server”, essentially approximating the program suite on a regular web server (Apache, MySQL and PHP). This means you can install WordPress on your home computer.
Installing these separate server programs can be technically challenging, but luckily for us there are a couple of free programs that will install and manage all this for us.
If you’re on a Windows computer, you’ll want to try out XAMPP.
If you’re running a Mac, you’ll want to download MAMP. It’s what I use and it does the trick.
Developing on a remote server
If you would prefer to develop on a remote server (such as at HostGator, Blue Host, etc), you’ll need to access your site with an FTP client. For more help with FTP, visit the WordPress Codex page on the subject: http://codex.wordpress.org/FTP_Clients
Don’t have an FTP client? You’ll need to install one. Here are some free possibilities:
CyberDuck – for Mac and Windows. FileZilla – This works on Macs, PCs and Linux. After you’ve downloaded and installed an FTP client, you need to connect to your website through it. Refer to your chosen client’s documentation to learn how to do this.
Once connected to your site, you’re ready to install WordPress!
WordPress
Of course, we’ll need to download the latest version of WordPress and get it correctly installed on your local test server.
If you’re using XAMPP, follow these instructions for installing WordPress on your local test server.
If you’re using MAMP, follow these instructions for installing WordPress on your local test server.
If you’re using a remote server, follow these instructions for uploading WordPress to a remote host.
Dummy Content
Your WordPress installation is going to need some sample, or dummy, content. Something to theme. In your WordPress admin, navigate to Tools > Import and choose WordPress from the list of options. Now we only need a WXR post data file to import.
There are a couple of options:
The Theme Unit Test data WPCandy Sample Content Each of these test data sets has their pluses and minuses. One thing I like to do is import all the dummy content I can. Everything. That way nothing gets missed. When you think you’re done with your theme, use the post navigation to browse through each post. Check out the archives for the month and year and category. With robust dummy content, it’ll be easy to see if something’s amiss.
Add some “real” content, too!
In addition to dummy content, it’s also a good idea to have real content. Actual, live content that’s not just “Lorem Ipsum” or “Little Blind Text” repeated over and over. Grab some of your real content — from your blog if you have one, or from a document on your computer — and create some posts out of them. Less predictable than the standard dummy fare, real content paints a far more accurate picture of how your theme will function in a live environment (for a related read, check out Don’t let Lorem Ipsum decide the fonts used in your WordPress Themes by our own Takashi Irie).
Development Guidelines
If you’re interested in developing with current best practices, the Theme Review Guidelines Codex page is a great place to start.
Essential plugins
You’ll want to grab a copy of the Developer Plugin, brought to you by Code Wranglers at Automattic. Upon activation, it’ll suggest a ton of additional plugins that you can install at the click of a button to help you optimize your WordPress development environment and test your WordPress themes for best coding practices. Check out our brief overview of the Developer Plugin for more information.
The Monster Widget, written by our very own Michael Fields, is another must-have plugin for theme developers. By dragging just one monster widget onto your sidebar, you can test all of the WordPress core widgets in your theme at once!
A Text Editor
You won’t need any special graphics software for creating WordPress Themes — just a plain old text editor. But some are better than others, of course.
For Windows, you can try Notepad++. It’s free and open-source, and comes recommended by Lifehacker.
For the Mac, I recommend Text Wrangler.
Firefox
Of course, you can use any browser for web development but the one I recommend is Firefox. Especially with the following 2 add-ons that will make your life a whole lot easier when it comes to developing with WordPress.
The Web Developer Add-on for Firefox adds a toolbar that gives you a whole host of options for inspecting and debugging your code, from disabling all CSS styles to validating local HTML (that’s the stuff happening on the browser screen of your test server).
The Firebug Add-on for Firefox is indispensable. With Firebug enabled, you can right-click on any element in your browser window and see—in a window at the bottom of the screen—how it looks in the source code. You’ll also be able to view every single style rule that is affecting that particular element. You can turn style rules off and on to see the effect. You can even add or modify rules and see the changes in real time.
Firefox versions 10 and higher have a built-in web inspector that, like Firebug, also lets you click on an element to view a window with the source code. This web inspector, while useful, does not fully replace the features and power of Firebug.
推荐使用FireFox调试, Chrome和Safari也可以。
Safari and Chrome
If Firefox is not your cup of tea, Safari and Google Chrome are worthy alternatives. Both contain built-in development tools similar to Firebug. You can read more about Safari’s web development tools here, and here is documentation about the development tools in Chrome.
HTML and CSS
I won’t lie, a passing familiarity with basic HTML and CSS will help you out. I recommend reading through the HTML Dog HTML Beginner Tutorial and the HTML Dog CSS Beginner Tutorial. To get up to speed on HTML 5, take a look at the Element Index from HTML5 Doctor. Reading through these tutorials is completely optional, but it won’t hurt and will help you grasp some basic concepts.
PHP
But what about PHP? Don’t you need to know PHP to create a WordPress Theme? Well, yes, you do. But I’ll be teaching you enough to be dangerous with a WordPress Theme as we go along. If you want to be a keener—always recommended—you can start reading through PHP 101: PHP for the Absolute Beginner. Again, completely optional. You’ll only need to pick up the basic concepts really.
WordPress 主题开发 - (三) 开发工具 待翻译的更多相关文章
- WordPress 主题开发 - (五)WordPress 主题模板及目录结构 待翻译
While the most minimal of WordPress Themes really only need an index.php template and a style.css fi ...
- wordpress 主题开发
https://yusi123.com/3205.html https://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tut ...
- WordPress 主题开发 - (一) 前言 待翻译
原文出自: http://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tutorial-2nd-edition/ THE TH ...
- 决定如何开发你的WordPress主题框架
在本系列教程的第一部分,我介绍了不同类型的主题框架并解释了它们是如何工作的. 在你开始建立你的主题框架之前,你需要考虑它是如何工作的,以及它将会被用来做什么,这样你才能从一开始就找到最合适的开发途径. ...
- 开发wordpress主题
查看我的wordpress站点 第一步:下载wordpress安装包 官网下载==> 第二步:本地安装开发环境 官网给出的环境要求: 可以选择安装wamp/xampp集成PHP开发环境,安装很简 ...
- 从无到有开发自己的Wordpress博客主题---Wordpress主题的构造
在这篇教程中,主要是对Wordpress的主题的构造进行分析,以方便今后的开发工作. 本来打算就引用一下别人已经有的文档就好了,但还是想从头到尾捋一遍,也方便自己梳理学习. 1.Wordpress主题 ...
- 大牛们是如何开发 WordPress 主题的?
自己算是写过一个主题,目前也在用( 这里 -> http://udonmai.com/ ),所以多少想说两句. 当初走上web开发的路之后最想干的事情就是写个自己的WP主题...所以网上搜罗了很 ...
- WordPress 主题开发:从入门到精通(必读)
本专栏介绍如何开发设计你自己的 WordPress 主题.如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档.本文的内容不同于应用主题,因为所讨论的是编写代码去构建你自己的主题的技术内容, ...
- 黄聪:《跟黄聪学WordPress主题开发》
又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...
随机推荐
- find the nth digit
Problem Description 假设:S1 = 1S2 = 12S3 = 123S4 = 1234.........S9 = 123456789S10 = 1234567891S11 = 12 ...
- Web Api 2 用户认证模板解析-----外部用户认证模式
一般的社交提供商不提供一个Web Service进行身份验证(有很好的理由),而提供一个身份验证的界面,其中包含了某种协议如OpenID(连接)或使用OAuth2认证.这意味着客户端应用必须使用一个浏 ...
- 如何使用 SQL Developer 导出数据
完成此方法文档后,您应该能够了解: 如何使用 SQL Developer 将数据导出为各种文件格式 如何导出模式中的对象定义 目录 1. 简介 2. 软件要求 3. 导出数据 4. 导出对象定义 5. ...
- 转 : React Native 开发之 IDE 选型和配置
转:https://mp.weixin.qq.com/s?__biz=MzA3ODg4MDk0Ng==&mid=2651112392&idx=1&sn=135e29ddde30 ...
- sublime text 3 扩展插件SideBarEnhancements用法教程
SideBarEnhancements本是增强侧边栏的插件,这里将教大家如何用来做sublime text 3浏览器预览插件,并可自定义浏览器预览的快捷键. 第一步:安装此插件,搜索相关教程,本博客有 ...
- Sass和Compass设计师指南
注:配合查看:Sass 为什么使用Sass和Compass? 1.减少重复工作,加快开发进度 2.使用变量,便于记忆,变量使用$符号开头 3.自动转换RGBA颜色值 .color { color: $ ...
- Table of Contents - Git
Downloading and Installing Git Download for Linux and Unix Integration with Eclipse Eclipse 提交工程至 G ...
- C#中的 具名参数 和 可选参数
具名参数 和 可选参数 是 C# framework 4.0 出来的新特性. 一. 常规方法定义及调用 public void Demo1(string x, int y) { //do someth ...
- jqure全选/取消
平时我们会遇到全选/全取消, 前台效果: <div class="fix pb40 mt32 ml30 lh22"> <div class="l mr2 ...
- 理解C#系列 / C#语言的特性
C#语言的特性 大多数语句都已(;)结尾 用({})定义语句块 单行注释(//),多行注释(/*......*/)智能注释(///) 区分大小写 用namespace名称空间对类进行分类 在C#中的所 ...