{"id":2799,"date":"2020-11-22T17:50:38","date_gmt":"2020-11-22T16:50:38","guid":{"rendered":"https:\/\/davidperezgar.com\/?p=2799"},"modified":"2025-06-10T22:46:20","modified_gmt":"2025-06-10T20:46:20","slug":"develop-wordpress-coding-standards","status":"publish","type":"post","link":"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/","title":{"rendered":"Develop using WordPress Coding Standards"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Programming nowadays, it becomes fundamental with <strong>Coding Standards<\/strong>. The goal is to maintain the same style, so that when you look at it you can interpret it easily.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Tabla de contenidos<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69d1bff7e59a3\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69d1bff7e59a3\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#What_is_Coding_Standards\" >What is Coding Standards?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Why_code_style_is_important\" >Why code style is important<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Configuration_process_on_Mac\" >Configuration process on Mac<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Install_Composer_on_MacOs\" >Install Composer on MacOs<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Composerwith_BREW\" >Composerwith BREW<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Composer_getcomposerorg_manually\" >Composer (getcomposer.org) manually<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Configuring_Code_Sniffer_and_WordPress_Standards\" >Configuring Code Sniffer and WordPress Standards<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Adaptations-in-VisualCode-for-WordPress_Coding_Standards\" >Adaptations-in-VisualCode-for-WordPress Coding Standards<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Upgrading_to_version_30\" >Upgrading to version 3.0<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/davidperezgar.com\/en\/blog\/web-development\/develop-wordpress-coding-standards\/#Conclusion\" >Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\" id=\"what-is-coding-standards\"><span class=\"ez-toc-section\" id=\"What_is_Coding_Standards\"><\/span>What is Coding Standards?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Coding Standards<\/strong> are style rules when developing, which allow us a better reading and understanding of the functions. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">It tries to establish the best ways to work in WordPress and it is also not only based on style but also on <strong>best practices.<\/strong><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"because-code-style-is-important\"><span class=\"ez-toc-section\" id=\"Why_code_style_is_important\"><\/span>Why code style is important<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Even if you&#8217;re working on a private project, the formatting of your code speaks volumes. And if you&#8217;re in a multi-developer environment, it says a lot more. Well-styled and well-thought-out code shows quality (even if it&#8217;s not good), while chaos breeds sloppy (even if it&#8217;s great) programming.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><p>Here are some reasons to <strong>pay attention to the style of your code<\/strong>:<\/p>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The <strong>styled code is easier to maintain<\/strong>. You may know what&#8217;s going on today, but what&#8217;s going to happen a year from now? Taking the time to structure your work will save you hours later on.<\/li>\n\n\n\n<li>Other <strong>developers don&#8217;t read your mind<\/strong>, so they won&#8217;t understand your chaotic code, or will need a lot of time to untangle it. Ensuring as little friction in communication as possible is best for the project, and this can be facilitated by a standards-compliant format. <\/li>\n\n\n\n<li>Slightly less important, someone learning to program should be able to visit a website and <strong>learn something by looking at the source code<\/strong>. Standards often have inherent logic, so a bystander would be able to figure out what is going on. Adhering to standards could help many developers who are starting to learn to program the right way from day one.<\/li>\n\n\n\n<li>In many cases, <strong>good formatting helps maintainability.<\/strong> Many standards require spacing of declarations and other code blocks. Not cramming code together will make an &#8220;Error on line 267&#8221; message much easier to fix.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"configuration-process-on-mac\"><span class=\"ez-toc-section\" id=\"Configuration_process_on_Mac\"><\/span>Configuration process on Mac<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">This is my process that I keep updated for setting up Coding Standards on Mac. There are several ways to install it, the one I like the most and is the one I expose, is with composer. For those who don&#8217;t know it is a software for php based libraries to integrate in your projects in a very easy way. It also allows a global installation which is what we will do. Then to keep all the libraries updated is very easy with this command:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global update<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"install-composer-on-macos\"><span class=\"ez-toc-section\" id=\"Install_Composer_on_MacOs\"><\/span>Install Composer on MacOs<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Composerwith_BREW\"><\/span><a href=\"https:\/\/getcomposer.org\/\" target=\"_blank\" rel=\"noopener\">Composer<\/a>with BREW<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">If you have brew, the package installer for macOS.<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">brew install composer<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">And you&#8217;re done! Much easier.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Composer_getcomposerorg_manually\"><\/span><a href=\"https:\/\/getcomposer.org\/\" target=\"_blank\" rel=\"noopener\">Composer (getcomposer.org)<\/a> manually<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p class=\"wp-block-paragraph\"><p>We follow the steps below which really worked for me. We open the terminal and run the following commands:<\/p>.<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">curl -sS https:\/\/getcomposer.org\/installer | php<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">And move that composer.phar file to the binary directory \/usr\/local\/bin. Make sure that this folder is there before.<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">sudo mv composer.phar \/usr\/local\/bin\/<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">And we change its permissions:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">sudo chmod 755 \/usr\/local\/bin\/composer.phar<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Let&#8217;s add .profile<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">nano ~\/.profile<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">And we add an alias to use it easily:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">alias composer=\"php \/usr\/local\/bin\/composer.phar\"<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">We continue in the terminal:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">source ~\/.profile<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">And finally check that Composer has been installed correctly:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer -v<\/code><\/pre><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"465\" height=\"227\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/configuracion-composer-mac.png\" alt=\"composer mac configuration\" class=\"wp-image-2967\" title=\"\"><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"configuring-code-sniffer-and-wordpress-standards\"><span class=\"ez-toc-section\" id=\"Configuring_Code_Sniffer_and_WordPress_Standards\"><\/span>Configuring <strong>Code Sniffer and WordPress Standards<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">My installation instructions are based on working with <a href=\"https:\/\/getcomposer.org\/\" class=\"rank-math-link\" target=\"_blank\" rel=\"noopener\">Composer<\/a>, the famous PHP library manager, as afterwards to update all our libraries is done with a single command:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global update<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">On the other hand, if you have installed it in other folders as, for example, <a href=\"https:\/\/github.com\/ahmadawais\/VSCode-Tips-Tricks\/blob\/master\/videos\/PHP%2BWordPress-Setup\/WordPress.md\" class=\"rank-math-link\" target=\"_blank\" rel=\"noopener\">recommends Ahmad Awais<\/a>, then keeping them up to date becomes very complicated.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We install on our computer, the CodeSniffer version.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">PHP_CodeSniffer is a set of two PHP scripts; the main <em>phpcs<\/em> script that logs PHP, JavaScript and CSS files to detect violations of a defined coding standard, and a second <em>phpcbf<\/em> script to automatically correct coding standard violations. PHP_CodeSniffer is an essential development tool that ensures that your code stays clean and consistent.<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global require \"squizlabs\/php_codesniffer=*\"<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">We allow composer to allow the configuration globally.<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global config bin-dir --absolute<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Within Composer, we created a Coding Standards project for WordPress. It is a library created to manage the recommended rules within WordPress. <\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global require \"wp-coding-standards\/wpcs\"<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Once that project is downloaded, we tell PHPCS to manage the Coding Standards rules, at our location. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Remember to customize <em><meta charset=\"utf-8\">.composer\/vendor\/wp-coding-standards\/wpcs<\/em> with the location of the WordPress project<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">phpcs --config-set installed_paths $HOME\/.composer\/vendor\/wp-coding-standards\/wpcs <\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">If this command doesn&#8217;t work for you, ultimately the <em>.composer\/vedor\/squizlabs\/php_code_snifer\/CodeSniffer.conf<\/em> file should contain this information:<\/p>\n\n\n\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">&lt;?php\n $phpCodeSnifferConfig = array (\n  'installed_paths' =&gt; '\/Users\/USER\/.composer\/vendor\/wp-coding-standards\/wpcs',\n  'default_standard' =&gt; 'WordPress',\n)\n?&gt;<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Where <em>installed_paths<\/em> contains the directory where you have installed the Coding standards. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Finally, we define the rule we will use. We have:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>WordPress<\/em> &#8211; complete set with all the rules of the project\n\n \n<ul class=\"wp-block-list\">\n<li><em>WordPress-Core<\/em> &#8211; main rules for WordPress core coding standards<\/li>\n\n\n\n<li><em>WordPress-Docs<\/em> &#8211; additional rules for WordPress inline documentation standards.<\/li>\n<\/ul>\n\n\n\n<li><em>WordPress-Extra<\/em> &#8211; extended set of rules for recommended best practices, which are not sufficiently covered in the basic WordPress coding standards, includes WordPress-Core.<\/li>\n\n\n\n<\/li> <!\n<\/li>\n<\/ul>\n\n\n<\/ul>\n<p><!-- \/wp:post-content --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Let&#8217;s give PHPCS the path to the WordPress coding standards:<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:code --><\/p>\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">phpcs --config-set installed_paths $HOME\/.composer\/vendor\/wp-coding-standards\/wpcs <\/code><\/p> <pre>.\n<!-- \/wp:code -->\n\n<!-- wp:paragraph -->\n<p>And we set up the full WordPress set.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:code -->\n<pre class=\"wp-block-code\"><code class=\"\">phpcs --config-set default_standard WordPress <\/code><\/code><\/pre><\/div>\n<p>.<br \/>\n<!-- \/wp:code --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>And now we can enjoy Coding Standard's recommendations in our favorite editor.<br \/>\n<!-- \/wp:paragraph --><\/p>\n<p><!-- wp:heading --><\/p>\n<h2 class=\"wp-block-heading\" id=\"adaptations-in-visualcode-for-wordpress-coding-standards\"><span class=\"ez-toc-section\" id=\"Adaptations-in-VisualCode-for-WordPress_Coding_Standards\"><\/span>Adaptations-in-VisualCode-for-WordPress Coding Standards<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>.<br \/>\n<!-- \/wp:heading --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Finally if we use Visualcode, we will need to configure where the phpcs executable is, which will come from our composer binaries folder. Add these lines in your JSON settings (check the executable):<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:code --><\/p>\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\"><code><code><code>\/\/ PHPCS. \"phpcs.executablePath\":\"\/Users\/USERS\/USER\/.composer\/vendor\/bin\/phpcs\", \/\/ PHPCBF. \"phpcbf.onsave\": false, \"phpcbf.standard\": \"WordPress\", \"phpcbf.executablePath\":\"\/Users\/USERS\/USER\/.composer\/vendor\/bin\/phpcbf\", \"phpcs.ignorePatterns\": [\"*\/vendor\/*\", \"*\/vendors\/*\"],<\/code><\/code><\/code><\/code><\/pre><\/div>\n<p>.<br \/>\n<!-- \/wp:code --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>To enable integration with our Coding Standards editor, which in the end is what makes us implement it, we will install the <a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=ikappas.phpcs\" class=\"rank-math-link\" target=\"_blank\" rel=\"noopener\">VisualCode phpcs extension<\/a>. <\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":2853,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1578\" height=\"324\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/extension-phpcs-vscode.png\" alt=\"phpcs vscode extension\" class=\"wp-image-2853\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/extension-phpcs-vscode.png 1578w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/extension-phpcs-vscode-596x122.png 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/extension-phpcs-vscode-768x158.png 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/extension-phpcs-vscode-1082x222.png 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/extension-phpcs-vscode-1536x315.png 1536w\" sizes=\"auto, (max-width: 1578px) 100vw, 1578px\" \/><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>It is a preprocessor Lint, which is pointing out at all times the errors and improvements that when placed on top, shows us the error to correct.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":2855,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1366\" height=\"352\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/subrayado-phpcs.png\" alt=\"phpcs underline\" class=\"wp-image-2855\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-phpcs.png 1366w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-phpcs-596x154.png 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-phpcs-768x198.png 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-phpcs-1082x279.png 1082w\" sizes=\"auto, (max-width: 1366px) 100vw, 1366px\" \/><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:image {\"id\":2856,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1230\" height=\"214\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/subrayado-explicacion-phpcs.png\" alt=\"underline phpcs explanation\" class=\"wp-image-2856\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-explicacion-phpcs.png 1230w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-explicacion-phpcs-596x104.png 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-explicacion-phpcs-768x134.png 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/subrayado-explicacion-phpcs-1082x188.png 1082w\" sizes=\"auto, (max-width: 1230px) 100vw, 1230px\" \/><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:heading --><\/p>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Upgrading_to_version_30\"><\/span>Upgrading to version 3.0<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><!-- \/wp:heading --><\/p>\n<p><!-- wp:code --><\/p>\n<div class=\"cbc-code-wrapper\"><div class=\"cbc-code-bar\"><button class=\"cbc-copy-button\">Copy<\/button><\/div><pre class=\"wp-block-code\"><code class=\"\">composer global update wp-coding-standards\/wpcs --with-dependencies<\/code><\/code><\/pre><\/div>\n<p><!-- \/wp:code --><\/p>\n<p><!-- wp:heading --><\/p>\n<h2 class=\"wp-block-heading\" id=\"conclusion\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>.<br \/>\n<!-- \/wp:heading --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Having the <strong><em>WordPress Coding Standards<\/em><\/strong> integrated in our editor is fundamental to write a safer, cleaner and easier to read code. And the integration is a must to get it up and running.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Sources:<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:list --><\/p>\n<ul>\n<ul><!-- wp:list-item --><\/p>\n<li><a href=\"https:\/\/github.com\/WordPress-Coding-Standards\/WordPress-Coding-Standards\" class=\"rank-math-link\" target=\"_blank\" rel=\"noopener\">Official WordPress Coding Standards repository<\/a><\/li>\n<p>.<br \/>\n<!-- \/wp:list-item --><\/p>\n<p><!-- wp:list-item --><\/p>\n<li><a href=\"https:\/\/tommcfarlin.com\/php-codesniffer-in-visual-studio-code\" target=\"_blank\" rel=\"noopener\">TomMcFarlin PHP Coding Sniffer<\/a><\/li>\n<p>.<br \/>\n<!-- \/wp:list-item --><\/p>\n<p><!-- wp:list-item --><\/p>\n<li><a href=\"https:\/\/www.smashingmagazine.com\/2012\/07\/guide-wordpress-coding-standards\/\" target=\"_blank\" rel=\"noopener\">Guide To WordPress Coding Standards - Smashing Magazine<\/a><\/li>\n<p><!-- \/wp:list-item --><\/p>\n<p><!-- wp:list-item --><\/p>\n<li><a href=\"https:\/\/gist.github.com\/nunomorgadinho\/b2d8e5b8f5fec5b0ed946b24fa288a91\" class=\"rank-math-link\" target=\"_blank\" rel=\"noopener\">Nuno's settings on Gist<\/a><\/li>\n<p><!-- \/wp:list-item --><\/ul>\n<p><!-- \/wp:list --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Revisions:<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:list --><\/p>\n<ul>\n<ul><!-- wp:list-item --><\/p>\n<li>September 2023: Added Composer installation with brew.<br \/>\n<!-- \/wp:list-item --><\/p>\n<p><!-- wp:list-item --><\/p>\n<li>November 2021: Added CodeSniffer.conf file.<br \/>\n<!-- \/wp:list-item --><\/ul>\n<p><!-- \/wp:list --><\/p>","protected":false},"excerpt":{"rendered":"<p>Programming today is made fundamental with Coding Standards. The objective is to maintain the same style, so that when you look at it you can easily interpret it. What is Coding Standards? Coding Standards are rules of style when developing, which allow us to better read and understand the functions. It tries to establish the best ways to work in WordPress and it is not only based on style but also on best practices. Why is the style of the code important? Even if you&#8217;re working on a private project, the formatting of your code speaks volumes. &#8230; <a title=\"\" class=\"read-more\" href=\"\" aria-label=\"Read more about \">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":4264,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","inline_featured_image":false,"_ayudawp_aiss_exclude":false,"webmentions_disabled_pings":false,"webmentions_disabled":false,"editor_notices":[],"footnotes":""},"categories":[168],"tags":[],"class_list":["post-2799","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-development","generate-columns","tablet-grid-50","mobile-grid-100","grid-parent","grid-50"],"_links":{"self":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts\/2799","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/comments?post=2799"}],"version-history":[{"count":0,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts\/2799\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/media\/4264"}],"wp:attachment":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/media?parent=2799"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/categories?post=2799"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/tags?post=2799"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}