Move Elements In Magento2

Here, we’ll discuss about moving elements in Magento 2 through layout instructions so you can rearrange blocks and containers easily.

Magento 2 uses many new features and new approaches. We will see here new feature of templating.

In Magento 2, within the page we can move containers and blocks to different places. We can move blocks and containers with the help of layout file.

Move Elements in Magento2

Use following code snippet in layout file to move blocks and containers.

<move element="name of conatiner or block" destination="destination block or container name" />

Here is an example. We will move price block to media block on product page.

Now we will move the price block.

<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
	<move element="product.info.price" destination="product.info.media" />
</page>

That’s all for moving elements in magento 2 via layout file. If you have any query or issue, comment below.