4

I am new to Magento2 and I am confused how to proceed when I want to rewrite default part of the Luma theme page completely. For example the header - I want to rebuild it from scratch, adding whatever I want in it. Can someone share a brief list of what is the best way to approach this. I already did all of this -

http://magento.stackexchange.com/a/102359/36102

After that I created a new module in

app/code/MyVendor/MyTheme

registered it and everything. I put the dependency that MyTheme depends on Magento_Theme. After that I am a bit lost as how should I proceed re-writing the

vendor/magento/magento-theme/Block/Html/Header.php

What is the best approach for that. Can someone give detailed list of steps like:

1)Create Custom module MyVendor_MyTheme
2)extend or re-declare Magento_Theme.. 
3)Create app/code/MyVendor/MyTheme/Block/Html/Header.php

And so on and so on, so I can re-write

vendor/magento/magento-theme/Block/Html/Header->getWelcome();

functionality and link it to

app/design/frontend/{Vendor}/{theme}/MyVendor_MyTheme/templates/html

so it can use the functionality from MyTheme module block and the template for the header.phtml file I've set in

app/design/frontend/{Vendor}/{theme}/MyVendor_MyTheme/templates/html/header.phtml.

Thank you.

2 Answers 2

7

I had similar frustrations when trying to customise my theme which was extending the blank theme. I've now opted to create a fresh theme that does not inherit from a parent theme and I've found it far easier to manipulate. The difficulty is no doubt due to the fact I don't yet fully understand the underlying architecture and how it works. However, this is what I have done using the '//Magento_Theme/layout/default.xml':

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <!-- Remove Blocks -->
        <referenceBlock name="report.bugs" remove="true"/>
        <referenceBlock name="header.container" remove="true"/>
        <referenceBlock name="catalog.topnav" remove="true"/>
        <referenceBlock name="footer" remove="true"/>

        <referenceContainer name="page.wrapper">
            <container name="custom.header" htmlTag="header" htmlClass="header">
                <block class="Magento\Framework\View\Element\Template" name="row" template="Magento_Theme::html/row.phtml">
                    <block class="Magento\Framework\View\Element\Template" name="header.column1" template="Magento_Theme::html/header/column1.phtml" before="header.column2"/>
                    <block class="Magento\Framework\View\Element\Template" name="header.column2" template="Magento_Theme::html/header/column2.phtml" after="header.column1">
                        <block class="Magento\Theme\Block\Html\Header\Logo" name="logo" after="header.column1" />
                    </block>
                    <block class="Magento\Framework\View\Element\Template" name="header.column3" template="Magento_Theme::html/header/column3.phtml" after="header.column2"/>
                </block>
            </container>
        </referenceContainer>
    </body>
</page>

Now, whether this is considered bad practice or not, I'm not entirely sure.

1

You have to start following tutorial based on magento devdocs, http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/themes/theme-create.html

After setup custom theme, You have to set your theme from adminpanel,

Stores -> Configuration -> General Tab -> Design

Set Your custom Design Theme.

Now remove var folder from root.

You can append files from vendor/magento/theme-frontend-luma to your custom theme.

Header related files coming from module-theme folder

Get files from magento2/vendor/magento/module-theme/view/frontend/templates/html to app/design/frontend/{Vendor}/{theme}/Magento_Theme/templates/html folder

Thanks.

1
  • yeah, I already did all of that, i will restructure the question, because I can't get it working Feb 18, 2016 at 13:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.