WordPress’s greatest asset might also be its greatest liability. While it has a plethora of sophisticated tools and security, creating new functions and features may be a tremendous burden.
However, this is where shortcodes come into play. Once you’re experienced with shortcodes, you can design bespoke functionality in minutes – the only limit is your imagination.
Shortcodes are intended to make your life simpler, but in order to build and add new functionality to your WordPress site, you must first understand how to install and create them. Let’s have a look at several methods for adding and creating WordPress shortcodes so you may have total control over your website.
What is a shortcode?
Shortcodes are intended to make your life simpler, but in order to build and add new functionality to your WordPress site, you must first understand how to install and create them. Let’s have a look at several methods for adding and creating WordPress shortcodes so you may have total control over your website.
WordPress shortcodes are a great tool that allows you to do interesting things with little effort. You can do almost anything with them. Inserting interactive elements or complex page layouts is as simple as inserting a single line of code with shortcodes.
This article will teach you all you need to know about shortcodes. You’ll learn how to use the Shortcode API by constructing your own shortcodes. Finally, we’ll talk about the future of shortcodes and how they fit into WordPress’ new Block editor.
Types of Shortcodes
Self-closed Shortcodes: It is the content enclosed in square brackets. [recent posts] or [image gallery] are examples of self-closing shortcodes. When you use this shortcode on a page, the content between the square brackets is displayed.
Enclosed Shortcodes: The closing tags for enclosing shortcodes are: [shortcode]your content here[/shortcode]. When the content inside the opening and closing tags needs to be changed, enclosing shortcodes are required.
Excited? Let’s get this party started!
Shortcode functions can be added to the plugin code or your theme’s functions.php file. If it’s the latter, I’d recommend creating a separate WC-shortcodes.php file, then adding include(‘wc-shortcodes.php’); to functions.php. You can use the below code to include the file wc-shortcodes.php.
<?php
// register shortcode
add_shortcode('greeting', 'cxc_demo_shortcode');
// function that runs when shortcode is called
function cxc_demo_shortcode() {
// Things that you want to do.
$message = 'Hello world!';
// Output needs to be return
return $message;
}
?>If the shortcode produces a lot of HTML then ob_start can be used to capture the output and convert it to a string as follows:-
<?php
add_shortcode( 'cxc_my_shortcode', 'cxc_my_shortcode_func' );
function cxc_my_shortcode_func() {
ob_start();
?> <HTML> <here> ... <?php
return ob_get_clean();
}
?><?php
add_shortcode( 'cxc_bartag', 'cxc_bartag_func' );
// [bartag foo="foo-value"]
function cxc_bartag_func( $atts ) {
$a = shortcode_atts( array(
'foo' => 'something',
'bar' => 'something else',
), $atts );
return "foo = {$a['foo']}";
}
?>This creates a “[cxc_bartag]” shortcode that supports two attributes: [“foo” and “bar”]. Both attributes are optional and will take on default options [foo=”something” bar=”something else”] if they are not provided. The shortcode will return as foo = {the value of the foo attribute}.
I hope you found this guide on generating a custom shortcode for your WordPress website useful. If so, I invite you to subscribe to Elegant Themes since we have some fantastic stuff on the way.
Also, I remind you to back up any files before editing the theme.
