This article is an in-depth WordPress shortcode tutorial. We cover what shortcodes are, when to use them, and how to register your own, with full-code custom shortcode examples.
WordPress shortcodes are a very handy tool to do one thing: get custom PHP code to display anywhere on your site.
Once you understand WordPress shortcodes, they’re an extremely handy and easy-to-use tool to do one thing: get custom PHP code of any kind to display anywhere on your site, from your post content to your sidebars to your headers and footers. Even with Gutenberg, the WordPress block editor, solidly established in WordPress core, shortcodes remain one of my favorite programmable tools in WordPress—even though Gutenberg is designed explicitly to make shortcodes obsolete.
So before we dive into the code, let’s examine why WordPress shortcodes continue to be useful, even in a Gutenberg era.
Gutenblocks vs. Shortcodes: Comparison and Tradeoffs
If there’s one thing Gutenberg is designed to kill, it’s shortcodes.
Our WordPress shortcode examples need to grapple with one fact: if there’s one thing Gutenberg is designed to kill, it’s the use of WordPress shortcodes in content creation.
It’s not hard to see why. Quick, what does the following code, in your post editing screen, look like on the front end of your site?
No idea. (That’s an actual shortcode here on WPShout, by the way.) The Gutenberg team use the disgusting but accurate term “mystery meat” for the exact kind of user experience that shortcodes give.
If “mystery meat” is the problem, Gutenberg’s live-previewing Blocks are the cure:
This article was written by Fred Meyer and originally published on WPShout.