Inhaltsverzeichnis<\/h2>\n \n - Understanding Shortcodes<\/a><\/li>\n
- Why Use Shortcodes in WordPress?<\/a>\n <\/li>
- Methods to Add a Shortcode in WordPress<\/a>\n
\n - Add a Shortcode Using Block Editor (Gutenberg)<\/a><\/li>\n
- Add a Shortcode Using the Classic Editor<\/a><\/li>\n
- Add a Shortcode Within WordPress Widget<\/a><\/li>\n
- Add a Shortcode Within WordPress Theme Files\u00a0<\/a><\/li>\n \n <\/ul>\n <\/li>\n
- How to Create Your Custom Shortcode in WordPress<\/a><\/li>\n
- H\u00e4ufig gestellte Fragen<\/a><\/li>\n
- Fazit<\/a><\/li>\n <\/ol>\n<\/div>\n\n\n\n
1<\/span> Understanding Shortcodes<\/h2>\n\n\n\nShortcodes make it easy for you to add extra functionality to your WordPress site without touching complicated code. <\/p>\n\n\n\n
They\u2019re simply pieces of text placed inside square brackets. When you insert a shortcode into your post, page, or widget, WordPress automatically replaces it with the intended feature on the front end.<\/p>\n\n\n\n
These shortcodes are enclosed in square brackets. For instance, if you set up your Local SEO using the Rank Math SEO plugin<\/a>, you’ll need to use the shortcode to display your business information, which will look like this: <\/p>\n\n\n\n[rank_math_contact_info]<\/code><\/pre>\n\n\n\nAll you need to do is paste it where you want it, and WordPress does the rest.<\/p>\n\n\n\n
Sometimes, you may want even more flexibility, like showing related posts, adding banner ads, or displaying image galleries. This is where the Shortcode API<\/strong> comes in. It allows developers to create custom shortcodes so you can use advanced features without needing coding knowledge.<\/p>\n\n\n\n2<\/span> Why Use Shortcodes in WordPress?<\/h2>\n\n\n\nThere are a few reasons you might want to add a shortcode to your WordPress site:<\/p>\n\n\n\n
\n- Einfach zu verwenden:<\/strong> Even if you don’t have coding experience, you can still use shortcodes to add powerful functionality to your site.<\/li>\n\n\n\n
- Versatile:<\/strong> Shortcodes are available for almost everything, from adding contact forms to displaying sliders and creating custom buttons.<\/li>\n\n\n\n
- Portable:<\/strong> If you switch themes or plugins, your shortcodes will still work if the theme or plugin that generated the shortcode remains active.<\/li>\n<\/ul>\n\n\n\n
3<\/span> Methods to Add a Shortcode in WordPress<\/h2>\n\n\n\nNow, let’s discuss ways to add shortcodes to your WordPress website.<\/p>\n\n\n\n
3.1<\/span> Add a Shortcode Using Block Editor (Gutenberg)<\/h3>\n\n\n\nTo add a shortcode using the Block Editor, start by navigating to the Seiten<\/strong> oder Beitr\u00e4ge<\/strong> section, depending on where you want to add the shortcode.<\/p>\n\n\n\nIn the Block Editor, click the +<\/strong> icon, search for the Kurzwahl<\/strong> block, and add it to your page or post, as shown below.<\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/add-shortcode-gutenberg.jpeg\")
<\/figure>\n\n\n\nOnce the Shortcode block is added, you’ll see a field where you can enter your shortcode. Enter the desired shortcode, including any necessary parameters within the shortcode if required.<\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/add-your-shortcode.jpeg\")
<\/figure>\n\n\n\nOnce done, publish or update your page or post to make the shortcode live on your website.<\/p>\n\n\n\n
3.2<\/span> Add a Shortcode Using the Classic Editor<\/h3>\n\n\n\nTo add a shortcode in the Classic editor, navigate to the Seiten<\/strong> oder Beitr\u00e4ge<\/strong> section, depending on where you want to add the shortcode. <\/p>\n\n\n\nEnter the desired shortcode, including any necessary parameters within the shortcode if required.<\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/add-shortcode-classic-editor.jpeg\")
<\/figure>\n\n\n\nWenn Sie fertig sind, klicken Sie auf Publish\/Update <\/strong>Schaltfl\u00e4che, um Ihre \u00c4nderungen zu speichern.<\/p>\n\n\n\n3.3<\/span> Add a Shortcode Within WordPress Widget<\/h3>\n\n\n\nYou can add a shortcode in your WordPress website’s widget areas, allowing them to appear on the sidebar, footer, or header.<\/p>\n\n\n\n
To begin, navigate to Appearance \u2192 Widgets<\/strong> on your WordPress dashboard. Then, locate the widget area where you wish to insert the shortcode.<\/p>\n\n\n\n![\"Navigate](\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/widget-area.jpeg\")
<\/figure>\n\n\n\nNext, click on the +<\/strong> icon, search for the Shortcode block, and either drag and drop it or click to place it in the desired area.<\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/add-shortcode-in-widget.jpeg\")
<\/figure>\n\n\n\nAfter adding the shortcode block, you can insert the desired shortcode within the area.<\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/shortocde-widget-area.jpeg\")
<\/figure>\n\n\n\nThen, save the changes, and now the shortcode will be active in the widget area you selected. <\/p>\n\n\n\n
3.4<\/span> Add a Shortcode Within WordPress Theme Files <\/h3>\n\n\n\nShortcodes within WordPress theme files can add custom functionality to your website without relying on plugins. <\/p>\n\n\n\n
To do this, access the theme file where you intend to add a shortcode, such as page.php, single.php, or a custom template file, and use the do_shortcode<\/code> function provided by WordPress.<\/p>\n\n\n\nSimply pass the shortcode as a parameter to this function, and it will display the corresponding output. <\/p>\n\n\n\n
For example, if you have a shortcode called [your_shortcode]<\/code>,you can add it to your theme file like this:<\/p>\n\n\n\n<?php echo do_shortcode(\"[your_shortcode]\"); ?><\/code><\/p>\n\n\n\n![\"Add](\"https:\/\/rankmath.com\/wp-content\/uploads\/2024\/02\/add-shortcode-code.jpeg\")
<\/figure>\n\n\n\nOnce you’ve added the shortcode, remember to save your changes.<\/p>\n\n\n\n
However, remember that your changes may get lost when the theme is updated, so it’s best to use a child theme<\/a> when adding custom code to your theme files.<\/p>\n\n\n\n4<\/span> How to Create Your Custom Shortcode in WordPress<\/h2>\n\n\n\nShortcodes are handy for adding dynamic content or custom code to WordPress posts and pages, but creating a custom shortcode requires coding skills.<\/p>\n\n\n\n
If you’re comfortable with PHP, use the following template code.<\/p>\n\n\n\n
\/\/ Define a custom shortcode function\nfunction custom_shortcode() {\n \/\/ Define the desired functionality\n $message = 'This is my custom shortcode!';\n\n \/\/ Return the output\n return $message;\n}\n\n\/\/ Register the shortcode\nadd_shortcode('my_shortcode', 'custom_shortcode');<\/code><\/pre>\n\n\n\n
- \n
- Add a Shortcode Using Block Editor (Gutenberg)<\/a><\/li>\n
- Add a Shortcode Using the Classic Editor<\/a><\/li>\n
- Add a Shortcode Within WordPress Widget<\/a><\/li>\n
- Add a Shortcode Within WordPress Theme Files\u00a0<\/a><\/li>\n \n <\/ul>\n <\/li>\n
- How to Create Your Custom Shortcode in WordPress<\/a><\/li>\n
- H\u00e4ufig gestellte Fragen<\/a><\/li>\n
- Fazit<\/a><\/li>\n <\/ol>\n<\/div>\n\n\n\n
1<\/span> Understanding Shortcodes<\/h2>\n\n\n\n
Shortcodes make it easy for you to add extra functionality to your WordPress site without touching complicated code. <\/p>\n\n\n\n
They\u2019re simply pieces of text placed inside square brackets. When you insert a shortcode into your post, page, or widget, WordPress automatically replaces it with the intended feature on the front end.<\/p>\n\n\n\n
These shortcodes are enclosed in square brackets. For instance, if you set up your Local SEO using the Rank Math SEO plugin<\/a>, you’ll need to use the shortcode to display your business information, which will look like this: <\/p>\n\n\n\n
[rank_math_contact_info]<\/code><\/pre>\n\n\n\nAll you need to do is paste it where you want it, and WordPress does the rest.<\/p>\n\n\n\n
Sometimes, you may want even more flexibility, like showing related posts, adding banner ads, or displaying image galleries. This is where the Shortcode API<\/strong> comes in. It allows developers to create custom shortcodes so you can use advanced features without needing coding knowledge.<\/p>\n\n\n\n
2<\/span> Why Use Shortcodes in WordPress?<\/h2>\n\n\n\n
There are a few reasons you might want to add a shortcode to your WordPress site:<\/p>\n\n\n\n
- \n
- Einfach zu verwenden:<\/strong> Even if you don’t have coding experience, you can still use shortcodes to add powerful functionality to your site.<\/li>\n\n\n\n
- Versatile:<\/strong> Shortcodes are available for almost everything, from adding contact forms to displaying sliders and creating custom buttons.<\/li>\n\n\n\n
- Portable:<\/strong> If you switch themes or plugins, your shortcodes will still work if the theme or plugin that generated the shortcode remains active.<\/li>\n<\/ul>\n\n\n\n
3<\/span> Methods to Add a Shortcode in WordPress<\/h2>\n\n\n\n
Now, let’s discuss ways to add shortcodes to your WordPress website.<\/p>\n\n\n\n
3.1<\/span> Add a Shortcode Using Block Editor (Gutenberg)<\/h3>\n\n\n\n
To add a shortcode using the Block Editor, start by navigating to the Seiten<\/strong> oder Beitr\u00e4ge<\/strong> section, depending on where you want to add the shortcode.<\/p>\n\n\n\n
In the Block Editor, click the +<\/strong> icon, search for the Kurzwahl<\/strong> block, and add it to your page or post, as shown below.<\/p>\n\n\n\n
<\/figure>\n\n\n\nOnce the Shortcode block is added, you’ll see a field where you can enter your shortcode. Enter the desired shortcode, including any necessary parameters within the shortcode if required.<\/p>\n\n\n\n
<\/figure>\n\n\n\nOnce done, publish or update your page or post to make the shortcode live on your website.<\/p>\n\n\n\n
3.2<\/span> Add a Shortcode Using the Classic Editor<\/h3>\n\n\n\n
To add a shortcode in the Classic editor, navigate to the Seiten<\/strong> oder Beitr\u00e4ge<\/strong> section, depending on where you want to add the shortcode. <\/p>\n\n\n\n
Enter the desired shortcode, including any necessary parameters within the shortcode if required.<\/p>\n\n\n\n
<\/figure>\n\n\n\nWenn Sie fertig sind, klicken Sie auf Publish\/Update <\/strong>Schaltfl\u00e4che, um Ihre \u00c4nderungen zu speichern.<\/p>\n\n\n\n
3.3<\/span> Add a Shortcode Within WordPress Widget<\/h3>\n\n\n\n
You can add a shortcode in your WordPress website’s widget areas, allowing them to appear on the sidebar, footer, or header.<\/p>\n\n\n\n
To begin, navigate to Appearance \u2192 Widgets<\/strong> on your WordPress dashboard. Then, locate the widget area where you wish to insert the shortcode.<\/p>\n\n\n\n
<\/figure>\n\n\n\nNext, click on the +<\/strong> icon, search for the Shortcode block, and either drag and drop it or click to place it in the desired area.<\/p>\n\n\n\n
<\/figure>\n\n\n\nAfter adding the shortcode block, you can insert the desired shortcode within the area.<\/p>\n\n\n\n
<\/figure>\n\n\n\nThen, save the changes, and now the shortcode will be active in the widget area you selected. <\/p>\n\n\n\n
3.4<\/span> Add a Shortcode Within WordPress Theme Files <\/h3>\n\n\n\n
Shortcodes within WordPress theme files can add custom functionality to your website without relying on plugins. <\/p>\n\n\n\n
To do this, access the theme file where you intend to add a shortcode, such as page.php, single.php, or a custom template file, and use the
do_shortcode<\/code> function provided by WordPress.<\/p>\n\n\n\nSimply pass the shortcode as a parameter to this function, and it will display the corresponding output. <\/p>\n\n\n\n
For example, if you have a shortcode called
[your_shortcode]<\/code>,you can add it to your theme file like this:<\/p>\n\n\n\n<?php echo do_shortcode(\"[your_shortcode]\"); ?><\/code><\/p>\n\n\n\n<\/figure>\n\n\n\nOnce you’ve added the shortcode, remember to save your changes.<\/p>\n\n\n\n
However, remember that your changes may get lost when the theme is updated, so it’s best to use a child theme<\/a> when adding custom code to your theme files.<\/p>\n\n\n\n
4<\/span> How to Create Your Custom Shortcode in WordPress<\/h2>\n\n\n\n
Shortcodes are handy for adding dynamic content or custom code to WordPress posts and pages, but creating a custom shortcode requires coding skills.<\/p>\n\n\n\n
If you’re comfortable with PHP, use the following template code.<\/p>\n\n\n\n
\/\/ Define a custom shortcode function\nfunction custom_shortcode() {\n \/\/ Define the desired functionality\n $message = 'This is my custom shortcode!';\n\n \/\/ Return the output\n return $message;\n}\n\n\/\/ Register the shortcode\nadd_shortcode('my_shortcode', 'custom_shortcode');<\/code><\/pre>\n\n\n\n - Versatile:<\/strong> Shortcodes are available for almost everything, from adding contact forms to displaying sliders and creating custom buttons.<\/li>\n\n\n\n
- Add a Shortcode Using the Classic Editor<\/a><\/li>\n