aThemeArt

Wordpress Shortcode Fundamentals (Part 1)

WordPress shortcodes are a feature that allows you to embed macros in your posts and pages. They convert short textual content into other content before it’s presented in the browser.

In other words, the shortcode is replaced by more extensive content for those who visit your blog. The term itself is probably a contraction of shortcut pseudo-code. WordPress began offering this powerful feature with the 2.5 release in the spring of 2008.

Some shortcodes (a single word and maybe a few attributes) display: image galleries, photo slideshows, mp3 audio players, google maps, user polls and much more. Shortcodes do the same work as lightweight plug-ins. However, there is no admin page on the dashboard for shortcodes. Many themes and plug-ins come complete with their own specific, feature-rich shortcodes.

This substitution can be as simple as displaying your address by merely typing a code like this: [show_my_address]. But, the extended usefulness of shortcodes is exhibited when they harness powerful functions to collect data and/or perform data manipulations for the output replacement.

Shortcodes save you time. And, they allow you to offer features to other editors of your site outside the realm of plug-ins. As your library of shortcodes expands, it will be almost like having an added language in your arsenal.

Shortcodes extend the available feature set of blog writing. Once installed, you can offer myriad advanced capabilities (for yourself and other post editors) with just the basic Dashboard Editor. You don’t have to resort to granting direct PHP access.

Also, your WP editor must be in HTML mode when you SAVE a post with shortcodes in it. Otherwise, the Visual Editor will completely IGNORE the macro. In fact, although the Visual Editor is tempting to use, it can severely dismantle some of the cool capabilities of WordPress.

Before we get into the basics of shortcode creation, let’s take care of a few preliminaries.

Shortcode Preliminaries

By default, you can not include the shortcode feature in text widgets. Let’s fix that first. Put the following code in your theme’s functions.php file. Some theme’s already have it. But, there is no problem with duplication.

add_filter('widget_text', 'do_shortcode');

Interestingly, WordPress includes the following line in includes/shortcodes.php to allow their use in regular content.

add_filter('the_content', 'do_shortcode', 11); // AFTER wpautop()

And, if you want to call your shortcodes from PHP, here’s the code to accomplish it.

echo do_shortcode($content);
// $content should be the exact shortcode text

Unfortunately, shortcodes became very popular before the WordPress developers incorporated a methodology to track and encapsulate them … as with plug-ins. So … the only way to know what a shortcode does (without examining the PHP source code) is to rely on the author to provide that information.

Shortcodes, however, can be installed just like plugins (with the correct header info in the file).

How to List All Available Shortcodes

How do you know what shortcodes you have access to? Well … there’s no built-in function for that either. But, we’ll create a shortcode that lists all of your active shortcodes. It’s only a list of the names (followed by the functions they call). Again, you have to rely on the author of the shortcode for usage instructions.

When you use our new simple shortcode, [wcs_list_all_shortcodes], in a post or page, you’ll get an output that looks similar to this:

Current Shortcode Count = 78
  • album (show_album)
  • bloginfo (blog_info_shortcode_handler)
  • gallery (gallery_shortcode)
  • ngg-plus (ngg_plus_shortcode_handler)
  • ngg-simple-slide (ngg_simple_slide_shortcode_handler)
  • nggallery (show_gallery)
  • wcs_link (wcs_link_shortcode_handler)
  • wcs_list_all_shortcodes (wcs_list_all_shortcodes_shortcode_handler)
  • wcs_syntax (wcs_syntax_shortcode_handler)

We created a function named wcs_list_all_shortcodes_func() that does the lion’s share of the work. You can actually call this function in your PHP code, if you want. Use the echo() command to output the resulting string.

Then, we constructed a quick shortcode handler, wcs_list_all_shortcodes_shortcode_handler, which calls our new workhorse function. And finally, we implement the shortcode functionality by using WordPress’s add_shortcode() function.

Our new shortcode features four attributes. before_line and after_line are the text/html inserted for individual output lines. And, before_content and after_content are the text/html inserted before/after the entire content block. We used defaults for each of these attributes. So … you only need to use them if you want a different output appearance.

Here’s the entire source code. To use it, put it in your theme’s functions.php file.

add_shortcode('wcs_list_all_shortcodes', 'wcs_list_all_shortcodes_shortcode_handler');
 
function wcs_list_all_shortcodes_shortcode_handler($atts)
{
    $parms = shortcode_atts(array('before_line' => '
  • ', 'after_line' => '
', 'before_content' => '
    ', 'after_content' => '
'), $atts); $before_line = $parms['before_line']; $after_line = $parms['after_line']; $before_content = $parms['before_content']; $after_content = $parms['after_content']; return wcs_list_all_shortcodes_func($before_line, $after_line, $before_content, $after_content); }

And, here’s the workhorse function called by the shortcode:

function wcs_list_all_shortcodes_func($before_line='
  • ', $after_line='
', $before_content='
    ', $after_content='
') { // output line format: // shortcode_name (shortcode_function_name) // init global $shortcode_tags; $sc_list = array(); // get the list into an array foreach ($shortcode_tags as $key => $val) { $sc_name = $key; if (is_array($val)) { $sc_name .= ' (' . $val['1'] . ')'; } else { $sc_name .= ' (' . $val . ')'; } $sc_list[] = $sc_name; } // sort it sort($sc_list); // now, process for output $output = 'Current Shortcode Count = ' . count($sc_list) . ' '; $output .= $before_content; foreach ($sc_list as $item) { $output .= $before_line . $item . $after_line; } $output .= $after_content; return $output; }

continue to reading more

Inspire us with your love!

FacebookTwitterReddit
Editorial Staff

aThemeArt editorial staff provides and makes all the content that is published on athemeart.com. In addition, they are responsible for all web content types, including blogs, social posts, videos, documentation, etc.

You can check also