Add shortcodes to WordPress pages, posts, widgets, theme files and the Block Editor — manually or with Shortcodes Ultimate.
WordPress shortcodes are small pieces of code wrapped in square brackets, such as [gallery] or [su_button]. They let you insert dynamic content, buttons, tabs, accordions, galleries, videos, boxes and other content elements without writing full HTML, CSS or PHP.
With Shortcodes Ultimate, you can generate and insert ready-made shortcodes visually, preview them before publishing, and use them in the Block Editor, Classic Editor, widgets and theme template files.
Install Shortcodes Ultimate for Free
To use a shortcode in WordPress, copy the shortcode provided by WordPress, your theme, or a plugin, then paste it into a place where WordPress processes shortcodes.
| Where you want to add it | Best method |
|---|---|
| Page or post in the Block Editor | Add a Shortcode block and paste the shortcode |
| Classic Editor | Paste the shortcode directly into the content |
| Widget area or sidebar | Add a Shortcode block or compatible widget |
| Theme file | Use do_shortcode() in PHP |
| Page builder | Use a shortcode widget or module if your builder supports it |
Example:
[su_button url="https://example.com"]Download Now[/su_button]
When the page is viewed on the front end, WordPress replaces the shortcode with the actual button, gallery, tab, accordion or other content element.
A WordPress shortcode is a shortcut that tells WordPress to output something more complex than plain text. Instead of writing full code, you place a small tag inside square brackets.
For example:
[gallery ids="12,34,56"]
A shortcode can also include attributes:
[su_button url="https://example.com" target="blank" style="flat"]Visit Website[/su_button]
In this example:
su_button is the shortcode name.url, target and style are attributes.Visit Website is the content inside the shortcode.Shortcodes are useful when you want reusable elements that can work across different parts of a WordPress site.
The easiest manual method is to use the built-in Shortcode block.
Go to Pages or Posts, then open the content where you want to add the shortcode.
Click the + button and search for Shortcode. You can also type:
/shortcode
Then press Enter.
Paste your shortcode into the block:
[su_spoiler title="Read more"]Hidden content goes here[/su_spoiler]
In the editor, you may still see the shortcode text. On the front end, WordPress will render the shortcode output.
Insert Shortcodes Faster with Shortcodes Ultimate
Manual shortcodes work, but writing shortcode syntax by hand can be slow. You need to remember the shortcode name, available attributes, formatting rules and correct closing tags.
Shortcodes Ultimate simplifies the process:
Instead of memorizing shortcode syntax, you can build elements like buttons, spoilers, tabs, accordions, boxes, columns, sliders, carousels and media embeds through a visual workflow.
Install Shortcodes Ultimate Free
Free plugin. Works with modern and classic WordPress workflows.
Shortcodes are flexible because they can be used in multiple areas of a WordPress site.
Use a Shortcode block in the Block Editor, or paste the shortcode directly into the Classic Editor.
Example:
[su_tabs]
[su_tab title="Overview"]Product overview text[/su_tab]
[su_tab title="Details"]Product details text[/su_tab]
[/su_tabs]
This is useful for landing pages, documentation, product pages, affiliate content and long-form posts.
To add a shortcode to a widget area:
Example:
[su_button url="/contact"]Contact Us[/su_button]
This is useful for sidebar CTAs, footer buttons, promo boxes, contact forms and reusable content blocks.
If a shortcode appears as plain text instead of rendering, the widget area, theme or plugin may not be processing shortcodes in that location. In that case, use a Shortcode block, a plugin-supported widget, or ask a developer to enable shortcode processing safely.
Developers can output shortcodes inside PHP theme files using do_shortcode().
Example:
<?php echo do_shortcode('[su_button url="https://example.com"]Click me[/su_button]'); ?>
You might use this in files such as:
single.php
page.php
header.php
footer.php
sidebar.php
template-parts/content.php
Use this carefully. Only place shortcode strings you control inside template files, and avoid processing untrusted user input.
If your landing page has a custom PHP template, you can add a shortcode directly to the template:
<section class="landing-cta">
<?php echo do_shortcode('[su_button url="/pricing" style="flat"]View Pricing[/su_button]'); ?>
</section>
This is useful when you want a shortcode-powered section to appear automatically across specific templates.
Many WordPress page builders include a shortcode widget or shortcode module. In that case, copy the shortcode generated by Shortcodes Ultimate and paste it into the builder’s shortcode element.
This is useful when you are building a page visually but still want reusable shortcode-powered components.
Here are common shortcode patterns you may see in WordPress.
[gallery]
[gallery columns="3" size="medium"]
[su_box title="Important Note"]
Your content goes here.
[/su_box]
[su_tabs]
[su_tab title="First tab"]First tab content[/su_tab]
[su_tab title="Second tab"]Second tab content[/su_tab]
[/su_tabs]
<?php echo do_shortcode('[su_spoiler title="FAQ"]Answer text goes here[/su_spoiler]'); ?>
You can use WordPress shortcodes manually, but a shortcode plugin saves time when you need polished content elements without custom development.
With Shortcodes Ultimate, you can:
Install Shortcodes Ultimate for Free
Use expandable sections to make long content easier to scan.
[su_spoiler title="Can I use shortcodes in widgets?"]
Yes, you can use shortcodes in supported widget areas.
[/su_spoiler]
Add buttons without writing CSS.
[su_button url="/download"]Download Now[/su_button]
Organize long content into compact sections.
[su_tabs]
[su_tab title="Features"]Feature list[/su_tab]
[su_tab title="FAQ"]FAQ content[/su_tab]
[/su_tabs]
Highlight important messages.
[su_note]This is an important note for readers.[/su_note]
Insert media-focused elements without building everything from scratch.
Install Shortcodes Ultimate Free from WordPress.org
No coding required for common content elements.
This usually means WordPress is not processing shortcodes in that location. Try using a Shortcode block or placing the shortcode inside the main page/post content.
If a plugin is disabled, WordPress may show the shortcode text instead of the output. Make sure the plugin that created the shortcode is installed and active.
Check for missing brackets, misspelled attributes or missing closing tags.
Incorrect:
[su_button url="/contact"Contact[/su_button]
Correct:
[su_button url="/contact"]Contact[/su_button]
Do not paste this into the WordPress editor:
<?php echo do_shortcode('[your_shortcode]'); ?>
Use PHP only in theme or plugin files. In the editor, paste only the shortcode:
[your_shortcode]
Some shortcode outputs require CSS or JavaScript. If the output looks broken, check plugin settings, theme compatibility and whether scripts are loading correctly.
Use shortcodes for reusable, structured content elements, but keep your pages clean and maintainable.
Recommended practices:
Shortcodes are one of the easiest ways to add reusable content elements to WordPress. You can paste them into pages, posts, widgets and supported page builders, or output them in theme files with PHP.
If you want to create buttons, tabs, accordions, boxes, spoilers, columns, sliders, media elements and other content blocks faster, install Shortcodes Ultimate and use its visual shortcode generator instead of writing shortcode syntax by hand.
Install Shortcodes Ultimate for Free
Add a Shortcode block in the WordPress editor, paste the shortcode into the block, then preview or publish the page. In the Classic Editor, you can usually paste the shortcode directly into the content.
Yes. WordPress includes a Shortcode block. Add the block, paste the shortcode and view the page on the front end to see the rendered result.
Yes, in supported widget areas. Go to Appearance → Widgets, add a Shortcode block, paste your shortcode and save. If it appears as plain text, that widget area may not be processing shortcodes.
Use the do_shortcode() function in a PHP template file:
<?php echo do_shortcode('[your_shortcode]'); ?>
Only use this with shortcode strings you control.
The easiest manual way is the Shortcode block. The easiest plugin-assisted way is to use Shortcodes Ultimate, choose a shortcode visually, configure it, preview it and insert the generated shortcode.
Yes. The free version of Shortcodes Ultimate is available from the WordPress.org plugin repository.
Usually, plugin shortcodes continue to work if the plugin remains active. However, styling may change because the new theme can affect spacing, typography and CSS.
The shortcode may be in an area that does not process shortcodes, the shortcode provider plugin may be inactive, or the shortcode syntax may be incorrect.