Visual Studio Toolbox
5 Top WordPress Extensions for Visual Studio Code
Visual Studio Code is Microsoft's lightweight, cross-platform, open source code editor with IDE-like features. Since being introduced in 2015, it has been continually gaining in popularity, functionality and new use-case scenarios ranging from mundane static Web sites to cutting-edge artificial intelligence projects.
The open source WordPress project, meanwhile, is often described as the leading self-hosted blogging tool in the world by its backers. The main commercial steward says it "powers 29 percent of the Internet" and offers various options and plans for hosting general Web sites and more.
So what better tool to do your WordPress coding than VS Code? Read on to learn about five useful extensions that are ready to install and use right now, available from the Visual Studio Code Marketplace.
This extension is from a 25-year-old Vietnamese programmer named Ngoc Tung Vu, who may have gotten the internal capitalization wrong but nevertheless leads the field (according to installs) with this collection of WordPress snippets and autocompletions for VS Code.
Supporting WordPress version 4.6.1 (the latest version is 4.9.2), it provides autocompletion for some 2,884 functions and 191 constants/classes. Though WordPress version 4.6.1 shipped in September 2016, Ngoc Tung Vu has been actively maintaining the project since then with updates made as recently as three months ago.
According to Ngoc Tung Vu's shout out to Donovan Tengblad ("purplefish32"), the extension seems to borrow heavily from Tengblad's Sublime Text 3 WordPress Package on GitHub.
WordPress Snippet (internal capitalization corrected) boasts 31,823 installs as of this writing and has earned a near-perfect 4.9 rating from 10 reviewers (1-5 scale). Note that the latest review (September 2017) warns that it generates "Lots of warnings in devtools console," said to number in the hundreds.
The project's GitLab site shows six stars, 10 commits and one branch.
Wordpress Development Toolkit
This extension (developers seem to have a problem with proper internal capitalization) is from "Hridoy," whose LinkedIn site says he's lead developer at Envato, from New Delhi.
Supporting WordPress 4.8.1, WordPress Development Toolkit also provides code snippets, with autocompletion: "Type part of a snippet, press enter, and the snippet unfolds."
These snippets are categorized by: WordPress Core Snippets (such as adding a new option for a given blog id); and Custom Snippets (about 35, including dashboard, meta tag, shortcode and widget functions). Along with autocompletion triggering, they also can be activated via keyboard commands that differ by platform.
WordPress Development Toolkit has been installed 4,483 times as of this writing, with just one reviewer awarding it a 5.0 rating.
On the project's GitHub site, it has four stars. Although the last update was give months ago, the ReadMe file says "More Snippets will [be] coming soon."
WPCS Whitelist Flags
This single-function tool's mission is simple: "Add WordPress Coding Standards whitelist flags to your code," says the extension entry on the marketplace, which goes on to say the whitelist flags as are provided as code snippets.
You can learn more about Whitelisting code which flags errors
on GitHub. That guidance concerns the WordPress Coding Standards project, which actually provides "a collection of PHP_CodeSniffer rules (sniffs) to validate code developed for WordPress." WordPress was written in the PHP programming and scripting language.
The WordPress Coding Standards project explains: "Sometimes, a block of code will be flagged by WPCS with an error which you wish to ignore. An example of this could be a variable which is sanitized or escaped elsewhere before being used or output. WPCS lets you whitelist given errors for a line or block of code."
Claudio Sanches, creator of the WPCS Whitelist Flags VS Code extension, said his tool was inspired by the "WPCS whitelist flags for Sublime Text" project on GitHub.
The WPCS Whitelist Flags extension has been installed 1,040 times as of this writing, earning a 5.0 rating from one reviewer. On GitHub, it has two stars.
Wordpress VS Code Extension Pack
Once again, people: it's "WordPress," not "Wordpress." Anyway, this extension from "J.Pagano" simply provides "A collection of extensions for working with Wordpress sites in VSCode."
Simple enough. Those extensions are:
Yes, the aforementioned Wordpress Snippet and WPCS Whitelist Flags extensions are included in this extension.
The Visual Studio Code Marketplace entry for this extension pack shows 798 installs and no ratings. Its GitHub site shows zero stars, with the latest commit coming about six weeks ago.
Coming from Jason Pomerleau (thank you so much for the internal capitalization, Jason!) this brand-new extension is described as "the ultimate WordPress snippet collection for Visual Studio Code," boasting that it provides "snippets for every WordPress function, class and constant, complete with argument type hints and brief descriptions." Note that the extensions are bound to the PHP language context, which means "Your cursor will need to be inside a set of a set of <?php ?> tags."
With support for the WordPress 4.9.2 API, the extension supports 3,037 functions, 389 classes and 558 constants.
The project has its own Web site with documentation and an explanatory video. The site says it's "complete with argument type hints and brief descriptions right in your inline editing experience," allowing developers to spend less time checking documentation while providing easy autocompletion "with tab stops in all the right places." Its GitHub site show no stars, which -- along with the low number of installs -- is surely a function of the project's newness (version 1.0.0 was only just launched Jan. 10) rather than user experience or project quality.
More on WordPress Coding in VS Code
Now that you have a list of five top extensions for coding your WordPress projects in VS Code, here is a list of some related guidance:
About the Author
David Ramel is an editor and writer for Converge360.