Estándares de codificación de WordPress

Los estándares de codificación en el desarrollo de WordPress son esenciales para una base de código sólida y sostenible. Son directrices y convenciones que los desarrolladores siguen a la hora de escribir código, lo que ayuda a mejorar la colaboración, simplificar el mantenimiento y garantizar la fiabilidad general.

Además, los estándares de codificación evitan los errores más comunes y mejoran la calidad del código. En el desarrollo de WordPress, varios colaboradores suelen colaborar en un mismo proyecto, por lo que las normas de codificación son la base de un trabajo en equipo eficaz. Facilitan la comunicación, mitigan los posibles conflictos y ayudan a que el proceso de desarrollo sea más eficiente.

La adhesión a las normas de codificación fomenta la coherencia entre proyectos y facilita a los desarrolladores el cambio fluido entre bases de código. Esta coherencia se extiende a la legibilidad y mantenibilidad del código y fomenta un entendimiento común entre los miembros del equipo.

Las Normas Oficiales de Codificación de WordPress cubren cinco áreas clave de un proceso de desarrollo cohesivo y eficiente:

• PHP garantiza la coherencia del código del servidor
• HTML para fomentar el marcado estructurado y semántico
• JavaScript para una funcionalidad eficaz del lado del cliente
• CSS para métodos de estilo coherentes
• Garantizar que el producto final sea inclusivo y de fácil uso, accesible a personas con necesidades diversas.

Estándares PHP en el desarrollo de WordPress

Específico de WordPressNormas de codificación PHPEstas normas, que garantizan la coherencia y legibilidad del código de WordPress, son obligatorias para el núcleo de WordPress y muy recomendables para temas y plugins. Estas normas abarcan desde las convenciones de nomenclatura hasta la sangría y la estructura del código para mejorar la legibilidad y facilitar la colaboración.

Los estándares PHP de WordPress cubren las siguientes categorías:

• en términos generales- Estas normas incluyen: colocar las etiquetas PHP de apertura y cierre en una línea separada al incrustar fragmentos PHP de varias líneas en bloques de código HTML; evitar las etiquetas PHP abreviadas al utilizar comillas simples y dobles; y directrices para escribir sentencias include y require:

// Abrir y cerrar etiquetas PHP dentro de HTML.
// Coloca las etiquetas open/close en sus propias líneas.
## DO
function foo() {
  foo() { >DO function foo() { ?
  <div>
    <?php
    echo esc_html (
      bar (
        $param1,
        $param2
      )
    );
    ?>
  </div>
  <?php
}
## DON'T
if ( $x === $y ) { ?>
  <div>
    <!-- HTML content -->
  <?php }
// Abrir y cerrar etiquetas PHP dentro de HTML.
// Coloca las etiquetas open/close en sus propias líneas.

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

## DON'T
if ( $x === $y ) { ?>
  <div>
    <!-- HTML content -->
  <?php }
// Abrir y cerrar etiquetas PHP dentro de HTML.
// Coloca las etiquetas open/close en sus propias líneas.

## DO
function 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 }

// Evite las etiquetas PHP abreviadas
## DO
## NO
No sé qué decir.
// Evite las etiquetas PHP abreviadas

## DO



## NO
No sé qué decir.
// Evite las etiquetas PHP abreviadas

## DO



## NO
No sé qué decir.

// Escribir sentencias include/require.
// Evite include_once ya que continúa la ejecución
// incluso si no se encuentra el archivo.
// No utilice paréntesis alrededor de la ruta del archivo.
## DO
require_once ABSPATH . 'nombre-archivo.php'
## NO HACER
require_once __DIR__ . /nombre-archivo.php
include_once ( ABSPATH . 'nombre-de-archivo.php' );
// Escribir sentencias include/require.
// Evite include_once ya que continúa la ejecución
// incluso si no se encuentra el archivo.
// No utilice paréntesis alrededor de la ruta del archivo.

## DO
require_once ABSPATH . 'nombre-archivo.php'

## NO HACER
require_once __DIR__ . /nombre-archivo.php
include_once ( ABSPATH . 'nombre-de-archivo.php' );
// Escribir sentencias include/require.
// Evite include_once ya que continúa la ejecución
// incluso si no se encuentra el archivo.
// No utilice paréntesis alrededor de la ruta del archivo.

## DO
require_once ABSPATH . 'nombre-archivo.php'

## NO HACER
require_once __DIR__ . /nombre-archivo.php
include_once ( ABSPATH . 'nombre-de-archivo.php' );

christen-Las normas de denominación incluyen convenciones de denominación e interpolación de ganchos dinámicos de denominación:

## DO
// Usa minúsculas para los nombres de funciones y variables.
function mi_funcion( $al_variable ) {}
// Utilice mayúsculas para los nombres de las constantes.
Define('MAX_AGE', 60);
## NO
// Usa camelCase.
function miFuncion( $alVariable ) {}
## DO
// Usa minúsculas para los nombres de funciones y variables.
function mi_funcion( $al_variable ) {}

// Utilice mayúsculas para los nombres de las constantes.
Define('MAX_AGE', 60);

## NO
// Usa camelCase.
function miFuncion( $alVariable ) {}
## DO
// Usa minúsculas para los nombres de funciones y variables.
function mi_funcion( $al_variable ) {}

// Utilice mayúsculas para los nombres de las constantes.
Define('MAX_AGE', 60);

## NO
// Usa camelCase.
function miFuncion( $alVariable ) {}

void- La norma sobre espacios en blanco establece directrices para el uso de espacios, la sangría y la eliminación de espacios finales. (Para iniciar una animada discusión entre desarrolladores, basta con preguntarles si prefieren tabuladores o espacios a la hora de sangrar el código. Independientemente de las preferencias, la recomendación oficial de los desarrolladores de WordPress es utilizar tabuladores y, además de para PHP, también para JavaScript y CSS. (Así que tenlo en cuenta cuando trabajes en proyectos colaborativos).

## DO
// Pon espacios después de las comas.
$colors = ['rojo', 'verde', 'azul'].
// Pon espacios a ambos lados de los corchetes de apertura y
// Pon espacios a ambos lados de los corchetes de apertura y cierre de las estructuras de control.
foreach( $foo as $bar ) { ...
// Definir una función: function mi_funcion() { .
function mi_funcion() { ...
¡// Comparaciones lógicas: if ( !
¡si ( ! $foo ) { ...
// Acceso a los elementos de la matriz: $a = $foo['bar'] { ...
$a = $foo['bar']
$a = $foo[ $bar ]
## NO
$colors = ['rojo','verde','azul']
foreach($foo as $bar){ ...
function mi_funcion(){ ...
if (!$foo) { ...
$a = $foo[ 'barra']
$a = $foo[$bar]
## DO
// Pon espacios después de las comas.
$colors = ['rojo', 'verde', 'azul'].

// Pon espacios a ambos lados de los corchetes de apertura y
// Pon espacios a ambos lados de los corchetes de apertura y cierre de las estructuras de control.
foreach( $foo as $bar ) { ...

// Definir una función: function mi_funcion() { .
function mi_funcion() { ...

¡// Comparaciones lógicas: if ( !
¡si ( ! $foo ) { ...

// Acceso a los elementos de la matriz: $a = $foo['bar'] { ...
$a = $foo['bar']
$a = $foo[ $bar ]

## NO
$colors = ['rojo','verde','azul']
foreach($foo as $bar){ ...
function mi_funcion(){ ...
if (!$foo) { ...
$a = $foo[ 'barra']
$a = $foo[$bar]
## DO
// Pon espacios después de las comas.
$colors = ['rojo', 'verde', 'azul'].

// Pon espacios a ambos lados de los corchetes de apertura y
// Pon espacios a ambos lados de los corchetes de apertura y cierre de las estructuras de control.
foreach( $foo as $bar ) { ...

// Definir una función: function mi_funcion() { .
function mi_funcion() { ...

¡// Comparaciones lógicas: if ( !
¡si ( ! $foo ) { ...

// Acceso a los elementos de la matriz: $a = $foo['bar'] { ...
$a = $foo['bar']
$a = $foo[ $bar ]

## NO
$colors = ['rojo','verde','azul']
foreach($foo as $bar){ ...
function mi_funcion(){ ...
if (!$foo) { ...
$a = $foo[ 'barra']
$a = $foo[$bar]

formato- Los estándares de formato para el desarrollo PHP en WordPress incluyen estilos de corchetes, declaraciones de arrays, directrices para llamadas a funciones multilínea, declaraciones de tipos, constantes mágicas y operadores de expansión:

// DO
// Utiliza el siguiente estilo de llaves.
if ( condition ) {
    action(); } elseif ( condition2 ) {
} elseif ( condition2 ) {
    action2(); } elseif ( condition2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}
// Declara arrays usando la sintaxis long.
$numbers_long = array(1, 2, 3, 4, 5); // En llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
/* En las llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
Los valores de los parámetros multilínea deben asignarse a una variable y ésta debe pasarse a la llamada a la función */
$data = array(
    
    
    
).
$greeting_message = sprintf(
    /* función de traducción. %s corresponde al nombre del usuario */
    __( '¡Hola, %s!', 'yourtextdomain' ),
    $data['nombre_usuario']].
);
$result = some_function (
    $data,
    $greeting_message, $data('nombre_usuario') ); $result = some_function (
    /* función de traducción %s a nombre de ciudad*/
    sprintf( __('Usuario reside en %s.' ), 'Cityville' )
);
// Las constantes mágicas deben ir en mayúsculas.
// La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( my_action, array( __CLASS__, my_method ) ); // La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ); add_action( mi_acción, array( __CLASS__, mi_método ); add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ).
/* Añade un espacio o una nueva línea con la sangría
   apropiada antes de un operador de propagación.
   Debería haber.
   /* Añadir un espacio o una nueva línea con la sangría adecuada antes de un operador de dispersión.
     No debe haber espacio entre el operador de dispersión y la variable/función a la que se aplica.
   * Ningún espacio entre el spread y la referencia.
     Sin espacio entre el operador de dispersión y el de referencia cuando se combinan.
*/Sin espacio entre los operadores de dispersión y referencia cuando se combinan.
//DO
function some_func( &. .$arg1 ) {
    bar( ... .$arg2 );
    bar(
        array( ... .$arg3 ), .
        ... .array_values( $array_vals )
    );
}
//DONT
function some_func( & ...  $arg1 ) {
    bar(...
        $arg2 );
    bar(
        array( ... .$arg3 ),... .array_values( $array_vals )
    );
}
// DO
// Utiliza el siguiente estilo de llaves.
if ( condition ) {
    action(); } elseif ( condition2 ) {
} elseif ( condition2 ) {
    action2(); } elseif ( condition2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}

// Declara arrays usando la sintaxis long.
$numbers_long = array(1, 2, 3, 4, 5); // En llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
/* En las llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
Los valores de los parámetros multilínea deben asignarse a una variable y ésta debe pasarse a la llamada a la función */
$data = array(
    
    
    
).
$greeting_message = sprintf(
    /* función de traducción. %s corresponde al nombre del usuario */
    __( '¡Hola, %s!', 'yourtextdomain' ),
    $data['nombre_usuario']].
);
$result = some_function (
    $data,
    $greeting_message, $data('nombre_usuario') ); $result = some_function (
    /* función de traducción %s a nombre de ciudad*/
    sprintf( __('Usuario reside en %s.' ), 'Cityville' )
);

// Las constantes mágicas deben ir en mayúsculas.
// La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( my_action, array( __CLASS__, my_method ) ); // La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ); add_action( mi_acción, array( __CLASS__, mi_método ); add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ).

/* Añade un espacio o una nueva línea con la sangría
   apropiada antes de un operador de propagación.

   Debería haber.

   /* Añadir un espacio o una nueva línea con la sangría adecuada antes de un operador de dispersión.
     No debe haber espacio entre el operador de dispersión y la variable/función a la que se aplica.

   * Ningún espacio entre el spread y la referencia.
     Sin espacio entre el operador de dispersión y el de referencia cuando se combinan.
*/Sin espacio entre los operadores de dispersión y referencia cuando se combinan.

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

//DONT
function some_func( & ...  $arg1 ) {
    bar(...
        $arg2 );
    bar(
        array( ... .$arg3 ),... .array_values( $array_vals )
    );
}
// DO
// Utiliza el siguiente estilo de llaves.
if ( condition ) {
    action(); } elseif ( condition2 ) {
} elseif ( condition2 ) {
    action2(); } elseif ( condition2 ) { action2()
} else {
    default_action(); } elseif ( condition2 ) { action2(); } else { default_action()
}

// Declara arrays usando la sintaxis long.
$numbers_long = array(1, 2, 3, 4, 5); // En llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
/* En las llamadas a funciones multilínea, cada parámetro debe ocupar sólo una línea.
Los valores de los parámetros multilínea deben asignarse a una variable y ésta debe pasarse a la llamada a la función */
$data = array(
    
    
    
).
$greeting_message = sprintf(
    /* función de traducción. %s corresponde al nombre del usuario */
    __( '¡Hola, %s!', 'yourtextdomain' ),
    $data['nombre_usuario']].
);
$result = some_function (
    $data,
    $greeting_message, $data('nombre_usuario') ); $result = some_function (
    /* función de traducción %s a nombre de ciudad*/
    sprintf( __('Usuario reside en %s.' ), 'Cityville' )
);

// Las constantes mágicas deben ir en mayúsculas.
// La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( my_action, array( __CLASS__, my_method ) ); // La constante ::class debe ir en minúsculas sin espacios alrededor del operador de resolución de ámbito (::).
add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ); add_action( mi_acción, array( __CLASS__, mi_método ); add_action( mi_acción, array( Mi_Clase::clase, mi_método ) ).

/* Añade un espacio o una nueva línea con la sangría
   apropiada antes de un operador de propagación.

   Debería haber.

   /* Añadir un espacio o una nueva línea con la sangría adecuada antes de un operador de dispersión.
     No debe haber espacio entre el operador de dispersión y la variable/función a la que se aplica.

   * Ningún espacio entre el spread y la referencia.
     Sin espacio entre el operador de dispersión y el de referencia cuando se combinan.
*/Sin espacio entre los operadores de dispersión y referencia cuando se combinan.

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

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

Declaraciones, espacios de nombres y declaraciones de importación- Estas normas de codificación abarcan las declaraciones de espacios de nombres yutiliceDeclaraciones:

// Cada declaración de espacio de nombres debe contener
// palabras en mayúsculas separadas por guiones bajos.
namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades; namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades.
// Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.
// para evitar colisiones de nombres.
use Project_NameFeatureClass_C as Aliased_Class_C; // Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.
// Cada declaración de espacio de nombres debe contener
// palabras en mayúsculas separadas por guiones bajos.
namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades; namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades.

// Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.
// para evitar colisiones de nombres.
use Project_NameFeatureClass_C as Aliased_Class_C; // Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.
// Cada declaración de espacio de nombres debe contener
// palabras en mayúsculas separadas por guiones bajos.
namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades; namespace Mi_EmpresaProyectoKinsta_ProyectoUtilidades.

// Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.
// para evitar colisiones de nombres.
use Project_NameFeatureClass_C as Aliased_Class_C; // Las declaraciones de uso de importación pueden utilizar alias // para evitar colisiones de nombres.

programación orientada a objetos (POO) - Estas normas incluyen el uso de una única estructura de objetos por documento, la provisión de acceso a las características y el uso de las características "C" y "D".utiliceuna guía para garantizar que siempre se declare la visibilidad, una descripción general del orden de la visibilidad y los modificadores, y una descripción general de las reglas para la instanciación de objetos:

// Las declaraciones de uso de rasgos deben estar en la parte superior de una clase.
// El uso de rasgos debe tener al menos una línea antes y después // de la primera y última declaración.
// la primera y la última declaración.
// Declarar siempre la visibilidad.
clase Foo {
    use Bar_Trait; public $baz = Bar_Trait
    public $baz = true; ...
    ...
}
// Utilice siempre paréntesis al instanciar un nuevo
// instancia de objeto.
// No añadas espacio entre el nombre de la clase y el paréntesis de apertura.
$foo = new Foo(); // No añadas espacio entre el nombre de la clase y el paréntesis de apertura.
// Las declaraciones de uso de rasgos deben estar en la parte superior de una clase.
// El uso de rasgos debe tener al menos una línea antes y después // de la primera y última declaración.
// la primera y la última declaración.
// Declarar siempre la visibilidad.
clase Foo {
    use Bar_Trait; public $baz = Bar_Trait
    public $baz = true; ...
    ...
}

// Utilice siempre paréntesis al instanciar un nuevo
// instancia de objeto.
// No añadas espacio entre el nombre de la clase y el paréntesis de apertura.
$foo = new Foo(); // No añadas espacio entre el nombre de la clase y el paréntesis de apertura.
// Las declaraciones de uso de rasgos deben estar en la parte superior de una clase.
// El uso de rasgos debe tener al menos una línea antes y después // de la primera y última declaración.
// la primera y la última declaración.
// Declarar siempre la visibilidad.
clase Foo {
    use Bar_Trait; public $baz = Bar_Trait
    public $baz = true; ...
    ...
}

// Utilice siempre paréntesis al instanciar un nuevo
// instancia de objeto.
// No añadas espacio entre el nombre de la clase y el paréntesis de apertura.
$foo = new Foo(); // No añadas espacio entre el nombre de la clase y el paréntesis de apertura.

estructura de control- La estructura de control incluye el uso de elseifnosi noy Criterios Condicionales Yoda. Declaración Yoda: Cuando mezcle variables con constantes, literales o llamadas a funciones en comparaciones lógicas, coloque las variables a la derecha para evitar asignaciones accidentales, como se muestra a continuación:

// Una comparación "legal": if ( true === $result ) {
if ( true === $result ) {
    // Hacer algo con $resultado
}
// Pero un error tipográfico como éste podría escapársele: if ( $result = true ) { // Haga algo con $result }
if ( $result = true ) { // Haz algo con $result } // Pero una errata como esta podría pasarte.
    // Siempre acabaremos aquí
// Una comparación "legal": if ( true === $result ) {
if ( true === $result ) {
    // Hacer algo con $resultado
}

// Pero un error tipográfico como éste podría escapársele: if ( $result = true ) { // Haga algo con $result }
if ( $result = true ) { // Haz algo con $result } // Pero una errata como esta podría pasarte.
    // Siempre acabaremos aquí
// Una comparación "legal": if ( true === $result ) {
if ( true === $result ) {
    // Hacer algo con $resultado
}

// Pero un error tipográfico como éste podría escapársele: if ( $result = true ) { // Haga algo con $result }
if ( $result = true ) { // Haz algo con $result } // Pero una errata como esta podría pasarte.
    // Siempre acabaremos aquí

operador (informática)- Estas normas abarcan los operadores ternarios, los operadores de control de errores ( @) y los operadores de incremento/decremento:

// Siempre tienen operadores ternarios
// prueba si la declaración es verdadera, no falsa.
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh';
// Favorecer pre-incremento/decremento sobre post-incremento/decremento.
// para sentencias independientes.
// DO
--$a.
// NO
$a--; // NO
// Siempre tienen operadores ternarios
// prueba si la declaración es verdadera, no falsa.
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh';

// Favorecer pre-incremento/decremento sobre post-incremento/decremento.
// para sentencias independientes.

// DO
--$a.

// NO
$a--; // NO
// Siempre tienen operadores ternarios
// prueba si la declaración es verdadera, no falsa.
$programming_language = ( 'PHP' === $language ) ? 'cool' : 'meh';

// Favorecer pre-incremento/decremento sobre post-incremento/decremento.
// para sentencias independientes.

// DO
--$a.

// NO
$a--; // NO

• base de datos exhaustiva- El estándar de codificación de bases de datos proporciona instrucciones para ejecutar consultas a bases de datos y formatear sentencias SQL.
• Otras recomendaciones- Otras sugerencias incluyen normas como el uso de valores de bandera autoexplicativos para los argumentos de las funciones, código inteligente, cierres (funciones anónimas), expresiones regulares, comandos de shell e instrucciones para evitarextraer().

Estándar de documentación en línea de WordPress para código PHP

Además de las directrices anteriores, WordPress también proporciona código PHP para la funciónNorma de documentación en línea. WordPress utiliza una arquitectura de documentos personalizados que se inspira en la sintaxis PHPDoc, un estándar en evolución para crear documentos personalizados paraphpDocumentorSe proporciona documentación para el código PHP que se mantiene. Estos estándares simplifican la generación de documentación externa y contribuyen a la comunidad de desarrolladores de WordPress en general al promover una comprensión común de la estructura de la base de código.

La documentación PHP en WordPress se muestra principalmente como bloques formateados o comentarios en línea. Documente lo siguiente en sus archivos de WordPress:

• Funciones y métodos de clase
• Clases
• Miembros de la clase, incluidas propiedades y constantes
• Requiere y contiene
• Ganchos (funcionamiento y filtro)
• Comentarios en línea
• cabecera
• una constante (matemática)

Estándares HTML y CSS en WordPress

Los temas y plugins de WordPress se rigen porNormas de codificación HTML.para garantizar la coherencia, accesibilidad y facilidad de mantenimiento. Las directrices hacen hincapié en el marcado semántico y animan a los desarrolladores a utilizar los elementos HTML para los fines previstos. Este enfoque refuerza la estructura de los contenidos y mejora el rendimiento de la optimización para motores de búsqueda (SEO).

La norma de código HTML ofrece orientación sobre lo siguiente:

• Validación - debe basarse en laValidador del W3CValide todas las páginas HTML para asegurarse de que el marcado está formateado correctamente.
• Elemento de autocierre- Una barra oblicua en un elemento de autocierre debe ir precedida de un espacio.

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

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

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

Atributos y etiquetas -Todos los atributos y etiquetas deben ir en minúsculas. Además, los valores de los atributos deben ir en minúsculas sólo cuando los interprete una máquina. Si se escribe para humanos, debe utilizarse la mayúscula correcta en los títulos.

<!-- DO -->
<a href="http://example.com/" title="Descripción del enlace">Texto descriptivo</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<!-- DON'T -->
<a href="http://example.com/" title="descripción del enlace">Pulse aquí</a>
<!-- DO -->
<a href="http://example.com/" title="Descripción del enlace">Texto descriptivo</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<!-- DON'T -->
<a href="http://example.com/" title="descripción del enlace">Pulse aquí</a>
<!-- DO -->
<a href="http://example.com/" title="Descripción del enlace">Texto descriptivo</a>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<!-- DON'T -->
<a href="http://example.com/" title="descripción del enlace">Pulse aquí</a>

coma invertida (punct.)- Todos los atributos deben tener un valor y deben utilizar comillas simples o dobles. No entrecomillar estos valores puede dar lugar a una violación de la seguridad.

¡
¡
¡ <!
¡



¡
¡ <!
¡



¡
¡ <!

sangrías- La sangría HTML debe reflejar siempre la estructura lógica. Al mezclar PHP y HTML, sangrar los bloques PHP para que coincidan con el código HTML circundante.

<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">No se ha encontrado</h1>
    <div class="article-content">
        <p>No se han encontrado resultados.</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>
<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">No se ha encontrado</h1>
<div class="article-content">
<p>No se han encontrado resultados.</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>
<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">No se ha encontrado</h1>
    <div class="article-content">
        <p>No se han encontrado resultados.</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>

<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">No se ha encontrado</h1>
<div class="article-content">
<p>No se han encontrado resultados.</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>
<!-- DO -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
    <h1 class="article-title">No se ha encontrado</h1>
    <div class="article-content">
        <p>No se han encontrado resultados.</p>
        <?php get_error_msg(); ?>
    </div>
</div>
<?php endif; ?>

<!-- DON'T -->
<?php if ( ! have_articles() ) : ?>
<div class="article">
<h1 class="article-title">No se ha encontrado</h1>
<div class="article-content">
<p>No se han encontrado resultados.</p>
<?php get_error_msg(); ?>
</div>
</div>
<?php endif; ?>

Además de estas normas HTMLEl estándar CSS de WordPress tambiénpueden ayudar a crear hojas de estilo limpias, modulares y con capacidad de respuesta. Establecen una línea de base para la colaboración y la revisión desde el código central hasta los temas y los plugins. Estas directrices ayudan a garantizar que el código sea legible, coherente y tenga sentido.

Las normas del código CSS de WordPress hacen hincapié en el uso de clases específicas para posicionar los elementos, promoviendo así una estructura coherente y organizada. En concreto, describen las siguientes normas:

marco::

/* DO
Cada selector debe estar en su propia línea terminando con
Cada selector debe estar en su propia línea terminando con una coma o una llave.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
#selector-2 {
    propiedad: valor; }
}
/* DO
Cada selector debe estar en su propia línea terminando con
Cada selector debe estar en su propia línea terminando con una coma o una llave.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
#selector-2 {
    propiedad: valor; }
}
/* DO
Cada selector debe estar en su propia línea terminando con
Cada selector debe estar en su propia línea terminando con una coma o una llave.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
La llave de cierre debe ocupar el mismo nivel de sangría que el selector de apertura.
#selector-2 {
    propiedad: valor; }
}

recolector::

/* DO
Utilice minúsculas y separe las palabras con guiones.
Utilice comillas dobles entre los valores de los selectores de atributos.
Evite selectores sobrecualificados, como div. container */
#contact-form {
    propiedad: valor; }
}
input[type="text"] {
    propiedad: value; }
}
/* DO
Utilice minúsculas y separe las palabras con guiones.
Utilice comillas dobles entre los valores de los selectores de atributos.
Evite selectores sobrecualificados, como div. container */
#contact-form {
    propiedad: valor; }
}
input[type="text"] {
    propiedad: value; }
}
/* DO
Utilice minúsculas y separe las palabras con guiones.
Utilice comillas dobles entre los valores de los selectores de atributos.
Evite selectores sobrecualificados, como div. container */
#contact-form {
    propiedad: valor; }
}
input[type="text"] {
    propiedad: value; }
}

causalidad(prefijos de pedidos y proveedores):

/* Añada a las propiedades dos puntos y un espacio.
Las propiedades deben estar en minúsculas - excepto los nombres de fuentes
s y propiedades específicas del proveedor - y utilizar la taquigrafía. */
#selector {
    property: value; /* Anexa las propiedades con dos puntos y un espacio.
}
/* Añada a las propiedades dos puntos y un espacio.
Las propiedades deben estar en minúsculas - excepto los nombres de fuentes
s y propiedades específicas del proveedor - y utilizar la taquigrafía. */
#selector {
    property: value; /* Anexa las propiedades con dos puntos y un espacio.
}
/* Añada a las propiedades dos puntos y un espacio.
Las propiedades deben estar en minúsculas - excepto los nombres de fuentes
s y propiedades específicas del proveedor - y utilizar la taquigrafía. */
#selector {
    property: value; /* Anexa las propiedades con dos puntos y un espacio.
}

fig. valores (éticos, culturales, etc.)::

/* Añade un espacio antes del valor y un punto y coma después.
Utilice comillas dobles.
Los valores 0 no deben tener unidades.
Utilice un cero inicial para los valores decimales.
Delinear múltiples valores separados por comas para
Delimite varios valores separados por comas para una misma propiedad con un espacio o una nueva línea.
#contact-form {
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }
    
    box-shadow.
        0 0 0 0 1px #5b9dd9,
        0 0 0 2px 1px rgba(20, 120, 170, 0.9);
}
/* Añade un espacio antes del valor y un punto y coma después.
Utilice comillas dobles.
Los valores 0 no deben tener unidades.
Utilice un cero inicial para los valores decimales.
Delinear múltiples valores separados por comas para
Delimite varios valores separados por comas para una misma propiedad con un espacio o una nueva línea.
#contact-form {
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }
    
    box-shadow.
        0 0 0 0 1px #5b9dd9,
        0 0 0 2px 1px rgba(20, 120, 170, 0.9);
}
/* Añade un espacio antes del valor y un punto y coma después.
Utilice comillas dobles.
Los valores 0 no deben tener unidades.
Utilice un cero inicial para los valores decimales.
Delinear múltiples valores separados por comas para
Delimite varios valores separados por comas para una misma propiedad con un espacio o una nueva línea.
#contact-form {
    font-family: "Helvetica Neue", sans-serif; opacity: 0.9; }
    
    box-shadow.
        0 0 0 0 1px #5b9dd9,
        0 0 0 2px 1px rgba(20, 120, 170, 0.9);
}

Solicitud de información::

/* Las reglas establecidas para las consultas de medios deben tener una sangría de un nivel.
Mantenga las consultas de medios agrupadas por medios en la parte inferior de la hoja de estilos. */
@media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        propiedad: value; }
    }
}
/* Las reglas establecidas para las consultas de medios deben tener una sangría de un nivel.
Mantenga las consultas de medios agrupadas por medios en la parte inferior de la hoja de estilos. */
@media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        propiedad: value; }
    }
}
/* Las reglas establecidas para las consultas de medios deben tener una sangría de un nivel.
Mantenga las consultas de medios agrupadas por medios en la parte inferior de la hoja de estilos. */
@media all and (max-width: 1024px) and (min-width: 780px) {
    $selector {
        propiedad: value; }
    }
}

Desde su creación en 2003, los estándares de codificación HTML y CSS de WordPress se han alineado con las directrices HTML y CSS del World Wide Web Consortium (W3C), que hacen hincapié en la integración de los principios del diseño adaptativo y el marcado semántico, y han influido en el desarrollo de temas y plugins desde la publicación de HTML5 y CSS3.

La adopción de las directrices del W3C garantiza que los sitios de WordPress se adhieran a los estándares web mundiales, mejora la interoperabilidad y la experiencia del usuario, y refleja el compromiso de mantenerse actualizado, seguro y compatible dentro del ecosistema web más amplio.

El cumplimiento de estas directrices en WordPress subraya la importancia de centrarse en el público objetivo.Validador de marcado HTML del W3CRealizar la validación de la calidad HTML.

Estos estándares HTML y CSS garantizan que los sitios web de WordPress sean visualmente atractivos, fáciles de usar y se presenten de forma eficiente en todas las plataformas. Permiten una experiencia de usuario fluida y facilitan la colaboración entre desarrolladores de distintos aspectos del ecosistema de WordPress.