Repeatables

Repeatables are chunks of content that can be duplicated, reordered, and deleted as a single element. Examples include event listings, testimonials, blog excerpts, or anything else that gets grouped together and shares the same HTML structure.

Repeatables can only be placed inside block regions and inline regions. To define a repeatable, add the cms-repeatable class to any element.

<div id="content" class="cms-editable">

  <!-- This element is repeatable -->
  <div class="cms-repeatable">
    <h3>Lorem Ipsum</h3>
    <p>Lorem ipsum dolor...</p>
    <a href="#">Read more</a>
  </div>

</div>

When you focus on a repeatable in the editor, a toolbar will appear above it letting you move it, duplicate it, or delete it.

Screenshot of the repeatable toolbar.


Advanced Usage

If you want to preserve the structure of your repeatables, read up on lockables. These special classes give you the power to lock elements, making only certain things inside of them editable.

You can also use repeatables inside blocks. This is a great way to add repeatables to a page without having to duplicate existing ones.