Consejos para las mejores prácticas en el desarrollo de WordPress

En esta serie, cubriremos las cosas más importantes que debe considerar al desarrollar un complemento de WordPress o un tema de WordPress.. 

Esta guía tiene como objetivo proporcionar un conjunto de buenas prácticas que serán útiles para los principiantes y también para los desarrolladores expertos que están empezando a trabajar con WordPress.

¡Pero espera! Si ha estado desarrollando complementos de WordPress por un tiempo, eche un vistazo antes de decidir que esta guía no es para usted. Estoy seguro de que obtendrá alguna cosa de eso Después de todo, todos tenemos algo único que ofrecer..

La mayoría de las explicaciones de esta serie ya existen en el Codex, pero sé que contiene tanta información que puede ser difícil saber por dónde empezar..

Hoy estamos cubriendo los siguientes temas:

  1. Los estándares de codificación de WordPress
  2. Evitar colisiones de nombres de funciones
  3. Comentarios del código
  4. Consejos de seguridad

La serie pretende ser lo más clara posible e incluirá ejemplos tanto buenos como básicos para dar una idea de cómo ciertas cosas debería trabajar al escribir código específico de WordPress.

Tenga en cuenta que no todo es obligatorio para escribir un complemento; Sin embargo, si recién está comenzando, ¿por qué no empezar con el pie derecho??

Intentaré hacer estas series fáciles de leer. Incluiré algunos ejemplos de códigos buenos y malos. No todo lo que se explica aquí es obligatorio para escribir un complemento, pero si está comenzando con el desarrollo de Wordpress, ¿por qué no comenzar de la manera correcta? Una vez que se convierta en un hábito será difícil hacerlo mal..

Normas de codificación de WordPress

Personalmente, este es uno de mis defectos más grandes cuando desarrollo complementos. Si desarrolla herramientas para WordPress, simplemente debe seguir los estándares de codificación de WordPress. Los estándares de codificación ayudan a mejorar la legibilidad del código.yAyuda a evitar errores comunes de codificación.. 

WordPress es un CMS colaborativo y es algo muy simple, ya que todos los que escriben códigos de la misma manera hacen que leer, escribir y mantener el código sea más fácil para todos. Al principio, puede ser difícil cambiar el estilo de codificación con el que está acostumbrado a trabajar, pero eventualmente encontrará que se convertirá en una segunda naturaleza y su código será más limpio y mucho más fácil de leer..

En el Manual de WordPress los estándares se dividen en los cuatro idiomas principales utilizados

  1. Estándares de codificación CSS
  2. Estándares de codificación HTML
  3. Estándares de codificación de JavaScript
  4. Estándares de Codificación PHP

Ejemplos

A continuación, te mostraré algunos ejemplos simples de estilo PHP, para que puedas tener una idea..

Malos ejemplos

if (condicion) action0 ($ var); if (condición) acción1 ();  elseif (condition2) action2a (); action2b (); 

Buenos ejemplos

if (condición) acción0 ($ var);  if (condición) acción1 ();  elseif (condition2) action2a (); action2b (); 

El segundo ejemplo es mucho más fácil de leer, ¿no? El Manual de Normas de Codificación está lleno de ejemplos que lo ayudarán a hacer su código más limpio. Es fácil sorprenderse de cómo algo tan simple como unos pocos espacios y pestañas pueden mejorar la legibilidad de su código.

Mientras escribía este artículo, compré un tema para un cliente y cuando fui a editar un código me sorprendió lo difícil que era hacerlo.. 

Esto es lo que quiero decir:

 
>
"title =""> ';?> '; foreach ($ categories como $ tag) $ tag_link = get_category_link ($ tag-> term_id); $ titleColor = categorys_title_color ($ tag-> term_id, "category", false); echo ''. $ tag-> nombre. ''; eco "";?>

Un poco de miedo, ¿verdad? Después de unos minutos de trabajar con este código, envié un correo electrónico al autor con un enlace al Libro de normas de codificación..

Evitar colisiones de nombres de funciones

Las colisiones de nombres se producen cuando una función tiene el mismo nombre que una función que ya se ha definido. Por ejemplo, si en tu tema tienes una función llamada get_the_post_terms () e instala un complemento que tiene una función con el mismo nombre que obtendrá algo como:

Error grave: no se puede volver a declarar get_the_post_terms () (declarado anteriormente en ... 

Desafortunadamente, ocurren mucho más frecuentemente de lo que deberían. La cosa es que es fácil de evitar..

Para evitar esto tenemos opciones:

1. Prefijo tus funciones

Por ejemplo, si el nombre de su complemento es "WordPress Cool Plugin", podría usar un wcc_ Prefijo en todas tus funciones.. 

Así que en el ejemplo anterior nuestro nombre de función será wcc_get_the_post_terms ()

También te recomiendo prefijar tu CSS, o al menos tratar de hacerlo más único para evitar modificar otros estilos de complementos

2. Envuelve tus funciones dentro de una clase

Tal vez su complemento sea tan simple que no necesita una clase, pero aún puede crear uno para mantener las cosas organizadas. Particularmente me gusta usar el patrón de singleton pero revise el siguiente ejemplo para una clase simple con un método estático.

clase Wcc_Mailer función estática enviar ($ post_ID) $ friends = '[email protected]'; correo ($ amigos, "¡Nueva publicación!", 'Comprobar mi nueva publicación en'. get_permalink ($ post_ID)); devuelve $ post_ID;  add_action ('publish_post', array ('Wcc_Mailer', 'send'));

Como puede ver en este ejemplo, yo solo prefijo el nombre de mi clase, pero mi función es simple llamada "enviar". Este nombre de método ahora está protegido del espacio de nombres global y no se puede llamar directamente. Para llamarlo necesitaré hacer esto:

Wcc_Mailer :: send ($ post_id);

Código de comentarios

Los comentarios de Code son los mejores amigos del desarrollador. Puede que no sea necesario comentar cada función o variable que cree, pero confíe en mí cuando crezca su código, especialmente cuando recibió contribuciones de otros, puede ser difícil saber exactamente qué hacer..

También como dije antes, WordPress es un CMS colaborativo. Muchos desarrolladores verán tu código y, con un poco de ayuda, irán por el camino correcto.

Personalmente uso la sintaxis de PHPDoc para comentar mis funciones y con Sublime + Docblockr es muy fácil hacerlo.. 

Veamos cómo comentan los chicos de WordPress. wp_mail () función ubicada en wp-includes / pluggable.php

/ ** * Enviar correo, similar al correo de PHP * * Un verdadero valor de retorno no significa automáticamente que el usuario recibió el * correo electrónico correctamente. Solo significa que el método utilizado pudo * procesar la solicitud sin errores. * * Usar los dos ganchos 'wp_mail_from' y 'wp_mail_from_name' permite desde * crear una dirección de origen como 'Nombre 'cuando ambos están establecidos. Si se configura * solo 'wp_mail_from', solo la dirección de correo electrónico se usará sin * nombre. * * El tipo de contenido predeterminado es 'text / plain' que no permite el uso de HTML. * Sin embargo, puede establecer el tipo de contenido del correo electrónico utilizando el filtro * 'wp_mail_content_type'. * * El conjunto de caracteres predeterminado se basa en el conjunto de caracteres utilizado en el blog. El conjunto de caracteres se puede configurar utilizando el filtro 'wp_mail_charset'. * * @since 1.2.1 * * @uses PHPMailer * * @param string | array $ to Array o lista de direcciones de correo electrónico separadas por comas para enviar mensajes. * @param string $ subject Asunto del correo electrónico * @param string $ message Contenido del mensaje * @param string | array $ headers Opcional. Cabeceras adicionales. * @param string | array $ attachments Opcional. Archivos para adjuntar. * @return bool Si los contenidos del correo electrónico se enviaron correctamente. * / function wp_mail ($ to, $ subject, $ message, $ headers = ", $ attachments = array ()) […] // Send! try return $ phpmailer-> Send (); catch (phpmailerException $ e) devolver falso;

Como puede ver, describen qué hace la función, qué parámetros son necesarios y qué devolverá. 

Bastante autoexplicativo, a la derecha?

Los comentarios no están destinados a ser utilizados sólo con PHP. En HTML, por ejemplo, me gusta usar al final de grandes bloques de código, así no me pierdo tan fácilmente.

Para CSS, uso comentarios para dividir mi código en diferentes secciones. 

Por ejemplo :

/ ********************* ESTILOS GENERALES ********************* / body font- familia: arial; color: # 333;  / ************************************************ ****************** H1, H2, H3, H4, H5 ESTILOS ********************** ******************************************** / h1, .h1  tamaño de fuente: 2.5em; línea-altura: 1em; familia de fuentes: $ vag-bold;  / ********************* ESTILOS DE NAVEGACIÓN ********************* / nav color :rojo  [… ]

Comparte tus trucos de comentarios con nosotros.!

Consejos de seguridad

La seguridad debe tomarse muy en serio! Si tu plugin o tema se vuelve popular, confía en mí, no quieres ser el culpable de miles de sitios pirateados. Si crees que estoy exagerando, echa un vistazo a la investigación de Checkmarx realizada en 2013 sobre los 50 mejores complementos de WordPress.

Ahora veamos algunos consejos de seguridad para el desarrollo de WordPress:

Vulnerabilidades de XSS

Para prevenir el XSS, tenemos que hacer dos cosas. Desinfecte la entrada de datos y desinfecte los datos de salida. Tenemos varios métodos para sanear en función de los datos y el contexto que se utiliza. Por regla general, no tiene que confiar en ningún dato de entrada, y no confíe en ningún dato que se va a generar..

Para datos de entrada puede utilizar, por ejemplo, sanitize_text_field () que comprueba si no es válido UTF-8, Convertir solo < characters to entity, strip all tags, remove line breaks, tabs and extra white space and strip octets. Depending on the context you are, there are different functions that will help you out sanitizing your data.

Lo mismo sucede cuando usted envía sus datos. Consulte el siguiente ejemplo sobre cómo generar un enlace:

"> 

esc_url rechaza direcciones URL no válidas, elimina caracteres no válidos y elimina caracteres peligrosos

esc_html codifica < > & "'al generar HTML.

Nuevamente, dependiendo de los datos que tenga, hay diferentes funciones para ayudarlo. Para JavaScript tu puedes usar esc_js.

Además de la desinfección, recuerde validar su fecha, también.

Evite el acceso directo a sus archivos

La mayoría de los hosts permiten el acceso directo a los archivos. En su complemento, esto significa que probablemente surjan algunos errores de PHP y esos errores son información valiosa para los atacantes.. 

Un código muy básico para evitar esto, que puede colocar encima de su script es:

// Salir si se accede directamente si (! Defined ('ABSPATH')) salir; 

Esto básicamente impide ejecutar el script si no accedemos a él a través de WordPress.

Eliminar todas las advertencias y avisos

No solo los errores de PHP ayudan a los atacantes: los avisos y las advertencias también incluyen mucha información valiosa. Cada complemento debe codificarse utilizando el modo DEBUG. Esto también ayudará a detectar funciones obsoletas en su complemento. Para permitir DEPURAR modo simple busca esta línea en tu wp-config.php y cambiarlo a CIERTO.

define (WP_DEBUG, true);

Junto con esto, deberías probar el gran plugin Debug Bar. Al agregar esta otra línea simple, también podrá analizar todas las consultas de la base de datos.

define ('SAVEQUERIES', true);

Use los valores de Nonce

Los valores de Nonce son abreviados para los números que se usan una vez y se usan para proteger contra falsificaciones de solicitudes entre sitios o CSRF, que, en otras palabras, son solicitudes inesperadas o duplicadas que podrían causar cambios permanentes o irreversibles no deseados en el sitio web y, en particular, en su base de datos. Todo esto puede ser realizado por un atacante o simplemente por un error de un usuario de confianza..

Dependiendo de dónde necesites el nonce, puedes crearlo de diferentes maneras:

Para usarlo en un enlace, usa wp_nonce_url ()

$ complete_url = wp_nonce_url ($ bare_url, 'trash-post', 'my_nonce');

Para usarlo en un formulario, use wp_nonce_field ()

wp_nonce_field ('trash-post', 'my_nonce');

Para usarlo en cualquier otro lugar, usa wp_create_nonce ()

wp_localize_script ('my-script', 'my-var-name', array ('nonce' => wp_create_nonce ('trash-post', 'my_nonce'));

Si compruebas mi ejemplo anterior, verás cómo uso wp_localize_script (de lo que hablaré en el próximo artículo) para incluir mi nonce en un bloque de código JavaScript. Hago esto porque estoy planeando usar jQuery para hacer una solicitud AJAX más tarde y siempre debes incluir nonce en tus llamadas AJAX.

Luego, en su script para simplemente verificar el nonce, ingrese el siguiente código

if (! wp_verify_nonce ('trash_post', 'my_nonce')) die ('Busted!'); 

Usa las funciones y bibliotecas de WordPress

Siempre verifique si lo que está tratando de hacer es posible hacerlo con las bibliotecas y las funciones principales de WordPress. De esa manera, sus scripts serán menos propensos a las vulnerabilidades y, si aparecen algunos, serán corregidos por los colaboradores principales de WordPress y no tendrá que preocuparse de contactar a todos sus clientes..

El ejemplo más famoso de esto es con la biblioteca TimThumb que, hasta hace unos años, fue utilizada por miles de complementos y temas. Un día, en 2011, se reveló la vulnerabilidad. Desde entonces, ahora podemos utilizar el incorporado. add_image_size () funciona para este propósito. 

Otras funciones comunes están envueltas dentro de las funciones de WordPress como rizo que puede ser fácilmente reemplazado por wp_remote_get y wp_remote_post eso no solo codificará los datos, sino que también ofrecerá reservas, si rizo falla.

Otro ejemplo será el uso de get_template_part () en lugar de usar el exigir() o incluir() Funciones de PHP Si bien son básicamente los mismos, el anterior ya sabe dónde se encuentra su tema y buscará el archivo solicitado en el directorio de ese tema. No emitirá una advertencia o un error fatal si el archivo solicitado no existe. Puede busque otros archivos adecuados, si no se encuentra el solicitado y sabe sobre temas secundarios y temas principales.

El núcleo de WordPress incluye muchos scripts que podemos usar en nuestros complementos o temas. Así que siempre eche un vistazo antes de agregar nuevas bibliotecas.

Que sigue?

Espero que hayas sacado mucho de este artículo en particular. Como mencioné al principio, la mayor parte de esta información ya existe en el Codex, que debería ser su primera parada ahora que comenzó con su aventura de desarrollo de WordPress..

Cuando comencé a desarrollar con WordPress hace unos años, desearía tener una guía como esta con toda la información, así que esa es la razón principal por la que decidí escribir estas series.. 

En el siguiente artículo explicaré los siguientes temas:

  1. La forma correcta de agregar JavaScript y hojas de estilo en tu complemento
  2. Cómo usar Ajax en WordPress de la manera correcta.
  3. Deja que tus usuarios hagan cambios con ganchos

No dude en dejar sus comentarios o sugerencias para los dos artículos restantes de esta serie..