Magento 2 Add block before another block using XML

Question

I want to move minicart block to top.links block.

This did the trick for me:

<move element="minicart" destination="top.links" />

Now, I added a custom block with custom .phtml file to the top.links block too:

<referenceBlock name="top.links">
            <block class="Magento\Framework\View\Element\Template" name="fw.account" template="Magento_Theme::html/FlavourWarehouseAccountDropdown.phtml"/>
</referenceBlock>

That works as expected too.

However, I need the block "fw.account" to be rendered before the "minicart". I tried adding the "before" and "after" to blocks but with no success.

How can I add the fw.account block before minicart block? Adding before="minicart" to fw.account block didn't work...

Answer 1

Please use below code to move minicart to toplinks :

<move element="minicart" destination="top.links" after="fw.account" />

Answer 2

<move element="minicart" destination="top.links" before="fw.account" />

Answer 3

I found out that the XML was working correct from the first time. I had a css class on both elements with float: right property, so when they were rendered the first element were pushed back after the second element, therefore it looked like it wasn't working properly.

So technically, both answers I received from @SenhaPanchal and @Divya are correct.

Adding the after="fw.account is the correct answer to how to place the element.

However, with the float: right CSS property on both elements, this had to be switched around so before="fw.account" in conjunction with float: right actully resulted in the minicart rendering after the fw.account element.