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 主题开发 - (三) 开发工具 待翻译的更多相关文章

  1. WordPress 主题开发 - (五)WordPress 主题模板及目录结构 待翻译

    While the most minimal of WordPress Themes really only need an index.php template and a style.css fi ...

  2. wordpress 主题开发

    https://yusi123.com/3205.html https://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tut ...

  3. WordPress 主题开发 - (一) 前言 待翻译

    原文出自: http://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tutorial-2nd-edition/ THE TH ...

  4. 决定如何开发你的WordPress主题框架

    在本系列教程的第一部分,我介绍了不同类型的主题框架并解释了它们是如何工作的. 在你开始建立你的主题框架之前,你需要考虑它是如何工作的,以及它将会被用来做什么,这样你才能从一开始就找到最合适的开发途径. ...

  5. 开发wordpress主题

    查看我的wordpress站点 第一步:下载wordpress安装包 官网下载==> 第二步:本地安装开发环境 官网给出的环境要求: 可以选择安装wamp/xampp集成PHP开发环境,安装很简 ...

  6. 从无到有开发自己的Wordpress博客主题---Wordpress主题的构造

    在这篇教程中,主要是对Wordpress的主题的构造进行分析,以方便今后的开发工作. 本来打算就引用一下别人已经有的文档就好了,但还是想从头到尾捋一遍,也方便自己梳理学习. 1.Wordpress主题 ...

  7. 大牛们是如何开发 WordPress 主题的?

    自己算是写过一个主题,目前也在用( 这里 -> http://udonmai.com/ ),所以多少想说两句. 当初走上web开发的路之后最想干的事情就是写个自己的WP主题...所以网上搜罗了很 ...

  8. WordPress 主题开发:从入门到精通(必读)

    本专栏介绍如何开发设计你自己的 WordPress 主题.如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档.本文的内容不同于应用主题,因为所讨论的是编写代码去构建你自己的主题的技术内容, ...

  9. 黄聪:《跟黄聪学WordPress主题开发》

    又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...

随机推荐

  1. C#中怎么在EXCEL中的单元格中画斜线啊 ??

    Code Snippet 做法: 1,先添加引用COM,找 Excel 2,using Excel = Microsoft.Office.Interop.Excel; 3, 代码 private Ex ...

  2. cookie与session的区别与联系

    cookie是什么?  cookie是存在于客户端(浏览器). cookie的使用是由浏览器按照一定的原则在后台自动发送给服务器的.浏览器检查所有存储的cookie,如果某个cookie所声明的作用范 ...

  3. codeforces 677C C. Vanya and Label(组合数学+快速幂)

    题目链接: C. Vanya and Label time limit per test 1 second memory limit per test 256 megabytes input stan ...

  4. hdu-5681 zxa and wifi(dp)

    题目链接: zxa and wifi Time Limit: 2000/1000 MS (Java/Others)     Memory Limit: 65536/65536 K (Java/Othe ...

  5. 转:android surface简单使用Demo

    转: http://blog.csdn.net/listening_music/article/details/6860786 通过之前介绍的如何自定义View, 我们知道使用它可以做一些简单的动画效 ...

  6. macOS10.12允许所有来源设置

    如何调出允许所有来源呢? 很简单一行命令搞定 调出允许所有来源 1.打开终端执行命令 sudo spctl --master-disable 2.你在打开偏好设置--> 安全与隐私   好了赶快 ...

  7. css改变谷歌浏览器的滚动条样式

    详细内容请点击 /*---滚动条默认显示样式--*/ ::-webkit-scrollbar-thumb{        height:50px;    outline-offset:-2px;   ...

  8. JavaScript--模块化编程(笔记)

    一直对JS都是一知半解,最近遇到这方面问题,所以在网上学习了一下,现在还没有完全明白,先贴出笔记; 第一章 JavaScript模块化编程(一):模块的写法 一 原始写法 // 模块就是实现特定功能的 ...

  9. 【转载】MQTT学习笔记——MQTT协议体验 Mosquitto安装和使用

    http://blog.csdn.net/xukai871105/article/details/39252653 0 前言     MQTT是IBM开发的一个即时通讯协议.MQTT是面向M2M和物联 ...

  10. Ubuntu 16.04 - python3 安装mysql驱动

    阿西吧,今天碰到一件特别蛋疼的事,给Ubuntu安装Python的MySQL驱动,驱动显示安装成功了 pip install mysql-connector 但是 在程序中导入,老是报错. Trace ...