# Ordering blocks properly

**One of the more common tasks in the Loki Checkout is to reposition blocks. This can simply be done by using the XML layout block attributes `before` and `after`. However once in a while, you will get stuck with this. Because of this, a lot of the container blocks also offer an attribute `sort_order` instead.**

Take for instance, a field in an address form: Because every field is actually a child block to a parent block of the form, you can simply use the XML layout to customize the way blocks are positioned relative to each other:

```xml
<move element="loki.checkout.shipping-step.shipping-address.street0" 
      destination="loki.checkout.shipping-step.address-form" 
      before="loki.checkout.shipping-step.shipping-address.street0"/>
```

However, if you want the position of `street0` to be exactly between 2 other fields, often you will find yourself also repositioning the other fields as well. This quickly becomes a mess. And even worse, because it is not always evident in which order specific layout updates are loaded, it might simply not work.

## Using `Loki\Components\Util\Block\ChildRenderer` instead
Because re-ordering fields is so common, a specific ViewModel `Loki\Components\Util\Block\ChildRenderer` attempts to make things easier. This ViewModel is inserted into any PHTML template as `$childRenderer`:

```php
use Loki\Components\Util\Block\ChildRenderer;

/** @var ChildRenderer $childRenderer */
```

Next, it is used to simply loop through the child blocks where needed:
```php
<?= /* @noEscape */ $childRenderer->all($block); ?>
```

## Re-ordering blocks
By using the XML layout `sort_order` argument for your block, you can now change the ordering of a specific block:

```xml
<referenceBlock name="loki.checkout.shipping-step.shipping-address.street0">
    <arguments>
        <argument name="sort_order" xsi:type="number">2</argument>
    </arguments>
</referenceBlock>
```

## Deprecated class `LokiCheckout\Core\Util\Block\SortedBlocks`
Earlier the ViewModel class `LokiCheckout\Core\Util\Block\SortedBlocks` offered the same feature. This class has been deprecated though.