Create a Custom Shortcode in WordPress for HTML Display

Explore our WordPress category, where you’ll find loads of helpful articles and tutorials for everyone, whether you’re just starting out or a pro developer. Learn about different WordPress themes and plugins that can be applied in various projects according to their specific requirements.
This WordPress code defines a custom shortcode named ‘custom_shortcode’ using the add_shortcode function. Shortcodes in WordPress allow users to embed dynamic content or execute custom functions within posts or pages by inserting a simple tag.
The custom_shortcode function, associated with the ‘custom_shortcode’ shortcode, utilizes output buffering (with ob_start() and ob_get_clean()) to capture and return any content generated within the function. Currently, the function includes an empty space where you can insert your specific content or functionality.
To customize the shortcode’s behavior, you can modify the content within the custom_shortcode function, adding HTML, PHP, or any other WordPress-related code. Once added, this shortcode can be used in the WordPress editor by enclosing it in square brackets, like [custom_shortcode], and will render the output specified in the function when the post or page is viewed.
function custom_shortcode() {
ob_start(); ?>
<div>
<!-- Your custom content or functionality goes here -->
<p>This is my custom shortcode content.</p>
</div>
<?php
return ob_get_clean();
}
add_shortcode('custom_shortcode', 'custom_shortcode');