Magento 2 - Home Page Content Reorder using Set Position
-
21-12-2020 - |
Question
I am using banner extension and the position to display banner on home page is set to Content-Top. The banner appears below category navigation on home page
default.xml for third party banner module
<referenceContainer name="content">
<block class="Vendor\Module\Block\Bannerslider" name="bannerslider.content.top" before="-">
<action method="setPosition">
<argument name="position" xsi:type="string">content-top</argument>
</action>
</block>
</referenceContainer>
Now I addded below content in Home Page Content block which will display free shipping image
<p><img src="{{media url="wysiwyg/free-shipping.png"}}" /></p>
On the frontend, home page displays Banner first and then free shipping image. I tried with below code in my custom theme's default.xml
<referenceContainer name="content">
<block class="Magento\Cms\Block\Block" name="my-free-shipping-block" before="-">
<arguments>
<argument name="block_id" xsi:type="string">my-free-shipping-block</argument>
</arguments>
</block>
</referenceContainer>
where my-free-shipping-block
is my block identifier.
- How do I show free shipping image first on home page followed by banner ?
- Can we use
<action method="setPosition">
in our custom theme's default.xml to reorder home page content ?
Solution
I think you should try creating static block for your placing shipping image before your slider.
You may try following layout in your theme:
<referenceContainer name="content">
<block class="Magento\Cms\Block\Block" name="my-free-shipping-block-identifer" before="-">
<arguments>
<argument name="block_id" xsi:type="string">quikrete-free-shipping-block-identifer</argument>
</arguments>
</block>
</referenceContainer>
In above code you must use name="block_id"
and use the id of the static block which you will get from backend in place of quikrete-free-shipping-block-identifer
.
And edit the default.xml
layout of your third party as:
<referenceContainer name="content">
<block class="Vendor\Module\Block\Bannerslider" name="bannerslider.content.top" after=''>
</block>
</referenceContainer>