In some circumstances you may need to use HTML tags in the Wordpress content editor. The easiest way is to switch into Text mode and add your custom code:
However, you may have users that aren’t comfortable editing raw HTML, or they may get lost without the styling cues of the Visual editor. In those cases you can add this shortcode to the
functions.php file in your theme:
Now you can add HTML tags without leaving Visual mode using the
[tag] accepts four optional parameters. The parameter
type lets you specify the tag, like
iframe, or anything else you might need. If you don’t specify
type, it defaults to
div. You can use
class to set the – you guessed it – id and classes applied to your tag. Lastly, you have
style if you need to specify an inline style.
[tag] can wrap content and as a result does not self-close1. You will need to add
[/tag] somewhere after you open it.
[tag type="span" class="example-red" id="red-span" style="color: red"]RED TEXT[/tag] will output
<span class="example-red" id="red-span" style="color: red">RED TEXT</span>. This is what it would look like in the Visual editor: