WordPress isn’t just for blogging. It’s a full-fledged CMS and undoubtedly a strong platform for developers. But the world of related trends and tools can be exhaustive when you just need a solid solution real fast.
Given the fact that WordPress is used by millions of people, it’s only natural many use it to make a living, too. From plugin and theme developers to those in technical support, the number of users rises every day. Likewise, the number of products you can use in conjunction with WordPress continues to rise as well.
Building themes, plugins, and applications in WordPress requires a variety of tools that help with development. In this article, we take a look at the best tools available for devs. They’re broken up by category for easier navigation.
Plugin and Theme Development Tools
These tools help you with the nitty-gritty plugin and theme development process directly.
Developer
The first on our list is a well-known plugin among WordPress developers. Developer was developed collaboratively by Automattic and a number of other talented WordPress developers. Its purpose is to help you optimize your development environment by installing the best tools for theme and plugin creation.
After the installation, you will get a popup screen asking you what type of project you’re working on. You can choose between three options:
- Plugin for a self-hosted WordPress installation
- Theme for a self-hosted WordPress installation
- Theme for a WordPress.com VIP site
Based on your choice, the plugin will then offer additional plugins to install that are most suitable for your project.
This plugin is free.
Theme Check
Even if you have been developing WordPress themes for years, Theme Check is a must have tool in your arsenal. Sometimes, no matter how many years of experience you have, it’s easy to overlook a simple mistake which can lead to your theme being rejected from the official repository or cause problems later down the road.
Theme Check plugin makes sure those mistakes are avoided by checking everything possible under the sun to verify your theme follows the latest recommendations and best practices.
This plugin is free.
Monster Widget
Setting up widgets to check if they display properly in your theme can be a tedious task. Luckily, Monster Widget takes that headache away. With this free plugin, you can quickly test all the core widgets in all the sidebar areas.
Similarly, if you work with WooCommerce, be sure to check out the WooCommerce Monster Widget plugin which does exactly the same thing for WooCommerce.
RTL Tester
It’s important to pay attention to Right to Left languages when developing WordPress themes and plugins. Implementing RTL support is not hard as it only requires adding an RTL stylesheet and properly enqueueing that stylesheet in your theme so there really is no excuse not to do it.
RTL Tester gives you the option to simulate the RTL development environment with the click of a button to make sure everything works as intended.
This plugin is freely available from the repository.
WP-CLI
WP-CLI is a set of command-line tools that allows you to manage WordPress installations. With this tool in your development arsenal, you can update plugins, set up multisite installs, import test content, and much more without using a web browser.
Generate WP
GenerateWP is a set of tools originally designed for WordPress developers to help them decrease development time by generating various snippets of code. It can be used by experienced users who wish to reduce development time and new developers who want to learn how to use the latest WordPress features, coding standards, and API’s.
You can use GenerateWP to generate different taxonomies, sidebars, shortcuts, custom post types, widgets, and much more.
Duplicator
Duplicator is a great tool that allows you to move or backup WordPress sites, pull production sites down to your local machine for testing and validation, as well as allowing you to develop locally and then push up to a production server for site releases/updates or just demoing a site.
The basic free version of the plugin gives you the option to backup files and the database, database table filters, directory filters, and migration wizard.
The paid version of the plugin is available in three pricing tiers costing $39 for a Personal license, $79 for Freelancer license allowing you to use it on 15 websites and $119 Business license which allows you to use it on an unlimited number of websites. The premium version of the plugin comes with more features such as scheduled backups, cloud storage, email alerts, and much more.
Roots.io
Roots.io is a set of tools that helps you build better WordPress sites faster by using open-source tools for WordPress application development. Roots.io consists of Trellis, Bedrock, and Sage – three different applications that can be used together or separately to improve your development workflow. I’ll talk about each below.
Trellis
Trellis replaces MAMP, XAMPP, and similar tools and gives you a “WordPress development and production servers done right.” It allows you to automatically create and provision a server to host a WordPress site by using Vagrant to automatically create a self-contained virtual machine which essentially gives you the same environment your site would use in production.
Bedrock
Bedrock is a WordPress boilerplate with which you can organize your WordPress project better, improve configuration files, manage plugins with Composer as well as giving you improved security and proper dependency management.
Sage
Sage is a starter theme that lets you build better themes faster with improved development tools. Thanks to gulp and Bower you have the power of the best JavaScript ecosystem while BrowserSync makes it easy to develop for multiple devices.
Design Tools
Building websites requires more than just code. You also need to get a handle on the design aspects if you want to create a functional and aesthetically pleasing user interface and experience.
Pictura
The right picture can speak volumes and really give a boost to your final product. Scouring the web for the right image though can be a long process which involves not only finding the right image but also making sure you have the correct license. Luckily, the team behind Made By Source, developers of several awesome Photoshop plugins, comes to the rescue again.
Pictura is a free Photoshop plugin that allows you to search Flickr’s entire database for the right kind of photo directly from the design environment. Locate images by license and use them immediately.
Fontello
Icon font libraries are gaining in popularity and it can be hard to choose which one is the best. WordPress comes with native support for Dashicons, and adding additional icons is easy, however, sometimes you just need an icon or two to make your design stand out. Enter Fontello.
Fontello is a free resource which allows you to find icons from different font icon libraries (including Font Awesome) and only download the ones you need.
Font Awesome
Font Awesome is an awesome library of pictograms that show common web-related actions. The entire stack can be downloaded for free as scalable vector icons and you can customize them to your liking via CSS.
uilang
If you need to create a more dynamic design, uilang is a UI-focused programming language that allows you to add interactive elements to your site. It can create custom user interface components as well as build prototypes and with the help of their Transpiler, you can easily translate animations created with uilang into JavaScript.
Sketch
When we reviewed Sketch not too long again, writer Daniel Pataki couldn’t recommend the app enough, saying he uses it for most of his projects. Sketch certainly has given the design industry a much-needed shake up after more than two decades of Adobe dominance and it’s no wonder why – it’s easy to use and feature-rich. Check out our full review and see for yourself Daniel has become a fanatic.
Starter Themes and Frameworks
Sometimes, it’s really helpful to get a head start on development and that’s where starter themes and frameworks come into play.
Underscores
Underscores is a starter theme developed by Themeshaper in collaboration with a number of volunteer developers in the WordPress community. It comes without any additional features or styling, allowing you to focus on creating a unique product for each of your clients. The main foundation and template for every site is pre-built here, but you will be responsible for adding custom functionality and styling.
WordPress Plugin Boilerplate
At the time of writing this article, there are 44185 plugins in the WordPress plugin repository. Not all plugins are created equal though and some of them are notorious for overpromising and underdelivering. Some of them are just poorly coded. If you’ve ever wanted to dive into plugin development but want to ensure the quality is there from the get-go, consider using WordPress Plugin Boilerplate.
It contains a boilerplate plugin built to WordPress code standards and is heavily documented. The plugin is object-oriented and it standardizes hook calls, makes sure you separate the admin and front-end of your plugin, and makes sure that you put all your resources and dependencies in the correct place.
WordPress Plugin Boilerplate is free to download.
Upfront
Upfront is our own revolutionary drag and drop theme platform for WordPress. With Upfront, you can create an infinite number of beautiful themes. As our CEO James Farmer puts it… “As for power, this platform can cater to your wildest dreams of efficient theme-wide customization, from fonts to colors to preset element designs. You know that first time you discovered web design, what you could achieve by tweaking that bit of HTML code or shunting that box around Dreamweaver…? It’s like that, all over again, but so much better.”
The best bit? You can try Upfront for free, just sign up for a 14-day trial and you can get started playing with Upfront right away. Your only limit is your imagination.
Browser Extensions
Having tools integrated directly into your web browser can really streamline your workflow. Let’s take a look at some dev favorites:
Chrome Developer Tools
Most people nowadays use either Firefox or Chrome and luckily, they both come with built-in developer tools. Chrome Developer Tools can be accessed by right-clicking on a web page and selecting Inspect Element or by pressing CMD + Shift+ I (CTRL + Shift + I). It offers plenty of information useful for developers – from changing CSS to preview how a particular element would look in a different style, to debugging JavaScript and inspecting how your site behaves on different screen sizes.
Firebug
Firebug is an addon for Firefox and is a favorite of many WordPress designers and developers. It offers pretty much the same functionality as the developer tools and allows to you make live changes to any page.
MeasureIt
MeasureIt is an extension available for Firefox which allows you to check the width, height, or alignment of page elements in pixels. Chrome users, on the other hand, can get the same functionality from Dimensions which allows you to measure between the following elements: images, input-fields, buttons, videos, gifs, text, icons. You can measure everything you see in the browser.
What WordPress Theme Is That
Sometimes, you see a really cool looking WordPress website and you want to know which theme they are using. Though this online tool isn’t technically a browser extension,it does allow you to find the active theme of any WordPress website including parent and child themes. Additionally, it will also detect what WordPress Plugins are being used.
WordPress Site Manager
If you run more than one WordPress website you know that constantly logging in and out can be a hassle. This extension stores your login information and gives you direct access to the main pages of all your sites.
Code Editors and IDEs
The right code editor and/or IDE can make all the difference in the success of the sites you build. There are many editors out there right now but the following offering a good sampling of the best:
Coda 2/CodeKit
Coda 2 and CodeKit are Mac apps built for web developers. Coda 2 offers continued support, updates, mobile variations of the application, as well as support for WordPress. A great added benefit is built-in code completion. CodeKit helps web designers build sites faster and easier. To get started you simply drag and drop your project in CodeKit. The application compiles a wide host of preprocessing languages such as Less, Sass, Stylus, Jade, Haml, and more. It can also refresh browsers across many devices for testing purposes.
Sublime Text Editor
Sublime Text Editor is a cross-platform text editor with support for many programming languages, includes a sleek interface and lets you customize it to fit the needs of your development style. Plugins only extend its functionality, from adding support for additional languages, code minification,and linting, to code autocompletion and distraction-free mode.
Synchi
Synchi is a WordPress plugin that gives you syntax highlighting, auto-completion, and other powerful development features right in the WordPress backend. It can be used in the plugin, theme, and WordPress text editor as well as inside text widgets.
Atom
Atom has a fantastic feature set out-of-the box, including cross-platform editing, a built-in package manager, smart autocompletion, multiple pans, and a file system browser. It’s also highly customizable so you can tweak the look and feel of the UI with CSS/Less and add major features with HTML and JavaScript to suit how you want to work.
Local WordPress Dev Environments
It’s never a good idea to build a site while it’s on a live server for a whole host of reasons. Good thing setting up a local server is a snap with the right tools, right?
XAMPP/WAMP/MAMP
AMPP part of XAMPP stands for “Apache, MySQL, PHP, Perl” and the application lets you create an offline server on your computer for development. WAMP Server or WAMP and MAMP are nothing more than alternatives to XAMPP for Windows and Mac, specifically. You can easily install WordPress on any of these applications and develop and test to your heart’s content.
InstantWP
InstantWP allows you to have an instant WordPress setup suitable for some quick and dirty plugin and/or theme tests. The application creates a temporary development site and you can even carry it around on a USB stick.
VVV
Varying Vagrant Vagrants is an open source Vagrant configuration which focuses on WordPress development, licensed under the MIT license. Vagrant is a toolkit that runs on top of VirtualBox, VMWare, or another virtual machine software on your local machine. Vagrant allows you to work with these virtual machines to run your code while you keep your entire workflow on your local computer.
VVV is ideal for developing themes and plugins as well as for contributing to WordPress core.
DesktopServer
Desktop Server is so easy to set up it can take as little as 5 minutes to get WordPress up and running on your local machine. The free version of the software lets you install up to three WordPress sites and you need to upgrade to a premium account if you want more or want to set up Multisite.
We’ve got a great guide on how to use Desktop Server, which walks you through setup and installation.
Productivity and Collaboration
Working as a developer, your job involves a lot more than just the actual work of design and development processes. Often you are required to work with others, which requires a wide range of additional tools that make communication easier and let you stay on top of your workflow.
Trello
Trello is a visual project management tool based on the Kanban principle. Everything is arranged in boards, which then have lists and cards for further organization. Cards can be dragged across lists making it easy to quickly change the status of a project at will. Trello makes collaboration easy and fun. You can use Trello for free although you get some additional benefits, such as the ability to use custom backgrounds, with the paid version.
Asana
Asana is a project management tool that’s free for up to 15 users. It prides itself as the project management tool that’s meant to get you out of your inbox and long email threads by allowing you to convert any email into a task by simply emailing it to x@mail.asana.com. You can assign each task to a different person and leave comments on tasks to quickly update someone on the status of the task. You can also set recurring tasks and integrate it with your Google Calendar to keep track of due dates.
Basecamp
Basecamp’s to-do lists let you organize work to be done. To-do lists let you break down big chunks of work into easily digestible small lists that are simpler to manage, track, and complete. With features such as cloud storage, message boards, real-time chat and centralized schedule as well as the ability to add client-side feature which separates internal communication from client communication, Basecamp is a welcome addition to any developer’s toolset.
Basecamp offers two-tiered pricing: a $29/month plan and a $79/month plan the latter of which gives you the access to client-side features.
TimeDoctor
For all those projects that are billed hourly, a reliable time-tracker is a must have. TimeDoctor is a time tracking software developed for small teams but it can also be used if you are working solo. It will tell you exactly how you or your team are spending your time. You can track what you are doing throughout the day and see where your workflow could be improved. An added benefit is that it can automatically take screenshots of your desktop should you ever need to justify the amount of hours spent on a project.
TimeDoctor pricing starts at $9.99/month per user and offers a solo plan for $5 as well as a limited free plan.
Toggl
Another great time tracker is Toggl. Toggl is built for speed and ease of use. Your time entries are synced in real time and you can use it on a Mac, Linux, Windows, as well as iPhone and Android. On top of all that, Toggl integrates with Trello, Asana, and your other favorite productivity tools.
Toggl offer a free and paid plan. The paid plan is available from $9/month per user.
Shake
Shake helps you with the legal side of your business. Shake’s free plan lets you create binding legal agreements with a few clicks, as well as sign and send unlimited agreements from any device using their starter forms. For more customization, Shake offers paid plans which let you remove their branding and personalize the forms. Paid plans start at $10/month.
Slack
Slack makes communication easier between you and your team members as well as your clients. You can easily chat, share files, share documents, and code. It integrates with dozens of applications such as Google Drive, IFFT, GitHub, Twitter, and more and all of us here at WPMU DEV love it.
Wrapping Up
With an increasing number of people in the WordPress game, the number of tools available to developers is rapidly growing, too. From browser plugins and standalone IDEs to small design resources, the list above highlights some of the best tools available for WordPress developers.
What are your favorite developer tools? Which ones did we miss that should be included? Join the conversation in the comments below.