How to Use Shortcode in WordPress PHP Theme File Templates

WordPress shortcodes are very useful for quick customization of your WordPress website.

In most cases, both free and premium plugins offer tons of shortcodes that you can use to display different HTML elements or page layouts on your website.

Some plugins are solely WordPress shortcode generators that you can use to create your shortcodes with custom settings.

Best Free WordPress Shortcode Plugin

One such plugin that I like to use often in several projects is the Shortcodes Ultimate; it’s free and you can try it out on your site.

This is a simple guide on how to use shortcodes in WordPress PHP files without breaking your site. With these easy steps; you can add your preferred shortcodes anywhere within your WordPress PHP files.

Use Shortcode in WordPress PHP Template Files

Using shortcodes in WordPress PHP files should be one of the advanced ways you can add shortcodes to your page templates anywhere in your code. It is important to remember that editing your theme files can lead to errors when it’s not done appropriately.

Unlike adding a shortcode in WordPress editor; to use a shortcode in a WordPress PHP template you need to have a backup of your theme or plugin since it can easily be messed up.

For this tutorial, I want to begin by creating a simple shortcode that just displays the text "Hakuna Matata – Everything is Cool" on your post or page.

Make Shortcode in PHP: WordPress Shortcode Example

Creating a shortcode in your theme is not hard as discussed in the earlier tutorial – how to create a shortcode in the WordPress plugin. So we need to begin with the action hook add_shortcode() and then create a callback function to execute the shortcode. So the code is as follows :

//Adding shortcode action hook 

 add_shortcode( 'hakuna-matata' , 'hakuna_matata_shortcode_callback');

//Shortcode Callback function 

 function hakuna_matata_shortcode_callback(){
  echo "Hakuna Matata";
 }

If you want to make a shortcode in PHP this is the code that you add to the functions.php of your theme. Open your theme functions.php file preferably your child theme and add this code as shown in the image below :

How to Display Shortcode in Post or Page

Now the shortcode is available for use in the post or page.

To use a shortcode in a WordPress page or post you simply need to add the first parameter of the add_shortcode() action hook enclosed by the corner brackets.

Like in the case of this example, the first parameter of the add_shortcode() function is ‘Hakuna Matata’

add_shortcode( 'hakuna-matata' , 'hakuna_matata_shortcode_callback');

So the shortcode that we should add to the page or post should be [ hakuna-matata ] as shown in the image below :

When you post on the page or post and publish you should see the frontend the text in the shortcode callback function is displayed on the page as shown below :

WordPress do_shortcode Example

So adding this shortcode in the PHP files instead of the page or post requires the use of a WordPress do_shortcode() function. As you will see in the documentation of the do_shortcode function; it is used to filter the content and output with the shortcode interpreted.

How to Add WordPress Shortcode to Theme

The shortcode we created above can be added to the theme files using the do_shortcode function as follows

<?php echo do_shortcode( ' [name_of_shortcode] ' ); ?>

We can add it to the single.php file or the page.php file or anywhere in the WordPress file where we want to display the output of the shortcode.

The display can be a form, button, accordion, or any other HTML output. A good example – in this example where we created a shortcode to display a form.

In most plugins that have shortcodes in the documentation you will often see do_shortcode as the way to use shortcode in WordPress PHP theme template or php files :

WordPress do_shortcode with Parameters

do_shortcode( string $content, bool $ignore_html = false )

The do_shortcode the function has two parameters $content and $ignore_html the first one represents the content to search the shortcodes while the second one is a boolean that determines if the shortcode is inside the HTML tags or not. The $ignore_html parameter is false by default but you can set it to true if the shortcode is inside HTML :

do_shortcode( 'shortcode-name', $ignore_html = true )

WordPress do_shortcode Contact Form 7 Example

Contact Form 7 is one of the most popular contact form plugins in the WordPress repo.

To use the shortcode in the WordPress PHP template and publish the contact form,  you should add the contact form 7 shortcode to the do_shortcode function as follows :

<?php echo do_shortcode( '[contact-form-7-EXAMPLE id="EXAMPLE"]' ); ?> 

Conclusion

This tutorial has covered everything that you need to know on how to add WordPress shortcodes to theme files and display the shortcode anywhere you want on your site. It is my hope that you find this WordPress tutorial useful.

If you are not sure how to get this done, you can consider consulting a WordPress developer; I can also help with any questions regarding WordPress web development; feel free to get in touch with me.

Similar Articles