A tag like [center]
will still require a plugin but you’re correct @Steven
At the time of this component’s creation you had to use HTML <div>
tags. However, you can now use [wrap="foo"][/wrap]
in themes / components.
You can read more about that here
Here’s a simple example
[wrap="center"]
Some center aligned text
[/wrap]
would create this markup when the post is cooked
<div class="d-wrap" data-wrap="center">
<p>Some center aligned text</p>
</div>
which you can then target with a CSS attribute selector like so
[data-wrap="center"] {
text-align: center;
}
and that would create something like this in both the composer preview and the rendered post
or
[wrap="right"]
Some right aligned text
[/wrap]
and that would result in this cooked markup
<div class="d-wrap" data-wrap="right">
<p>Some center aligned text</p>
</div>
You can then add this CSS
[data-wrap="right"] {
text-align: right;
}
for this result
Since the component currently uses the HTML align
attribute, this change should be 100% backwards compatible.
Give it a go whenever you have the time and feel free to PM me if you have any questions about that.