These PHP coding standards are intended for the WordPress community as a whole. They are mandatory for WordPress Core and we encourage you to use them for your themes and plugins as well.
Opening and Closing PHP Tags
When embedding multi-line PHP snippets within an HTML block, the PHP open and close tags must be on a line by themselves.
Multiline:
function foo() {
?>
<div>
<?php
echo esc_html(
bar(
$baz,
$bat
)
);
?>
</div>
<?php
} single line:
<input name="<?php echo esc_attr( $name ); ?>" />
Incorrect:
if ( $a === $b ) { ?>
<some html>
<?php } Single and Double Quotes
echo '<a href="/static/link" class="button button-primary">Link name</a>';
echo "<a href='{$escaped_link}'>text with a ' single quote</a>"; Writing include/require statements
require_once ABSPATH . 'file-name.php'; Naming convention
function some_name( $some_variable ) {} Space usage
Always put spaces after commas, and on both sides of logical, arithmetic, comparison, string and assignment operators.
SOME_CONST === 23;
foo() && bar();
! $foo;
array( 1, 2, 3 );
$baz . '-5';
$term .= 'X';
if ( $object instanceof Post_Type_Interface ) {}
$result = 2 ** 3; // 8. Indentation
if you have a block of code that would be more readable if things are aligned, use spaces:
[tab]$foo = 'somevalue';
[tab]$foo2 = 'somevalue2';
[tab]$foo34 = 'somevalue3';
[tab]$foo5 = 'somevalue4'; For switch control structures,casestatements should be indented one tab from the switc hatement and the contents of thecaseshould be indented one tab from thecase ondition statement.
switch ( $type ) {
[tab]case 'foo':
[tab][tab]some_function();
[tab][tab]break;
[tab]case 'bar':
[tab][tab]some_function();
[tab][tab]break;
} Formatting Standard
- Brace Style
if ( condition ) {
action0();
}
if ( condition ) {
action1();
} elseif ( condition2 ) {
action2a();
action2b();
}
foreach ( $items as $item ) {
process_item( $item );
}
if/endif, hile/endwhile
<?php if ( have_posts() ) : ?>
<div class="hfeed">
<?php while ( have_posts() ) : the_post(); ?>
<article id="<?php echo esc_attr( 'post-' . get_the_ID() ); ?>" class="<?php echo esc_attr( get_post_class() ); ?>">
<!-- ... -->
</article>
<?php endwhile; ?>
</div>
<?php endif; ?>Declaring Arrays
- Multiline function call
$bar = array(
'use_this' => true,
'meta_key' => 'field_name',
);
$baz = sprintf(
/* translators: %s: Friend's name */
__( 'Hello, %s!', 'yourtextdomain' ),
$friend_name
);
$a = foo(
$bar,
$baz,
/* translators: %s: cat */
sprintf( __( 'The best pet is a %s.' ), 'cat' )
); - Type Delaration
$a = foo(
$bar,
$baz,
/* translators: %s: cat */
sprintf( __( 'The best pet is a %s.' ), 'cat' )
);
function foo( Class_Name $parameter, callable $callable, int $number_of_things = 0 ) {
// Do something.
}
function bar(
Interface_Name&Concrete_Class $param_a,
string|int $param_b,
callable $param_c = 'default_callable'
): User|false {
// Do something.
} Namespace Declaration
namespace Prefix\Admin\Domain_URL\Sub_Domain\Event;
Using Import Use Statement
namespace Project_Name\Feature;
use Project_Name\Sub_Feature\Class_A;
use Project_Name\Sub_Feature\Class_C as Aliased_Class_C;
use Project_Name\Sub_Feature\{
Class_D,
Class_E as Aliased_Class_E,
}
use function Project_Name\Sub_Feature\function_a;
use function Project_Name\Sub_Feature\function_b as aliased_function;
use const Project_Name\Sub_Feature\CONSTANT_A;
use const Project_Name\Sub_Feature\CONSTANT_D as ALIASED_CONSTANT; HTML Coding Standard
Self closing elements
<br/> Attributes and Tags
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> Quotes
<input type="text" name="email" disabled="disabled" />
<input type='text' name='email' disabled='disabled' /> Indentation
<?php if ( ! have_posts() ) : ?>
<div id="post-1" class="post">
<h1 class="entry-title">Not Found</h1>
<div class="entry-content">
<p>Apologies, but no results were found.</p>
<?php get_search_form(); ?>
</div>
</div>
<?php endif; ?>; Css Coding Standard
Structure
#selector-1,
#selector-2,
#selector-3 {
background: #fff;
color: #000;
}
Selectors
#comment-form {
margin: 1em 0;
}
input[type="text"] {
line-height: 1.1;
} Properties
#selector-1 {
background: #fff;
display: block;
margin: 0;
margin-left: 20px;
} Property Ordering
- Display
- Positioning
- Box model
- Colors and Typography
- Other
#overlay {
position: absolute;
z-index: 1;
padding: 10px;
background: #fff;
color: #777;
} Vendor Prefixes
.sample-output {
-webkit-box-shadow: inset 0 0 1px 1px #eee;
-moz-box-shadow: inset 0 0 1px 1px #eee;
box-shadow: inset 0 0 1px 1px #eee;
} Values
.sample-output {
-webkit-box-shadow: inset 0 0 1px 1px #eee;
-moz-box-shadow: inset 0 0 1px 1px #eee;
box-shadow: inset 0 0 1px 1px #eee;
}
.class { /* Correct usage of quotes */
background-image: url(images/bg.png);
font-family: "Helvetica Neue", sans-serif;
font-weight: 700;
}
.class { /* Correct usage of zero values */
font-family: Georgia, serif;
line-height: 1.4;
text-shadow:
0 -1px 0 rgba(0, 0, 0, 0.5),
0 1px 0 #fff;
}
.class { /* Correct usage of short and lengthier multi-part values */
font-family: Consolas, Monaco, monospace;
transition-property: opacity, background, color;
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, 0.8);
} Media Queries
@media all and (max-width: 699px) and (min-width: 520px) {
/* Your selectors */
} Commenting
/* This is a comment about this selector */
.another-selector {
position: absolute;
top: 0 !important; /* I should explain why this is so !important */
}