Question

I've added <referenceBlock name="header.container" remove="true" /> to my themes default.xml and instead has been replaced with:

<referenceContainer name="page.wrapper">
    <block  class="Magento\Framework\View\Element\Template" 
            name="top.header" 
            template="Magento_Theme::html/custom_header.phtml" 
            before="header.container"
    />
</referenceContainer>

But, by doing this I lose all of the minicart functionality. The JS is not added. This is a problem for me because when I attempt to get the cart total like so:

<div data-bind="scope: 'minicart_counter'">
    <span data-bind="html: getCartParamUnsanitizedHtml('summary_count')"></span>
</div>

<script type="text/x-magento-init">
    {
        "*": {
            "Magento_Ui/js/core/app": {
                "components": {
                    "minicart_counter": {
                        "component": "Magento_Checkout/js/view/minicart"
                    }
                }
            }
        }
    }
</script>

I get an error:

console-output-handler.js:34 [2020-11-12 10:34:54] [ERROR] Failed to load the 
"Magento_Checkout/js/view/minicart" component.

But if I make the header.container visible with <referenceBlock name="header.container" remove="false" /> my custom header shows the cart quantity total ... except I now have two headers showing (the default one and my custom).

I've battled with this for hours to no avail. What am I missing?

Was it helpful?

Solution

I'm fairly certain the minicart is nested within the header.container block. So you'll want to find the exact block or container within header.container and perform your customization on that.

Screenshot of the layout tree of the default magento store with Luma theme

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top