Examples – The Content Attribute

So far, the embeds in the examples have been limited to embedding simple snippets of HTML into blog posts, but there is another, more powerful way to use embeds. You can use embeds to create custom tags for your post content.

If I want to be able to quickly highlight certain text strings in my posts in different colors, for example, I can create a couple of embeds to do this, one for the foreground (text) color, and the other for the background color:

 Name: fg
Value: <span style="color:%col%">%content%</span>

 Name: bg
Value: <span style="color:%col%">%content%</span>

I have defined two attributes in the embeds:

%col% is a standard attribute used to set the color of the text

%content% however, is a special attribute, and tells the plugin where to put the text enclosed between the embed’s begin and end tags.

Here is a simple example:

The quick [bg col="#deb887"]brown fox[/bg] jumps over the
[fg col="green"]lazy dog[/fg].

Notice how both the bg and fg embeds use a begin tag and an end tag (which starts with [/). The %content% attribute is replaced by the text/HTML between the embed’s start and end tags—“brown fox” for the first embed, and “lazy dog” for the second. And here is the result:

The quick brown fox jumps over the lazy dog.

You can also nest one embed inside another:

Able [bg col="darkseagreen"]was I [fg col="yellow"]ere[/fg]
I saw[/bg] Elba.

Able was I ere I saw Elba.

Now before you go rushing off to try this yourself, I should warn you that there is a bug in WordPress that prevents you from nesting two embeds with the same name. The example above works fine because you are nesting fg inside bg but when you try this:

Able [bg col="darkseagreen"]was I [bg col="yellow"]ere[/bg] I saw[/bg] Elba.

You get this:

Able was I ere I saw Elba.

Which is not at all what you want. The problem is that WordPress doesn’t support nesting a shortcode (the tags used by the embeds) inside another with the same name. If you try it, WordPress just gets confused.

But all is not lost! The Embedder plugin can’t fix the problem but it can provide a workaround. If you really want to nest two of the same embeds like this, then you can add a single digit to the end of the nested tag, like this:

Able [bg col="darkseagreen"]was I [bg2 col="yellow"]ere[/bg2]
I saw[/bg] Elba.

(Note: you must remember to add the extra digit to both the matching begin and end tags.)

When Embedder sees the bg2 tag, it first checks to see if you have an embed called bg2 (just in case). If you don’t, it removes the 2 from the end of the tag, finds the bg embed, and uses that instead. Thus, you get the desired result:

Able was I [bg2 col=”yellow”]ere[/bg2] I saw Elba.

You can append one digit (0-9) to the end of any embed name, so including the original name (without a digit), you can nest the same embed up to 11 levels deep, which should be more than enough for just about anything you need.

There are plans to rework the WordPress shortcode code and fix the nesting issues, but in the meantime, you can use this feature of the plugin instead.

Comments are closed.