I recently wrote a couple other tutorials about WordPress Shortcodes, what they are and how to use them in Widgets. This WordPress tutorial will show you how to create your own Shortcodes. The traditional method of creating Shortcodes includes hand coding them inside your theme’s functions.php file.
I’m going to show you an easier way to create Shortcodes without the need to know how to write PHP code. We’ll accomplish this with the help of a plugin named Post Snippets. In short, the Post Snippets plugin allows you to create content and then makes that content available to you in a Shortcode. You can then insert this Shortcode into your posts as needed. Here’s the description from the plugin author:
This admin plugin stores snippets of HTML code or reoccurring text that you often use in your posts. You can use predefined variables to replace parts of the snippet on insert. All snippets are available in the post editor with a TinyMCE button. The snippet can be inserted as defined, or as a shortcode to keep flexibility for updating the snippet.
After activating the plugin, you’ll find a new item named Post Snippets under the Settings tab in your WordPress backend.
Clicking on the Post Snippets link takes you to the snippets creation and management screen. You’ll also see some handy explanations and directions from the plugin author. A nice usability touch.
To create your first Post Snippet (and resulting Shortcode) just click Add New Snippet. You’ll see some input fields to fill out.
The Title field is simply the title of your snippet and therefore your Shortcode, try to be brief. Let’s ignore the Variables field for now. Next comes the Snippet field. This is where you’ll enter the text and/or HTML code you would like this Shortcode to display.
Important Note:
I think it would be much more user-friendly if this plugin were to integrate the visual editor, or at least the HTML editor when creating content for the Snippet input field. As it is now, you will have to write HTML code directly in this field. Of course, you could always write your content in a draft post using the visual editor, then switch to HTML mode and then copy/paste that into your Snippet field.
You will also see two checkboxes on the far right. One that says “SC” and one that says “QT”. “SC” stands for Shortcode and “QT” stands for Quicktag. By checking these you are telling the plugin to make this snippet available to be used as a Shortcode and also to make a Quicktag button available in the Visual editor.
Now let’s create a post and see what this plugin can do. When creating a new post, you’ll see a new button in the Visual editor that looks like a yellow scrap of note paper.
Clicking that button will bring up all the post snippets you’ve created and allow you to chose which one to use. Once you’ve made your choice, the Shortcode for that post snippet is inserted into your post wherever your cursor is positioned.
You will now see the Shortcode named FirstShortcode in your post.
Let’s have a look at this same post on the frontend to see the output of that Shortcode.
As you can see, it pretty easy to create reusable content to include in your posts using your own Shortcodes created with the Post Snippets plugin for WordPress.
I can think of a lot of ways to use these post snippets and Shortcodes. How would you use them for your own site?
I hope you enjoyed this WordPress tutorial, and if you found it helpful please share it with the world on your preferred social network. I sure would appreciate it!
[AppAd]
