Change order of blocks via local.xml file

Question

Is it possible to change the order of already existing blocks via the local.xml file? I know you can change the order of a block with the after or before attribute, but how can one change those attributes of existing blocks.

For example, if I want to place the layered navigation block underneath the newsletter subscription block in the left column, how would I do that?

Trimly

Answer 1

You need to perform a small trick, remove child block and add it in new position:

<reference name="parent.block.name">
    <action method="unsetChild">
        <alias>child_block_alias</alias>
    </action>
    <action method="insert">
        <blockName>child.block.name</blockName>
        <siblingName>name_of_block</siblingName>
        <after>1</after>
        <alias>child_block_alias</alias>
    </action>
</reference>

This Layout XML instruction does what you want. Look at this short reference of parameters for insert method:

• blockName is your block unique name across the layout, product.view for example
• siblingName is an block unique name, that is already exists in insertion target block, used for positioning of your block. Leave empty to display it at the top or at the bottom.
• after is a boolean identifier of block position. If equals to 1, then the block will be added after siblingName or in the bottom of the children list if siblingName is empty
• alias is the alias of your block, if it is empty the name of block will be used.

Some Examples:

Move cart sidebar block after recently viewed products

<reference name="right">
    <action method="unsetChild">
        <alias>cart_sidebar</alias>
    </action>
    <action method="insert">
        <blockName>cart_sidebar</blockName>
        <siblingName>right.reports.product.viewed</siblingName>
        <after>1</after>
    </action>
</reference>

Move cart sidebar block before recently viewed products

<reference name="right">
    <action method="unsetChild">
        <alias>cart_sidebar</alias>
    </action>
    <action method="insert">
        <blockName>cart_sidebar</blockName>
        <siblingName>right.reports.product.viewed</siblingName>
        <after>0</after>
    </action>
</reference>

Move cart sidebar block at the end of the right block

<reference name="right">
    <action method="unsetChild">
        <alias>cart_sidebar</alias>
    </action>
    <action method="insert">
        <blockName>cart_sidebar</blockName>
        <siblingName></siblingName>
        <after>1</after>
    </action>
</reference> 

Move cart sidebar block at the top of the left block

<reference name="right">
    <action method="unsetChild">
        <alias>cart_sidebar</alias>
    </action>
</reference>
<reference name="left">
    <action method="insert">
        <blockName>cart_sidebar</blockName>
    </action>
</reference>

Enjoy working with Magento!

Drome

Although I'm aware that the name of the action arguments are irrelevant, you've used s/subling/sibling/g throughout :) – Proglottis

@Nick, yes, only the order of the arguments are important, the name of arguments is not used in method call. – Drome

Hi, Thanks for sharing this tutorial. But I have a beginner question. How can I get the complete list of blocks? – Burck

@Denys: That deserves to be a question of it's own. Page use the Ask Question at the top of the page. – Ivoryivorywhite

Answer 2

You can remove previous layered navigation block and add a new layered navigation block after newsletter block.

<reference name="left">
 <remove name="catalog.leftnav" />
 <block type="catalog/layer_view" name="catalog.leftnavcustom" after="left.newsletter" template="catalog/layer/view.phtml"/>
</reference>

Note that I use a custom name for the new block.

Accolade

Answer 3

The accepted answer didn't work for me (EE1.14) but something close to it, this:

<wishlist_index_index>
    <reference name="customer.wishlist.items">
        <action method="unsetChild">
             <name>customer.wishlist.price</name>
        </action>
        <action method="insert">
            <blockName>customer.wishlist.price</blockName>
            <after>customer.wishlist.qty</after>
        </action>
    </reference>
</wishlist_index_index>

Mllly