Do you want to know how to use shortcodes in your WordPress theme? Usually, shortcodes are used in content areas like posts, pages, or sidebar widgets. But sometimes, you might want to add a shortcode directly into your WordPress theme. In this article, we will guide you through the steps to easily add any shortcode to your WordPress theme.
Why Use Shortcodes in Your WordPress Themes?
Shortcodes can add many features to your website, like image galleries, forms, social media feeds, and more. WordPress has some built-in shortcodes, but many popular plugins also offer them. For example, WPForms provides shortcodes to add forms to different areas of your site.
Typically, shortcodes are added in content areas like posts and pages. You can learn more about this in our complete guide on how to add a shortcode in WordPress. However, sometimes you might want to use a shortcode within your theme files. This helps add dynamic elements to areas that can’t be edited using the standard post editor, like your archive page, or use the same shortcode on multiple pages.
Here are three methods to add shortcodes to your WordPress theme:
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, which allows you to add a Shortcode block to any part of your site. However, this method only works with block-based themes.
- Go to Appearance » Editor in the WordPress dashboard.
- By default, the full-site editor shows your theme’s home template. To add shortcodes, select Templates.
- Click on the template you want to edit. For example, we’ll use the 404 page template.
- Click on the pencil icon to edit the template.
- Click the blue + icon in the top left corner and type Shortcode in the search bar.
- Drag and drop the Shortcode block onto the template.
- Paste or type the shortcode you want to use.
- Click Save to store your changes.
- Visit your site to see the shortcode in action.
Method 2: Editing Your WordPress Theme Files (Works With Any WordPress Theme)
You can also add shortcodes by editing your theme files, which is a more advanced method but works with any theme.
- If you haven’t added code before, refer to our guide on how to copy and paste code in WordPress.
- Instead of modifying theme files directly, create a child theme to avoid losing customization during updates.
- Add the shortcode to your theme files using the
do_shortcode
function. For example:
echo do_shortcode(‘‘);
- Replace ‘gallery’ with the shortcode you want to use.
- 4. If using a shortcode with extra parameters, use the form’s ID, like this:
- echo do_shortcode(“[wpforms id=’92’]”);
- If the shortcode isn’t working, ensure the plugin providing the shortcode is installed and activated.
- You can check if a shortcode is available by adding the
shortcode_exists()
function to your index.php file: - if ( shortcode_exists( ‘wpforms’ )) {
echo do_shortcode(“[wpforms id=’147′]”);
}
-
- If the shortcode output still doesn’t appear, try clearing the WordPress cache.
Method 3: Creating Your Own WordPress Theme (Fully Customizable)
Another advanced option is to create a custom WordPress theme, which allows you to add as many shortcodes as you want and make other custom changes.
- Use SeedProd to create a custom theme without writing code. SeedProd includes a theme builder and site kits/templates for drag-and-drop design.
- For step-by-step instructions, see our guide on how to create a custom WordPress theme.
- After creating a theme, go to SeedProd » Theme Builder to add shortcodes.
- Find the template where you want to use the shortcode, hover over it, and click Edit Design.
- In the left menu, go to the Advanced section, find the Shortcode block, and drag it into your layout.
- Add your shortcode to the Shortcode box.
- Click the Show Shortcode Option toggle to see the shortcode output in the live preview.
- Use the Advanced tab to style the shortcode output, change spacing, add custom CSS, or animation effects.
- Click Save and then Publish to make the shortcode live.
- Visit your site to see the custom shortcode in action.
By following these methods, you can easily add shortcodes to your WordPress theme, enhancing your site’s functionality and design.