Repeatable regions are chunks of content that can be repeated, reordered, and deleted. They are particularly useful for things like articles, event listings, navigation menus, or anything else that has a dynamic number of items requiring the same HTML structure. There is no limit to the number of repeatable regions you can have.
To define a repeatable region, simply add the repeatable class to any element
inside of an editable region. The code in the following example will allow you
to add, remove, and reorder additional regions of content that share the exact same
structure as the original, including all its classes:
<div id="my-content" class="editable">
<div class="repeatable">
<h1>Article Title</h1>
<p class="date">August 20, 2012</p>
<p>Lorem ipsum dolor sit amet...</p>
</div>
</div>
Repeatable regions should not contain id attributes, as they
cannot be repeated without compromising their uniqueness. Always use
class attributes instead.
Repeatable regions are grouped by their siblings. That is, if a region comes immediately before or after another region, they will be considered part of the same group. By design, regions can only be moved up or down within the same group.
Repeatable regions can be manipulated using the repeatable regions menu in the toolbar. You can also use the shortcut keys shown in the dropdown menu.