WordPressコーディング標準入門 - Photon Flux｜プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

WordPress 開発におけるコーディング標準は、強固で持続可能なコードベースのために不可欠です。開発者がコードを書く際に従うガイドラインや規約であり、共同作業の強化、メンテナンスの簡素化、全体的な信頼性の確保に役立ちます。

さらに、コーディング標準はよくある落とし穴やエラーを防ぎ、コードの品質を向上させます。WordPress の開発では、複数の貢献者がひとつのプロジェクトで共同作業を行うことが多いため、コーディング標準は効果的なチームワークの基礎となります。コミュニケーションを促進し、潜在的な衝突を緩和し、開発プロセスをより効率的にするのに役立ちます。

图片[1]-WordPress 编码标准简介-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

コーディング標準の遵守は、プロジェクト間の一貫性を促進し、開発者がコードベース間をシームレスに切り替えることを容易にします。この一貫性は、コードの可読性と保守性にも及び、チームメンバー間の共通理解を促進します。

WordPress Coding Standardsは、まとまりのある効率的な開発プロセスのための5つの重要な領域をカバーしています：

PHPはサーバーサイドのコードの一貫性を保証します。
構造化マークアップとセマンティックマークアップを促進するHTML
効果的なクライアントサイド機能のためのJavaScript
一貫したスタイリング方法のためのCSS
最終的な製品が、多様なニーズを持つ人々にとって包括的でユーザーフレンドリーなものであること。

WordPress開発におけるPHP標準

图片[2]-WordPress 编码标准简介-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

ワードプレス専用PHPコーディング標準WordPress コードの一貫性と可読性を確保するために、これらの標準は WordPress コアには必須であり、テーマとプラグインには強く推奨されています。これらの標準は、読みやすさを向上させ、コラボレーションを促進するために、命名規則からインデントやコード構造まですべてをカバーしています。

WordPressのPHP標準は以下のカテゴリをカバーしています：

一般論として- これらの標準には、複数行のPHPスニペットをHTMLコードブロックに埋め込む際に、開始と終了のPHPタグを別の行に配置すること、一重引用符や二重引用符を使用する際に短縮形のPHPタグを使用しないこと、include文やrequire文の書き方のガイドラインなどが含まれます：


// HTML 内で PHP タグを開閉します。
// open/closeタグをそれぞれの行に記述します。
## DO
関数 foo() {
  foo() { ?>DO function foo() { ?
  <div>
    <?php
    echo esc_html (
      bar (
        $param1,
        $param2
      )
    );
    ?>
  </div>
  <?php
}
## DON'T
if ( $x === $y ) { ?>
  <div>
    <!-- HTML content -->
  <?php }
// HTML 内で PHP タグを開閉します。
// open/closeタグをそれぞれの行に記述します。

## DO
関数 foo() {
  foo() { ?>DO function foo() { ?
  <div>
    <?php
    echo esc_html (
      bar (
        $param1,
        $param2
      )
    );
    ?>
  </div>
  <?php
}

## DON'T
if ( $x === $y ) { ?>
  <div>
    <!-- HTML content -->
  <?php }
// HTML 内で PHP タグを開閉します。
// open/closeタグをそれぞれの行に記述します。

## DO
関数 foo() {
  foo() { ?&gt;DO function foo() { ?
  <div>
    <?php
    echo esc_html (
      bar (
        $param1,
        $param2
      )
    );
    ?>
  </div>
  <?php
}

## DON'T
if ( $x === $y ) { ?>
  <div>
    <!-- HTML content -->
  <?php }


// 省略記法の PHP タグは避けてください。
## DO
## don't
何と言っていいかわかりません。
// 省略記法の PHP タグは避けてください。

## DO



## don't
何と言っていいかわかりません。
// 省略記法の PHP タグは避けてください。

## DO



## don't
何と言っていいかわかりません。


// include/require 文の記述。
include_onceはファイルが見つからなくても実行を続けるので、 // 避けてください。
// ファイルが見つからない場合でも実行を継続します。
// ファイルパスを括弧で囲まないでください。
## DO
require_once ABSPATH . 'ファイル名.php'
## しない
require_once __DIR__ . '/file-name.php'
include_once ( ABSPATH . 'file-name.php' )；
// include/require 文の記述。
include_onceはファイルが見つからなくても実行を続けるので、 // 避けてください。
// ファイルが見つからない場合でも実行を継続します。
// ファイルパスを括弧で囲まないでください。

## DO
require_once ABSPATH . 'ファイル名.php'

## しない
require_once __DIR__ . '/file-name.php'
include_once ( ABSPATH . 'file-name.php' )；
// include/require 文の記述。
include_onceはファイルが見つからなくても実行を続けるので、 // 避けてください。
// ファイルが見つからない場合でも実行を継続します。
// ファイルパスを括弧で囲まないでください。

## DO
require_once ABSPATH . 'ファイル名.php'

## しない
require_once __DIR__ . '/file-name.php'
include_once ( ABSPATH . 'file-name.php' )；

クリステン-命名基準には、命名規則と命名ダイナミックフックの補間が含まれます：


## DO
// 関数と変数名には小文字を使用します。
関数 my_function( $some_variable ) {}。
// 定数名には大文字を使用します。
Define('MAX_AGE', 60)；
##は使用しないでください。
// キャメルケースを使用します。
function myFunction( $someVariable ) {}。
## DO
// 関数と変数名には小文字を使用します。
関数 my_function( $some_variable ) {}。

// 定数名には大文字を使用します。
Define('MAX_AGE', 60)；

##は使用しないでください。
// キャメルケースを使用します。
function myFunction( $someVariable ) {}。
## DO
// 関数と変数名には小文字を使用します。
関数 my_function( $some_variable ) {}。

// 定数名には大文字を使用します。
Define('MAX_AGE', 60)；

##は使用しないでください。
// キャメルケースを使用します。
function myFunction( $someVariable ) {}。

ボイド- 空白の標準は、空白の使い方、インデント、末尾の空白の削除に関するガイドラインを定めています。(開発者の間で活発な議論を始めるには、コードをインデントするときにタブとスペースのどちらが好きか尋ねてみてください。好みにかかわらず、WordPressの開発者が公式に推奨しているのはタブを使うことで、これはPHPに加えてJavaScriptとCSSにも当てはまります。(PHPだけでなく、JavaScriptやCSSでも同様です。）


## DO
// カンマの後にスペースを入れてください。
$colors = ['赤', '緑', '青'].
// 開き括弧と閉じ括弧の両側にスペースを入れます。
// 制御構造体の開始括弧と閉じ括弧の両側にスペースを入れます。
foreach( $foo as $bar ) { ...
// 関数の定義： function my_function() { .
function my_function() { ...
// 論理比較： if ( ！
if ( ！ $foo ) { ...
// 配列項目へのアクセス： $a = $foo['bar'] { ...
$a = $foo['bar'] { ...
$a = $foo[ $bar ]。
## don't
$colors = ['red','green','blue'] です。
foreach($foo as $bar){ ...
function my_function(){ ...
if (!$foo) { ...
$a = $foo[ 'bar'] { ...
$a = $foo[$bar] ...
## DO
// カンマの後にスペースを入れてください。
$colors = ['赤', '緑', '青'].

// 開き括弧と閉じ括弧の両側にスペースを入れます。
// 制御構造体の開始括弧と閉じ括弧の両側にスペースを入れます。
foreach( $foo as $bar ) { ...

// 関数の定義： function my_function() { .
function my_function() { ...

// 論理比較： if ( ！
if ( ！ $foo ) { ...

// 配列項目へのアクセス： $a = $foo['bar'] { ...
$a = $foo['bar'] { ...
$a = $foo[ $bar ]。

## don't
$colors = ['red','green','blue'] です。
foreach($foo as $bar){ ...
function my_function(){ ...
if (!$foo) { ...
$a = $foo[ 'bar'] { ...
$a = $foo[$bar] ...
## DO
// カンマの後にスペースを入れてください。
$colors = ['赤', '緑', '青'].

// 開き括弧と閉じ括弧の両側にスペースを入れます。
// 制御構造体の開始括弧と閉じ括弧の両側にスペースを入れます。
foreach( $foo as $bar ) { ...

// 関数の定義： function my_function() { .
function my_function() { ...

// 論理比較： if ( ！
if ( ！ $foo ) { ...

// 配列項目へのアクセス： $a = $foo['bar'] { ...
$a = $foo['bar'] { ...
$a = $foo[ $bar ]。

## don't
$colors = ['red','green','blue'] です。
foreach($foo as $bar){ ...
function my_function(){ ...
if (!$foo) { ...
$a = $foo[ 'bar'] { ...
$a = $foo[$bar] ...

フォーマッティング- WordPress PHP 開発のための書式標準には、括弧スタイル、配列宣言、複数行の関数呼び出しのガイドライン、型宣言、マジック定数、展開演算子などがあります：


// DO
// 以下のブレース・スタイルを使用します。
if ( 条件 ) {
    アクション(); } elseif ( 条件2 ) { } elseif ( 条件2 )
} elseif ( 条件2 ) {
    action2(); } elseif ( 条件2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}
// long構文で配列を宣言します。
$numbers_long = array(1, 2, 3, 4, 5); // 複数行の関数呼び出しでは、各パラメータは1行で済むようにします。
/* 複数行の関数呼び出しでは、各パラメータは1行しか使用できません。
複数行のパラメータ値には変数を代入し、その変数を関数呼び出しに渡す必要があります。
$data = array(
    
    
    
).
$greeting_message = sprintf().
    /* %sはユーザー名にマップされます */
    __( 'Hello, %s!', 'yourtextdomain' )、
    $data['user_name'].
);
$result = some_function (
    $data、
    $greeting_message, $data('user_name') ); $result = some_function (
    /* 翻訳関数%sは都市名にマップします*/
    sprintf( __( 'User resides in %s.' ), 'Cityville' ).
);
// マジック定数は大文字にします。
// ::class 定数は小文字で、スコープ解決演算子 (::) の周りには空白を入れません。
add_action( my_action, array( __CLASS__, my_method ) ); // ::class 定数は小文字で、スコープ解決演算子 (::) の周りにはスペースを入れません。
add_action( my_action, array( My_Class::class, my_method ) );; add_action( my_action, array( __CLASS__, my_method ); add_action( my_action, array( My_Class::class, my_method ) ).
/* スプレッド演算子の前に、適切なインデントでスペースまたは改行を追加します。
   を追加します。
   このようにします。
   /* スプレッド演算子の前には、適切なインデントでスペースまたは改行を追加します。
     スプレッド演算子とそれが適用される変数/関数の間にはスペースを入れてはいけません。
   * スプレッド演算子と参照演算子の間にスペースはありません。
     スプレッド演算子と参照演算子を組み合わせた場合、スプレッド演算子と参照演算子の間にスペースはありません。
*/スプレッド演算子と参照演算子の間にスペースなし。
//DO
関数 some_func( &..$arg1 ) { {.
    bar( .....$arg2 )；
    bar(
        array( ....$arg3 ), .
        ....array_values( $array_vals )
    );
}
//DONT
関数 some_func( & ...  $arg1 ) {
    bar(...
        $arg2 )；
    bar(
        array( ....$arg3 ),....array_values( $array_vals )
    );
}
// DO
// 以下のブレース・スタイルを使用します。
if ( 条件 ) {
    アクション(); } elseif ( 条件2 ) { } elseif ( 条件2 )
} elseif ( 条件2 ) {
    action2(); } elseif ( 条件2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}

// long構文で配列を宣言します。
$numbers_long = array(1, 2, 3, 4, 5); // 複数行の関数呼び出しでは、各パラメータは1行で済むようにします。
/* 複数行の関数呼び出しでは、各パラメータは1行しか使用できません。
複数行のパラメータ値には変数を代入し、その変数を関数呼び出しに渡す必要があります。
$data = array(
    
    
    
).
$greeting_message = sprintf().
    /* %sはユーザー名にマップされます */
    __( 'Hello, %s!', 'yourtextdomain' )、
    $data['user_name'].
);
$result = some_function (
    $data、
    $greeting_message, $data('user_name') ); $result = some_function (
    /* 翻訳関数%sは都市名にマップします*/
    sprintf( __( 'User resides in %s.' ), 'Cityville' ).
);

// マジック定数は大文字にします。
// ::class 定数は小文字で、スコープ解決演算子 (::) の周りには空白を入れません。
add_action( my_action, array( __CLASS__, my_method ) ); // ::class 定数は小文字で、スコープ解決演算子 (::) の周りにはスペースを入れません。
add_action( my_action, array( My_Class::class, my_method ) );; add_action( my_action, array( __CLASS__, my_method ); add_action( my_action, array( My_Class::class, my_method ) ).

/* スプレッド演算子の前に、適切なインデントでスペースまたは改行を追加します。
   を追加します。

   このようにします。

   /* スプレッド演算子の前には、適切なインデントでスペースまたは改行を追加します。
     スプレッド演算子とそれが適用される変数/関数の間にはスペースを入れてはいけません。

   * スプレッド演算子と参照演算子の間にスペースはありません。
     スプレッド演算子と参照演算子を組み合わせた場合、スプレッド演算子と参照演算子の間にスペースはありません。
*/スプレッド演算子と参照演算子の間にスペースなし。

//DO
関数 some_func( &..$arg1 ) { {.
    bar( .....$arg2 )；
    bar(
        array( ....$arg3 ), .
        ....array_values( $array_vals )
    );
}

//DONT
関数 some_func( & ...  $arg1 ) {
    bar(...
        $arg2 )；
    bar(
        array( ....$arg3 ),....array_values( $array_vals )
    );
}
// DO
// 以下のブレース・スタイルを使用します。
if ( 条件 ) {
    アクション(); } elseif ( 条件2 ) { } elseif ( 条件2 )
} elseif ( 条件2 ) {
    action2(); } elseif ( 条件2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}

// long構文で配列を宣言します。
$numbers_long = array(1, 2, 3, 4, 5); // 複数行の関数呼び出しでは、各パラメータは1行で済むようにします。
/* 複数行の関数呼び出しでは、各パラメータは1行しか使用できません。
複数行のパラメータ値には変数を代入し、その変数を関数呼び出しに渡す必要があります。
$data = array(
    
    
    
).
$greeting_message = sprintf().
    /* %sはユーザー名にマップされます */
    __( 'Hello, %s!', 'yourtextdomain' )、
    $data['user_name'].
);
$result = some_function (
    $data、
    $greeting_message, $data('user_name') ); $result = some_function (
    /* 翻訳関数%sは都市名にマップします*/
    sprintf( __( 'User resides in %s.' ), 'Cityville' ).
);

// マジック定数は大文字にします。
// ::class 定数は小文字で、スコープ解決演算子 (::) の周りには空白を入れません。
add_action( my_action, array( __CLASS__, my_method ) ); // ::class 定数は小文字で、スコープ解決演算子 (::) の周りにはスペースを入れません。
add_action( my_action, array( My_Class::class, my_method ) );; add_action( my_action, array( __CLASS__, my_method ); add_action( my_action, array( My_Class::class, my_method ) ).

/* スプレッド演算子の前に、適切なインデントでスペースまたは改行を追加します。
   を追加します。

   このようにします。

   /* スプレッド演算子の前には、適切なインデントでスペースまたは改行を追加します。
     スプレッド演算子とそれが適用される変数/関数の間にはスペースを入れてはいけません。

   * スプレッド演算子と参照演算子の間にスペースはありません。
     スプレッド演算子と参照演算子を組み合わせた場合、スプレッド演算子と参照演算子の間にスペースはありません。
*/スプレッド演算子と参照演算子の間にスペースなし。

//DO
関数 some_func( &..$arg1 ) { {.
    bar( .....$arg2 )；
    bar(
        array( ....$arg3 ), .
        ....array_values( $array_vals )
    );
}

//DONT
関数 some_func( & ...  $arg1 ) {
    bar(...
        $arg2 )；
    bar(
        array( ....$arg3 ),....array_values( $array_vals )
    );
}

宣言文、名前空間、および Import 文- これらのコーディング標準は、名前空間宣言と用途ステートメント


// 各名前空間宣言には
// 大文字の単語をアンダースコアで区切ります。
namespace My_CompanyProjectKinsta_ProjectUtilities; namespace My_CompanyProjectKinsta_ProjectUtilities.
// インポート使用ステートメントでは、名前の衝突を防ぐために // エイリアスを使用できます。
// 名前の衝突を防ぐために
use Project_NameFeatureClass_C as Aliased_Class_C; // インポートの use 文は、 // 名前の衝突を防ぐためにエイリアスを使用できます。
// 各名前空間宣言には
// 大文字の単語をアンダースコアで区切ります。
namespace My_CompanyProjectKinsta_ProjectUtilities; namespace My_CompanyProjectKinsta_ProjectUtilities.

// インポート使用ステートメントでは、名前の衝突を防ぐために // エイリアスを使用できます。
// 名前の衝突を防ぐために
use Project_NameFeatureClass_C as Aliased_Class_C; // インポートの use 文は、 // 名前の衝突を防ぐためにエイリアスを使用できます。
// 各名前空間宣言には
// 大文字の単語をアンダースコアで区切ります。
namespace My_CompanyProjectKinsta_ProjectUtilities; namespace My_CompanyProjectKinsta_ProjectUtilities.

// インポート使用ステートメントでは、名前の衝突を防ぐために // エイリアスを使用できます。
// 名前の衝突を防ぐために
use Project_NameFeatureClass_C as Aliased_Class_C; // インポートの use 文は、 // 名前の衝突を防ぐためにエイリアスを使用できます。

オブジェクト指向プログラミング - これらの基準には、1つの文書につき1つのオブジェクト構造しか使用しないこと、機能へのアクセスを提供すること、"C "および "D "機能を使用することなどが含まれます。用途ステートメント、可視性が常に宣言されるようにするためのガイド、可視性と修飾子の順序の概要、オブジェクトのインスタンス化のルールの概要について説明します：


// Trait use 文はクラスの先頭に記述します。
// Trait use は、 // 最初と最後の文の前後に少なくとも 1 行ずつ記述する必要があります。
// 最初と最後の文。
// 常に可視性を宣言してください。
クラス Foo {
    use Bar_Trait; public $baz = Bar_Trait.
    public $baz = true; ...
    ...
}
// 新しいオブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// オブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// クラス名と開始括弧の間にスペースを追加しないでください。
$foo = new Foo(); // クラス名と開始括弧の間にスペースを入れないでください。
// Trait use 文はクラスの先頭に記述します。
// Trait use は、 // 最初と最後の文の前後に少なくとも 1 行ずつ記述する必要があります。
// 最初と最後の文。
// 常に可視性を宣言してください。
クラス Foo {
    use Bar_Trait; public $baz = Bar_Trait.
    public $baz = true; ...
    ...
}

// 新しいオブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// オブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// クラス名と開始括弧の間にスペースを追加しないでください。
$foo = new Foo(); // クラス名と開始括弧の間にスペースを入れないでください。
// Trait use 文はクラスの先頭に記述します。
// Trait use は、 // 最初と最後の文の前後に少なくとも 1 行ずつ記述する必要があります。
// 最初と最後の文。
// 常に可視性を宣言してください。
クラス Foo {
    use Bar_Trait; public $baz = Bar_Trait.
    public $baz = true; ...
    ...
}

// 新しいオブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// オブジェクトのインスタンスを作成するときは、常に括弧を使用します。
// クラス名と開始括弧の間にスペースを追加しないでください。
$foo = new Foo(); // クラス名と開始括弧の間にスペースを入れないでください。

制御構造- 制御構造には elseifノットでなければ与田ステートメント：論理比較で変数と定数、リテラル、関数コールを混在させる場合は、以下のように変数を右側に配置し、誤った代入を防ぎます：


// "合法的な "比較: if ( true === $result ) { if ( true === $result )
if ( true === $result ) { // $resultで何かをします。
    // $resultで何かを行います。
}
if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通過する可能性があります。
if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通り過ぎる可能性があります。
    // 必ずここに行き着きます
// "合法的な "比較: if ( true === $result ) { if ( true === $result )
if ( true === $result ) { // $resultで何かをします。
    // $resultで何かを行います。
}

if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通過する可能性があります。
if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通り過ぎる可能性があります。
    // 必ずここに行き着きます
// "合法的な "比較: if ( true === $result ) { if ( true === $result )
if ( true === $result ) { // $resultで何かをします。
    // $resultで何かを行います。
}

if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通過する可能性があります。
if ( $result = true ) { // $resultで何かをする } // しかし、このようなタイプミスはあなたを通り過ぎる可能性があります。
    // 必ずここに行き着きます

えんざんし- これらの標準は、三項演算子、エラー制御演算子( @) とインクリメント/デクリメント演算子：


// 常に三項演算子
// ステートメントが false ではなく true かどうかをテストします。
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh'；
// pre-increment/decrementをpost-increment/decrementより優先します。
// スタンドアロン文の場合。
// DO
--$a.
// DON'T
$a--; // しない
// 常に三項演算子
// ステートメントが false ではなく true かどうかをテストします。
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh'；

// pre-increment/decrementをpost-increment/decrementより優先します。
// スタンドアロン文の場合。

// DO
--$a.

// DON'T
$a--; // しない
// 常に三項演算子
// ステートメントが false ではなく true かどうかをテストします。
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh'；

// pre-increment/decrementをpost-increment/decrementより優先します。
// スタンドアロン文の場合。

// DO
--$a.

// DON'T
$a--; // しない

総合データベース- データベース・コーディング・スタンダードは、データベース・クエリを実行し、SQLステートメントをフォーマットするための命令を提供します。
その他の推奨事項- その他の提案には、関数の引数に説明しやすいフラグ値を使う、賢いコード、クロージャ（無名関数）、正規表現、シェルコマンド、以下を避けるための指示などの基準が含まれます。extract().

WordPress PHPコードのインラインドキュメンテーション標準

上記のガイドラインに加え、WordPressではインラインドキュメンテーション規格. WordPress は、PHPDoc 構文からヒントを得たカスタムドキュメントアーキテクチャを使用しています。phpDocumentorメンテナンスされる PHP コードにはドキュメントが提供されます。これらの標準は外部ドキュメントの生成を簡素化し、コードベースの構造に関する共通の理解を促進することで、より広い WordPress 開発者コミュニティに貢献します。

图片[3]-WordPress 编码标准简介-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

WordPressのPHPドキュメントは、フォーマットされたブロックやインラインコメントとして表示されることがほとんどです。WordPress のファイルには、次のようなドキュメントを記述してください：

関数とクラスメソッド
クラス
プロパティと定数を含むクラス・メンバ
必要なもの
フック（操作用、フィルター用）
インラインコメント
ヘッダー
定数

WordPressにおけるHTMLとCSSの標準

WordPressのテーマとプラグインは厳格に従っています。HTMLコーディング標準。一貫性、アクセシビリティ、保守性を確保するためのものです。ガイドラインはセマンティックなマークアップを強調し、開発者がHTML要素を本来の目的に沿って使用することを奨励しています。このアプローチは、コンテンツの構造を強化し、検索エンジン最適化（SEO）のパフォーマンスを向上させます。

HTMLコード標準は、以下のガイダンスを提供しています：

バリデーションW3CバリデータすべてのHTMLページを検証し、マークアップが正しくフォーマットされていることを確認します。
自動閉鎖エレメント- 自閉要素内の前方スラッシュの前にはスペースを入れてください。


<!-- DO -->
<br />
<!-- DON'T –>
<br/>
<!-- DO -->
<br />

<!-- DON'T –>
<br/>
<!-- DO -->
<br />

<!-- DON'T –>
<br/>

属性とタグ -すべての属性とタグは小文字にすべきです。さらに、属性値は機械が解釈する場合のみ小文字にすべきです。人間のために書かれた場合、見出しは正しい大文字を使うべきです。


<!-- DO -->
<a href="http://example.com/" title="リンク説明">説明文</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<!-- DON'T -->
<a href="http://example.com/" title="リンク説明">ここをクリック</a>
<!-- DO -->
<a href="http://example.com/" title="リンク説明">説明文</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<!-- DON'T -->
<a href="http://example.com/" title="リンク説明">ここをクリック</a>
<!-- DO -->
<a href="http://example.com/" title="リンク説明">説明文</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<!-- DON'T -->
<a href="http://example.com/" title="リンク説明">ここをクリック</a>

転- すべての属性は値を持ち、一重引用符か二重引用符のどちらかを使用しなければなりません。これらの値を引用符で囲わないと、セキュリティ違反になる可能性があります。


<!-- DO -->
を入力してください。
 <!
<!-- しない -->
 <！
<!-- DO -->
を入力してください。
 <!

<!-- しない -->
 <！

を入力してください。
 <!


 <！

圧痕- HTML のインデントは、常に論理構造を反映したものでなければなりません。PHP と HTML を混在させる場合は、PHP ブロックを周囲の HTML コードに合わせてインデントします。


<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">見つかりません</h1>
    <div class="article-content">
        <p>結果は見つかりませんでした。</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>
<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">見つかりません</h1>
<div class="article-content">
<p>結果は見つかりませんでした。</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>
<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">見つかりません</h1>
    <div class="article-content">
        <p>結果は見つかりませんでした。</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>

<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">見つかりません</h1>
<div class="article-content">
<p>結果は見つかりませんでした。</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>
<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">見つかりません</h1>
    <div class="article-content">
        <p>結果は見つかりませんでした。</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>

<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">見つかりません</h1>
<div class="article-content">
<p>結果は見つかりませんでした。</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>

これらのHTML標準に加えてWordPressのCSS標準もは、クリーンでモジュール化されたレスポンシブなスタイルシートを作成するのに役立ちます。コアコードからテーマ、プラグインに至るまで、コラボレーションとレビューのベースラインを設定します。これらのガイドラインは、コードが読みやすく、一貫性があり、理にかなっていることを保証するのに役立ちます。

WordPress CSS Code Standardsは、要素を配置するために特定のクラスを使用することを強調し、一貫性のある整理された構造を促進します。具体的には、以下のような基準があります：

フレームワーク::


/* DO
各セレクタは、カンマまたは中括弧で終わる行に記述します。
各セレクタは、カンマまたは中括弧で終わる行に記述します。
閉じ中括弧は、開始セレクタと同じインデント・レベルを占めなければなりません。
閉じ中括弧は、始めのセレクタと同じインデントレベルを占めなければなりません。
#selector-2{を指定します。
    プロパティ: 値; }。
}
/* DO
各セレクタは、カンマまたは中括弧で終わる行に記述します。
各セレクタは、カンマまたは中括弧で終わる行に記述します。
閉じ中括弧は、開始セレクタと同じインデント・レベルを占めなければなりません。
閉じ中括弧は、始めのセレクタと同じインデントレベルを占めなければなりません。
#selector-2{を指定します。
    プロパティ: 値; }。
}
/* DO
各セレクタは、カンマまたは中括弧で終わる行に記述します。
各セレクタは、カンマまたは中括弧で終わる行に記述します。
閉じ中括弧は、開始セレクタと同じインデント・レベルを占めなければなりません。
閉じ中括弧は、始めのセレクタと同じインデントレベルを占めなければなりません。
#selector-2{を指定します。
    プロパティ: 値; }。
}

ピッカー::


/* DO
小文字を使用し、ハイフンで単語を区切ります。
属性セレクタの値は二重引用符で囲んでください。
div.container.などの修飾しすぎのセレクタは避けてください。
#contact-form {
    property: value; }.
}
input[type="text"] {
    property: value; } を指定します。
}
/* DO
小文字を使用し、ハイフンで単語を区切ります。
属性セレクタの値は二重引用符で囲んでください。
div.container.などの修飾しすぎのセレクタは避けてください。
#contact-form {
    property: value; }.
}
input[type="text"] {
    property: value; } を指定します。
}
/* DO
小文字を使用し、ハイフンで単語を区切ります。
属性セレクタの値は二重引用符で囲んでください。
div.container.などの修飾しすぎのセレクタは避けてください。
#contact-form {
    property: value; }.
}
input[type="text"] {
    property: value; } を指定します。
}

因果性(発注者と供給者の接頭辞）：


/* コロンとスペースでプロパティを追加します。
プロパティは小文字で、フォント名
また、省略記法を使用してください。
#selector {
    property: value; /* プロパティをコロンとスペースで追加します。
}
/* コロンとスペースでプロパティを追加します。
プロパティは小文字で、フォント名
また、省略記法を使用してください。
#selector {
    property: value; /* プロパティをコロンとスペースで追加します。
}
/* コロンとスペースでプロパティを追加します。
プロパティは小文字で、フォント名
また、省略記法を使用してください。
#selector {
    property: value; /* プロパティをコロンとスペースで追加します。
}

価値観::


/* 値の前にスペースを、値の後にセミコロンを追加します。
二重引用符を使用してください。
0 の値には単位を付けないでください。
小数値には先頭のゼロを使用します。
に対して複数のコンマ区切り値を指定します。
1つのプロパティに対して複数のカンマ区切り値をスペースまたは改行で区切ります。
#contact-form{（コンタクトフォーム
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }.
    
    box-shadow.
        0 0 0 1px #5b9dd9、
        0 0 0 2px 1px rgba(20, 120, 170, 0.9)；
}
/* 値の前にスペースを、値の後にセミコロンを追加します。
二重引用符を使用してください。
0 の値には単位を付けないでください。
小数値には先頭のゼロを使用します。
に対して複数のコンマ区切り値を指定します。
1つのプロパティに対して複数のカンマ区切り値をスペースまたは改行で区切ります。
#contact-form{（コンタクトフォーム
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }.
    
    box-shadow.
        0 0 0 1px #5b9dd9、
        0 0 0 2px 1px rgba(20, 120, 170, 0.9)；
}
/* 値の前にスペースを、値の後にセミコロンを追加します。
二重引用符を使用してください。
0 の値には単位を付けないでください。
小数値には先頭のゼロを使用します。
に対して複数のコンマ区切り値を指定します。
1つのプロパティに対して複数のカンマ区切り値をスペースまたは改行で区切ります。
#contact-form{（コンタクトフォーム
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }.
    
    box-shadow.
        0 0 0 1px #5b9dd9、
        0 0 0 2px 1px rgba(20, 120, 170, 0.9)；
}

メディアお問い合わせ::


/* メディアクエリに設定されたルールは、1階層分インデントされるべきです。
メディアクエリは、スタイルシートの一番下にメディアごとにグループ化しておきましょう。
media all and (max-width: 1024px) and (min-width: 780px) { @media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        property: value; }.
    }
}
/* メディアクエリに設定されたルールは、1階層分インデントされるべきです。
メディアクエリは、スタイルシートの一番下にメディアごとにグループ化しておきましょう。
media all and (max-width: 1024px) and (min-width: 780px) { @media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        property: value; }.
    }
}
/* メディアクエリに設定されたルールは、1階層分インデントされるべきです。
メディアクエリは、スタイルシートの一番下にメディアごとにグループ化しておきましょう。
media all and (max-width: 1024px) and (min-width: 780px) { @media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        property: value; }.
    }
}

图片[4]-WordPress 编码标准简介-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

2003年の設立以来、WordPressのHTMLとCSSのコーディング標準は、World Wide Web Consortium（W3C）のHTMLとCSSガイドラインに準拠しています。W3C標準は、レスポンシブデザインの原則とセマンティックマークアップの統合を重視しており、HTML5とCSS3のリリース以降、テーマとプラグインの開発に影響を与えています。

W3C ガイドラインを採用することで、WordPress サイトがグローバルなウェブ標準に準拠し、相互運用性とユーザーエクスペリエンスが向上します。

WordPressでこれらのガイドラインを遵守することは、以下のターゲットを絞ることの重要性を強調しています。W3C HTMLマークアップバリデータHTMLの品質検証を実行します。

これらのHTMLとCSSの標準は、WordPressのウェブサイトが視覚的に魅力的で、ユーザーフレンドリーであり、プラットフォーム間で効率的に表示されることを保証します。シームレスなユーザーエクスペリエンスをサポートし、WordPressエコシステムのさまざまな側面の開発者間のコラボレーションを促進します。

お問い合わせ
記事が読めない？無料でお答えします！個人サイト、中小企業サイトのための無料ヘルプ！
① 電話：020-2206-9892
② QQ咨询：1025174874
三 Eメール：info@361sale.com
④ 勤務時間: 月～金、9:30～18:30、祝日休み