A Shortcode Tester

The Shortcode Tester is a post editor tool for WordPress developers that displays in a popup window the HTML generated by WordPress shortcodes, i.e. so you can quickly view the generated HTML without having to view the entire post. Please visit https://github.com/magenta-cuda/shortcode-tester/blob/master/README.md for a very quick introduction.

1. Download the plugin from the WordPress repository.
2. Open the ‘Plugins’ menu item and activate the plugin.
3. Read the tutorial at https://github.com/magenta-cuda/shortcode-tester/blob/master/README.md.

“Show Rendered” shows more than the shortcode HTML elements.

“The Shortcode Tester” tries to hide HTML elements that are not part of the shortcode. It assumes that the current theme uses the standard WordPress framework for emitting the header, the content, sidebars and the footer ( actions/filters such as ‘the_content’, ‘get_sidebar’, ‘get_footer’, … ). If the current theme deviates from this framework “The Shortcode Tester” will not be able to properly identify the header, sidebars and/or the footer.

“Show Rendered” shows less than the shortcode HTML elements.

In addition to the HTML elements emitted by the PHP code for the shortcode, the shortcode may have JavaScript code to dynamically emit additional HTML elements. The shortcode tester hides non shortcode HTML elements by setting the CSS display property to none and changing the element id. These changes may affect the execution of the shortcode’s JavaScript code.

“Show Rendered” vs “Alt Show Rendered”

“Show Rendered” allows all JavaScript code to execute. Unfortunately, the shortcode tester hides non shortcode HTML elements and this may cause some JavaScript code to abort which prevents the execution of the shortcode’s JavaScript code. “Alt Show Rendered” suppresses the execution of the theme’s JavaScript code and this may allow the shortcode’s JavaScript code to execute.

Does “Show Rendered” require that the shortcode have support for Gutenberg blocks?

No. “Show Rendered” does not use Gutenberg blocks. It uses the WordPress server to render the shortcode as it would when the page is requested from the browser and tries to skip rendering everything but the shortcode. In particular, it will work with old plugins that do not have support for Gutenberg blocks.

1. 

   The Shortcode Tester

1.2.2

• added “Alt Show Rendered” button which prevent the theme’s scripts from running

1.2.1

• fix problem with non permalink URL’s
• fix “permalink not found” error after updating to WordPress 5.3
• fix problem with “Show Rendered” on posts of type ‘post’

1.2

• add support for Gutenberg

1.1.1.1

• fix major bug where shortcode evaluation was wrong if it was dependent on is_admin() === false

1.1.1

• disable false warnings from DOMDocument

1.1

• add prettify option
• refactor to improve software quality

1.0.1.1

• Code rewritten to improve software quality

1.0.1

• Fix namespace problem

1.0

• Initial release.