Advanced Tools for Professional WordPress Development

Today we’re sharing a post about advanced WordPress development tools from our guest author. Magora programmers don’t often work with WP CMS, the reason for this being vulnerability of open-code systems. It’s simply impossible to guarantee the safety of the software, which can be edited by anyone. At the same time, Wordpress is one of the most popular CMS and we believe that this article will be useful. By the way, some of the editors described below are universal and can be helpful when working with any programming language.

The review of top code editors for WordPress

As a rule, to manage several projects you need a full PHP development environment such as PhpStorm or CodeLobster. But I also use text editors - for example, if I need to quickly correct a template or modify the code of my function.

Code editor creators are constantly working on adding new and expanding existing capabilities of their products to support the WordPress CMS, because the programming community understands the importance of implementing WordPress support in their software. It took a lot of time to choose several IDEs and text editors with advanced features and convenient functionality for WordPress developers. These are the programs I recommend discovering.

SublimeText

Sublime Text is a fast text editor with a fashionable user interface. It perfectly supports HTML, CSS and JavaScript syntax without additional plugins.

• To expand the functionality and add tools for WordPress developers, you need to install special packages.
• Run the program and go to the main menu, "Tools" -> "Install Package Control ...". Package Control is a package that allows you to manage other plugins.
• After that, you can download, install and remove plug-ins. To start the Package Control, go to the main menu, "Preferences" -> "Package Control".
• In order for the program to load the list of available modules, you must select from the list or type the command "Install Package".

Let's enter "WordPress" in the search bar to filter out the plug-ins specific to this CMS. From the list, you can immediately select the first "WordPress" package and install it by double-clicking it. This package adds a set of snippets and the ability to auto-complete WordPress functions.

The next plugin we select from the list is called "Search WordPress Codex". Using it, you can search the official WordPress online help directly from the editor. For example, right-click on the function and select "WordPress Codex".

There are also several popular extensions worth paying attention to, for example:

• WordPress snippets - provides a collection of snippets for WordPress programmers.
• WordPress New Project Config - helps you to create and configure a new project for WordPress CMS.
• Genesis - facilitates the work of the creators of WordPress themes, which use the child themes of Genesis.

Atom

Atom is another text editor with many advanced functions and beautiful design. It positions itself as an IDE and successfully competes with other similar programs such as Sublime Text and Rapid PHP.

Atom is based on themes and packages, so it has a wide range of functions and is flexibly configured. It has its own package manager, which we will use to install WordPress support.

• Launch Atom and go to the main menu, "File" -> "Settings". In the opened settings tab, click on "Install".
• To find new packages, enter the keyword "wordpress" in the search field and press enter. You can also click on the "Packages" button.
• In the list that appears, let's choose one of the popular packages - for example, Autocomplete WordPress Hooks. This extension will help the developer by providing automatic completion of WordPress Actions and Filters.

Find this package in the list and click the "Install" button. After a minute we will see that the package is installed. Now check the functionality of the newly added module.

After that, we can also use the hints concerning the parameters of the function.

The algorithm for working with other packages is the same. Just read the description, and if the functionality is suitable, install it.

For example, you can install the following add-ons:

• WordPress API - this add-on greatly accelerates the development process, offering useful WordPress snippets.
• WordPress Dictionary for Atom - adds snippets for all WordPress functions, including Actions and Filters.

Rapid PHP

Rapid PHP is also a good editor with PHP, HTML, CSS and JavaScript support. It successfully combines the functionality of the real IDE with high speed.

It is not resource-demanding, has a built-in PHP debugger and supports HTML5, CSS3 and several frameworks, including WordPress.For the purposes of increased performance, the ability to work with frameworks is disabled by default. 

• To enable WordPress support, go to the main menu, "Options" -> "Frameworks".
• In the list that appears, you can select one or more libraries that you want to work with. In this case, choose WordPress and click "OK".
• In the next step, let's create the project. To do this we go to the main menu and select "Project" -> "New Project".
• Now enter the project name and path to the project files. In this example, specify the folder with WordPress installed.

When the project is created, you can view its contents in the right pane of the program using the file browser.

Rapid PHP provides the programmer with the ability to use the auto-completion feature when pressing the Ctrl + Space keys.

You can also trigger an instant prompt on WordPress functions by pressing Shift + Ctrl + Space.

If in the process of work you need to use the online help for any PHP function, just place the cursor on its name and press the F1 key. The page with online help will be displayed in the browser installed on the system.

CodeLobster

CodeLobster is a functional IDE that provides a complete set of tools for the web developer.

It has a PHP, HTML, CSS and JavaScript editor with suggestions and autocompletion.

CodeLobster allows you to work with databases directly from the IDE, edit PHP files on the local computer and on a remote server using FTP.

• Among other things, you can use the PHP debugger and contextual and dynamic help.
• There is a convenient function allowing WordPress to be installed directly from the program. In addition to this, the CMS is installed and configured instantly, much faster than via the WEB-interface. For example, to create a project, go to the main menu, "Project" -> "Create Project ...".
• Then, in the dialogue box, you can specify the type of the project which will be created using the framework or one of the popular CMS.
• Select "Create Empty WordPress Site", enter the name and specify the location of the directory for installation. The New WordPress Site Wizard will then run.

It will take only a few steps to configure the connection to the database and at the last step specify the parameters of our blog.

After clicking the "Finish" button, the fresh WordPress distribution will be installed, a new project will be created and you can immediately start working.

For full information about this function from the official WordPress documentation, all you have to do is select it and press the F1 key.

CodeLobster includes the WordPress plugin in its professional version. This allows the developer to quickly start working with this CMS, since no additional installation is required.

PhpStorm

PhpStorm is a PHP IDE with many convenient features for the web developer. This programming environment is built on the IntelliJ IDEA platform and inherited all the capabilities of its parent platform.

For WordPress programmers, the distribution of the IDE comes with a special plugin for integration with WordPress.

• To start working, you need to register WordPress within the program. Start PhpStorm and go to the main menu, "File" -> "Settings ...".
• In the settings we will find the "Languages & Frameworks" section and select the "PHP" item. Then, in the "Include Path" tab, we press the plus button and specify the path to the installed CMS.

The directory with the installation will be indexed, allowing us to use the WordPress source code when navigating through functions and showing dynamic help.

• In addition, you can set the WordPress coding style, which for sure has already became familiar to WordPress developers.
• In the program settings window, go to "Editor" -> "Code Style" -> "PHP". Click on the link "Set from ..." and select "Predefined Style" -> "WordPress" from the drop-down list.
• Click "OK" to save the settings.
• Now consider the process of creating a new project. In the main menu, select "File" -> "New Project ...".
• In the opened dialogue, go to the "WordPress Plugin" section and specify both the directory for the project and the one where WordPress is installed.
• Choose the location of the project in the folder with WordPress, then click "Create" - so we create a project based on the existing source files.

You should wait a few seconds while PhpStorm scans the files. After that the project is opened and we can continue to study the functions of the program.

To use auto-completion, start entering the name of the function and press Ctrl + Space.

It is enough just to click on the function name and press Ctrl + Q to get dynamic help on this function.

IDE also supports WordPress Actions and Filters. When you press Ctrl + Space, you can quickly get a dynamic hint about the existing parameters.

This concludes the review for now. As you can see, all of the programs mentioned have their advantages.

Which one to choose? A simple and lightweight text editor, such as Rapid PHP, or a complex IDE like PhpStorm?

I chose CodeLobster, which combines the speed of work, functionality and ease of setting up WordPress projects. I'm happy to add it to my set of web development tools.

Isn’t it interesting to know what your favourite editor is? I suggest sharing your experience with Magora blog readers. I really look forward to your comments. 

Daniel Kloft

April 09, 2018