0

we are using Magento 2.2.6 an rebuilding the desing. We plan to move the minicart when the width is small (on smartphones). But we cant do this with css. When we initialize the minicart twice in phtml and working with css

($this->getChildHtml("minicart"); in phtml with visible-xs div around

...

($this->getChildHtml("minicart"); in phtml with hidden-xs div around

the minicart is not functional (while no errors in console).

Can we "copy" the minicart in the xml (default.xml) and work with minicart and minicart2 in the phtml?

$this->getChildHtml("minicart");
$this->getChildHtml("minicart2");

1

You can use jQuery to move minicart for small device (window width less than 768px ).

<script type="text/javascript">
    require(['jquery'], function($) {
        $(document).ready(function(){
            if ($(window).width() < 768) {
                $($('div[data-block="minicart"]').detach()).appendTo('.header.content');
            }
        });
    });
</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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