If you are creating a fantastic plugin or an extraordinary theme or even a lame one of the two, Shortcodes are always fun to work with in WordPress until you run into a situation where the content being generated by the shortcode simply won’t show up where you want it to.
For example after creating a shortcode in a plugin, I tried enter this into a blog post or page today using the WYSIWYG editor :
some content before the shortcode<br />
[my-simple-shortcode]
some content after the shortcode<br />
…and when I saved and viewed the page or post, I got:
my shortcode’s content here…..
some content before the shortcode
some content after the shortcode
….so that is NOT what I wanted clearly and I found a solution!
In simple terms, the solution is not to echo the shortcode content in the shortcode’s function, but to return it instead.
The correct way to create a WordPress Shortcode:
For example, here is how you create a simple shortcode the correct way:
<?php
function create_simple_shortcode(){
$returnvar = “<p>The content that your shortcode displays…</p>”;
return $returnvar;
}//end create_simple_shortcode function
//name the shortcode simple_shortcode:
add_shortcode(‘simple_shortcode’,’create_simple_shortcode’);
?>
The wrong way to create a WordPress Shortcode:
In contrast, this is the incorrect way to create a WordPress shortcode using echo instead of return:
<?php
function create_simple_shortcode(){
$returnvar = “<p>The content that your shortcode displays…</p>”;
echo $returnvar;
}//end create_simple_shortcode function
//name the shortcode simple_shortcode:
add_shortcode(‘simple_shortcode’,’create_simple_shortcode’);
?>
…this is also NOT correct:
<?php
function create_simple_shortcode(){
echo “<p>The content that your shortcode displays…</p>”;
}//end create_simple_shortcode function
//name the shortcode simple_shortcode:
add_shortcode(‘simple_shortcode’,’create_simple_shortcode’);
?>
The above could also be done correctly like this however:
<?php
function create_simple_shortcode(){
return “<p>The content that your shortcode displays…</p>”;
}//end create_simple_shortcode function
//name the shortcode simple_shortcode:
add_shortcode(‘simple_shortcode’,’create_simple_shortcode’);
?>
Get it? return NOT echo! Good luck! hopefully this will save you some time!