I try to get a hang of how to design a custom homepage design. I tried the samples I found here Creating a custom homepage template in Magento2 and have build a basic custom layout as pointed out. Resulting in a white home-page?
Now what I would like to achieve is a layout which looks like this:
The header can stay as it is on the Luma page.
Than I want two equal columns. In which per example can be (in the left one) text from the cms editor and in the left one a block or widget or also text from the cms editor.
Than a block showing 4 or 5 latest products
And the footer as on the luma page.
Now I have:
app/design/frontend//mytheme/Magento_Theme/Page_layout/custom_home.xml
app/design/frontend//mytheme/Magento_Theme
app/design/frontend//mytheme/Magento_Theme/layouts.xml
So how to achieve this? 🙂
Best Answer
You can achieve all of above without creating a new page layout which is preferable in my opinion. I will only create a custom layout if a very complex layout structure is required which is not achievable through already available layout pages. Magento's layout instructions let you re-use, modify and change layout by using layout instructions.
In your case you can use 1 column page layout and add layout instructions in
app/design/frontend/<Vendor>/<theme>/Magento_Cms/layout/cms_index_index.xml
file to achieve what you require. Let's say you have two cms static blocks with id "cms_block_1" and "cms_block_2", you can use below code:Similarly you can create another CMS static block and show it after
cms.block2
which will position it at the bottom. You can use css to position block one and block 2 parallel to each other.