Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

How to Use Shortcodes in Your WordPress Themes

Editorial Note: We earn a commission from partner links on WPBeginner. Commissions do not affect our editors' opinions or evaluations. Learn more about Editorial Process.

Do you want to use shortcodes in your WordPress theme?

Normally, you will use shortcodes inside content areas like posts, pages, or sidebar widgets. However, sometimes, you may want to add a shortcode inside your WordPress theme.

In this article, we will show you how to easily add any shortcode to your WordPress theme.

How to use shortcodes in your WordPress themes

Why Use Shortcodes in Your WordPress Themes?

Shortcodes allow you to add all kinds of features to your website, including image galleries, forms, social media feeds, and much more.

WordPress comes with a few built-in shortcodes, but there are also many popular WordPress plugins that add shortcodes to your site.

For example, WPForms has easy-to-use blocks, but it also provides shortcodes so you can add forms to other areas of your website.

An example of a WordPress shortcode, provided by WPForms

Most of the time, you will add shortcodes inside content areas like posts and pages.

To learn more, please see our complete guide on how to add a shortcode in WordPress.

Adding a shortcode block to a WordPress page or post

However, sometimes, you may want to use a shortcode inside your WordPress theme files.

This allows you to add dynamic elements to areas you can’t edit using the standard WordPress post editor, such as your archive page. It’s also an easy way to use the same shortcode on multiple pages.

For example, you might add a shortcode to your theme’s Page or Post template.

With that in mind, let’s see how you can use shortcodes in your WordPress theme. Simply use the quick links below to jump straight to the method you want to use:

Method 1: Using the Full-Site Editor (Block Themes Only)

The easiest way to use shortcodes in your WordPress theme is by using the full site editor. This allows you to add a Shortcode block to any part of your website.

However, this method only works with block-based themes like Hestia Pro. If you are not using a block-enabled theme, then you will need to use a different method instead.

To get started, head over to Appearance » Editor in the WordPress dashboard.

Opening the WordPress full-site editor (FSE)

By default, the full site editor shows your theme’s home template, but you can add shortcodes to any template.

To see all the available options, select ‘Templates.’

Adding shortcode to a WordPress template using the full-site editor

You can now click on the template you want to edit.

As an example, we will add a shortcode to the 404 page template, but the steps will be exactly the same no matter which template you select.

Adding a shortcode to a WordPress theme using a full-site editor (FSE)

WordPress will now show a preview of the template.

To add a shortcode, go ahead and click on the small pencil icon.

Editing a WordPress theme's 404 template using the full-site editor (FSE)

With that done, click on the blue ‘+’ icon in the top left corner.

In the search bar, you need to type in ‘Shortcode’.

Adding a shortcode block to a WordPress theme

When the right block appears, drag and drop it onto the theme template.

You can now either paste or type the shortcode that you want to use.

Adding Shortcode blocks to a WordPress theme

After that, go ahead and click on the ‘Save’ button.

Now, simply visit your WordPress blog to see the shortcode in action.

An example of a shortcode, on a 404 page template

Method 2: Editing Your WordPress Theme Files (Works With Any WordPress Theme)

You can also add shortcodes to your WordPress theme by editing the theme files. This method is more advanced, but it works with every WordPress theme.

If you haven’t added code to your site before, then check out our step-by-step guide on how to copy and paste code in WordPress.

You can modify the individual theme files directly, but this makes it difficult to update your WordPress theme without losing customization. For this reason, we recommend overriding the theme files by creating a child theme.

If you are creating a custom theme, then you can add or modify the code in your existing theme files.

When editing your theme files, you can’t add the shortcode in the same format you use with standard content areas. Instead of seeing the shortcode’s output, you will see the shortcode itself on the screen.

This happens because WordPress doesn’t execute shortcodes inside theme template files. Instead, you will need to explicitly tell WordPress to run the shortcode using the do_shortcode function.

For more information, please see our guide on how to easily add custom code.

Here’s an example of the code you will add to your WordPress theme files:

echo do_shortcode('[gallery]');

Simply replace ‘gallery’ with the shortcode you want to use.

If you are not sure where to add the shortcode, then please see our beginner’s guide to the WordPress template hierarchy.

If you are adding a shortcode with extra parameters, then you’ll need to use a slightly different code snippet.

Imagine you have created a contact form using WPForms. In this case, you will need to use the standard WPForms shortcode plus the form’s ID:

echo do_shortcode("[wpforms id='92']");

Troubleshooting: What to Do When do_shortcode Isn’t Working

Sometimes, you may add a shortcode to a theme file, but the code’s output doesn’t appear on your WordPress website. This usually means the shortcode depends on a WordPress plugin or some other code on your website.

If the do_shortcode function is not working, then make sure the plugin providing the shortcode is installed and activated by going to Plugins » Installed Plugins.

In the following image, WPForms is installed but deactivated, so the echo do_shortcode code won’t work.

How to instal and activate a WordPress plugin

You can also check whether a shortcode is available for you to use by adding the shortcode_exists() function to your index.php file.

In the following snippet, we are checking whether the WPForms snippet is available to use on our website:

if ( shortcode_exists( 'wpforms' ))  {
  echo do_shortcode("[[wpforms id='147']]");
}

If you still don’t see the shortcode output on your website, then try clearing the WordPress cache, as you may be seeing an outdated version of your site.

Method 3: Creating Your Own WordPress Theme (Fully Customizable)

Another option is to create a custom WordPress theme. This is a more advanced method, but it allows you to add as many shortcodes as you want to any area of your WordPress theme. You can also make other changes to create a theme that has exactly the features and design you want.

In the past, you would need to follow complicated WordPress tutorials and write code to build a custom WordPress theme. However, it’s now possible to create a custom theme without writing a single line of code using SeedProd.

SeedProd is the best WordPress page builder and also comes with a theme builder. This allows you to design your own themes using drag and drop.

SeedProd's advanced theme builder feature

For step-by-step instructions, please see our guide on how to create a custom WordPress theme (without any code).

After creating a theme, you can add shortcodes to any part of your WordPress website by going to SeedProd » Theme Builder.

Custom WordPress theme templates

Here, find the template where you want to use the shortcode.

Then, just hover your mouse over that template and click on ‘Edit Design’ when it appears.

Creating a custom theme using SeedProd

This will open the template in SeedProd’s drag-and-drop page builder.

In the left-hand menu, scroll to the ‘Advanced’ section. Here, find the Shortcode block and drag it onto your layout.

Adding a Shortcode block to a theme using SeedProd

In the live preview, simply click to select the Shortcode block.

You can now add your shortcode to the ‘Shortcode’ box.

Adding a contact form to a WordPress theme using shortcode

By default, SeedProd doesn’t show the shortcode output in the live preview.

To see your shortcode in action, click on the ‘Show Shortcode Option’ toggle.

Previewing the shortcode output in SeedProd

After that, you may want to add some styling to the shortcode output by selecting the ‘Advanced’ tab.

Here, you can change the spacing, add custom CSS, and even add CSS animation effects.

Styling shortcode output using the SeedProd theme builder

When you are happy with how the page looks, just click the ‘Save’ button.

After that, select ‘Publish’ to make the shortcode live.

Publishing a custom WordPress theme using SeedProd

You can now visit your website to see the custom shortcode in action.

We hope this tutorial helped you learn how to use shortcodes in your WordPress themes. You may also want to check out our guide on how to create a landing page in WordPress and our expert picks for the best social media plugins for WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

29 CommentsLeave a Reply

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Jiří Vaněk says

    Is there a way to create a shortcode myself, rather than just inserting one that’s already created by a plugin? Let me give an example. I create a piece of code that I don’t necessarily want to insert everywhere as PHP code. Can I turn that code into a shortcode, which I then simply insert in the desired location, and the entire PHP code hidden within that shortcode gets executed there?

  3. pankaj says

    I deleted contact form 7 and it is giving error like this [contact-form-7 404 “Not Found”] I don’t want to use the form again but want to remove this error I don’t know where to find that code or shortcode in template file

  4. Sonik says

    hi,

    I have written a shortcode of a gallery plugin in wordpress visual editor, but it is not executing the shortcode, instead it displays the shortcode as it is written.

    like if I write [test attr=’hello’], it echoes the same on webpage, not executing.

    Thanks.

  5. DavidA says

    Hello, I have two wordpress blogs on multisite.
    Do you know, how to use the shortcode on the website 1 from the website 2 ?
    Thx

  6. Dean says

    Sorry here is the code:

    CODE: ——————————————————————————————

    echo do_shortcode(“[tabset tab1=”tab 1 title” tab2=”tab 2 title”]
    [tab]tab 1 content[/tab]

    [tab]tab 2 content[/tab]
    [/tabset]”);

    —————————————————————————————————-

  7. Nate Rouch says

    That’s good information. I’ve been searching for a way to simply add these, I appreciate it.

  8. Tim says

    Great info. Thanks! However, it’s not working for me in WordPress 3.5.1 using the Avada theme.

    Do you need to add anything to functions.php for the code above to work? Could this be a theme-specific issue? Thanks, just learning wordpress templating.

  9. Tyron says

    This is a great little tip. How would this work if your content needs to be wrapped in a shortcode?

    Like [shortcode-name]Content here[/shortcode-name].

    • Jonathon Harris says

      Tyron,
      This a late answer as I’m just seeing it, but to include wrapped content, you could do the following:

      echo do_shortcode(‘[example_shortcode]’.$text_to_be_wrapped_in_shortcode.'[/example_shortcode]’);

      Cheers,
      J

  10. krushna says

    yes..i am also interested to know ..where to write the code. if there will be example that wud be great.

  11. Keith Davis says

    Hi boys
    Where do you add the code…

    What file do you add it to and where abouts in the file?

    My theme already uses shortcodes but it would still be interesting to know.

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.