PhpStorm 2018.2 Help

WordPress Specific Coding Assistance

PhpStorm provides full coding assistance for developing WordPress including WordPress-aware code completion, search for hook registration functions and functions specified as hook registration parameters, navigation between hook registrations and the hook invocations, callbacks, the possibility to configure the coding style in accordance with the WordPress code style, viewing the official WordPress documentation from the PhpStorm editor, etc.

In this section:

Adding the WordPress to a project

To take advantage of coding assistance provided by PhpStorm, the WordPress installation you are working with should be configured in the project as an external library. As a result, the WordPress core file will be involved in indexing which is the basis for resolving references and providing code completion, navigation, search. etc.

If the wp-content folder is outside the WordPress installation, it has to be added either as an include path or as a content root.

Configuring the WordPress installation as a project include path

To add WordPress to your project as an external library, you need to add it to the list of include paths. Learn more in Configuring Include Paths.

  1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or PhpStorm | Preferences for macOS, and click PHP under Languages & Frameworks.

  2. On the PHP page that opens, add the path to the WordPress installation folder to the Include Paths list: click the icons general add svg button and specify the path to the installation folder in the dialog box that opens.

Adding the wp-content folder to the project

If the wp-content folder is located outside the WordPress installation, you need to add it to the project individually, apart from the WordPress core files. This can be done in two ways:

  • To have the wp-content folder involved in indexing without putting it under the project version control, add it to the list of include paths:
    1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or PhpStorm | Preferences for macOS, and click PHP under Languages & Frameworks.

    2. On the PHP page that opens, add the path to the wp-content folder to the Include Paths list: click the icons general add svg button and specify the path to the folder in the dialog box that opens.

  • To have the wp-content folder involved in indexing and put it under the project version control, add it as a content root:
    1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or PhpStorm | Preferences for macOS, and click Directories under Project:<project name>.

    2. On the Directories page that opens, click the Add Content Root button icons general add.

    3. In the dialog that opens, locate the wp-content directory and click OK.

    Learn more about configuring content roots in Configuring Content Roots. For information about adding files and folders to version control, see Enabling Version Control.

Configuring WordPress code style

In PhpStorm, you can use the WordPress Code Style in accordance with the WordPress coding standards. To configure the native WordPress code style, do one of the following:

Learn more in Configuring Code Style.

    1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or PhpStorm | Preferences for macOS. Expand the Editor node, and then click PHP under Code Style.

    2. On the Code Style. PHP page that opens, click the Set from... link.

    3. On the context menu, choose Predefined Style, then choose WordPress.

  • Upon activating of the WordPress integration, PhpStorm displays a pop-up window offering you to set the WordPress code style. Click the Set it link in the pop-up window and set the code style on the Code Style. PHP page that opens.

Hooks support

PhpStorm indexes all hooks declared in the WordPress core and in the included plugins. This makes the basis for coding assistance when working with hooks.

Completion for parameters of the Action and Filter functions

Hook names are available in code completion of standard parameters for action and filter functions (add_action() and add_filter()). To invoke completion for a parameter:

  1. Start typing the declaration of an add_action() or add_filter() function.

  2. Press Ctrl+Space and choose the relevant parameter from the list.

    ps_wp_hooks_completion.png

Navigation from a hook registration to the hook invocation

To navigate from a hook registration (add_action() or add_filter() function) to the hook invocation:

  • Click the ps_wp_hooks_navigation_gutter_icon.png icon in the gutter area next to the hook registration to navigate from.
    ps_wp_hooks_navigation.png

    PhpStorm opens the file where the hook is invoked and positions the cursor at the invocation method, in the current example it is do_action.

Callbacks from a hook registration

You can navigate to the declaration of the function or method specified as the second parameter of a hook registration (add_action() or add_filter() function). To do that:

  • With the Ctrl/ keyboard key pressed, hover the cursor over the parameter of interest. PhpStorm displays a pop-up information message with the definition of the function or method specified as this parameter:

    ps_wp_hooks_callback.png
    The parameter turns into a link. When you click this link, PhpStorm opens the file where the function or method was declared and positions the cursor and declaration.

Navigating to hook invocations

To search for a hook invocation and navigate to it, do one of the following:

Learn more about search and navigation in Searching Through the Source Code and Navigating Through the Source Code.

  • Use the Navigate to Symbol functionality:
    1. Choose Navigate | Symbol on the main menu.

    2. In the Enter symbol name pop-up window that appears, start typing the hook name in the search field. If necessary, select the Include non-project items checkbox. The contents of the list below the search field change as you type.

      ps wp hooks navigate to symbol

    3. Click the relevant hook from the list. PhpStorm opens the file where it is invoked and positions the cursor at the invocation.

  • Use the Search Everywhere functionality:
    1. Press the Shift keyboard key twice.

    2. start typing the hook name in the search field. If necessary, select the Include non-project items checkbox. The contents of the list below the search field change as you type.

    3. Click the relevant hook from the list. PhpStorm opens the file where it is invoked and positions the cursor at the invocation.

Searching for hook registration functions

You can search for occurrences of a hook registration function and for occurrences of a function or method specified as the second parameter of a hook registration.

Learn more in Finding Usages.

  • To get a list of usages for a hook registration function:
    1. Position the cursor at the name of the desired hook registration function and press Alt+F7 or choose Edit | Find | Find Usages on the main menu.

    2. From the pop-up list that shows the available options in terms of hook/function name, choose the relevant option. The Find tool window opens with a new tab showing all the detected occurrences of the selected function.

    3. Explore the listed occurrences. To navigate to the relevant one, click it. PhpStorm opens the file with the selected function or method and positions the cursor at it.

  • To get a list of occurrences of a function or method specified as the second parameter of a hook registration:
    1. Position the cursor at the parameter of interest and press Alt+F7 or choose Edit | Find | Find Usages on the main menu. The Find tool window opens with a new tab showing all the detected occurrences of the function or method specified as the parameter on which the search was invoked.

    2. Explore the listed occurrences. To navigate to the relevant one, click it. PhpStorm opens the file with the selected function or method and positions the cursor at it.

Viewing the official WordPress documentation from PhpStorm

You can view the official WordPress Documentation at http://wordpress.org/ right from the PhpStorm editor.

  1. Select the text you are interested in.

  2. On the context menu of the selection, choose Search on WordPress.org.

    PhpStorm opens the page with the relevant documentation in the default browser.

Last modified: 21 November 2018

See Also