> ## Documentation Index
> Fetch the complete documentation index at: https://docs.usedynamite.com/llms.txt
> Use this file to discover all available pages before exploring further.

> ## Agent Instructions
> Read /start/capabilities before choosing an integration. Use the deployed server’s tools/list for current tool inputs.

# Ordering

> Change the order of existing sections or cards.

An order target moves existing elements. Each variant is a complete sequence of the same item IDs.

## Map the items

For this page:

```html theme={null}
<main data-personalize="body-order">
  <section id="overview">…</section>
  <aside class="sponsor">…</aside>
  <section id="proof">…</section>
  <section id="details">…</section>
</main>
```

Define the movable items and allowed orders:

```json theme={null}
{
  "id": "body-order",
  "selector": "[data-personalize='body-order']",
  "description": "Order the supporting sections while preserving the sponsor slot",
  "mode": "order",
  "order": {
    "items": [
      { "id": "overview", "selector": "#overview" },
      { "id": "proof", "selector": "#proof" },
      { "id": "details", "selector": "#details" }
    ]
  },
  "defaultVariant": "original",
  "variants": [
    {
      "id": "original", "description": "Original sequence",
      "hypothesis": "Broad introduction first", "audiences": [],
      "value": "[\"overview\",\"proof\",\"details\"]"
    },
    {
      "id": "proof-first", "description": "Customer proof first",
      "hypothesis": "Visitors evaluating the product benefit from evidence first",
      "audiences": [], "value": "[\"proof\",\"overview\",\"details\"]"
    }
  ]
}
```

Save this target through [configuration as code](https://docs.usedynamite.com/agents/config-as-code.md) and bind it to the page.

The sponsor stays in its slot. Mapped nodes move with their existing handlers and state.

## When an order can change

Automatic ordering stops once the list has been visible or interacted with. It also skips a currently visible or focused list. A manual preview can still show each order.

Use this for sections below the fold. If the initial order above the fold is essential, use server rendering.

> [accordion] Mapping and restoration
>
> Each selector must identify one direct child, either by matching the child or a descendant. Different items must resolve to different children. Every variant includes every item ID exactly once.
>
> Missing, ambiguous, or replaced nodes invalidate the mapping. Appended items stay in place. Restoration returns captured nodes to their original mapped slots.

> [accordion] Legacy and server-side ordering
>
> Without `order.items`, the legacy adapter requires a `data-section` ID on every child and reorders all children. It lacks the native adapter’s unmapped-slot preservation and visibility lock.
>
> For omitted blocks and multi-pass selection, use the separate [funnel library](https://docs.usedynamite.com/internals/decision-pipeline.md#the-adaptive-library-is-a-separate-integration).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.