2

How to modify minicart in magento 2. Minicart content display like:

Item list
subtotal
shopping-cart link
go to checkout button
3

First copy content.html file inside

app/design/frontend/{{PackageName}}/{{themename}}/Magento_Checkout/web/template/minicart/content.html

<!--
/**
 * Copyright © 2015 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<div class="block-title">
    <strong>
        <span class="text"><!-- ko i18n: 'My Cart' --><!-- /ko --></span>
        <span
            class="qty empty"
            data-bind="css: { empty: cart().summary_count == 0 },
                       attr: { title: $t('Items in Cart') }">
            <!-- ko text: cart().summary_count --><!-- /ko -->
        </span>
    </strong>
</div>

<div class="block-content">
    <p class="block-subtitle"><!-- ko i18n: 'Recently added item(s) ' --><!-- /ko --></p>
    <button type="button"
            id="btn-minicart-close"
            class="action close"
            data-action="close"
            data-bind="attr: { title: $t('Close') }">
        <span><!-- ko i18n: 'Close' --><!-- /ko --></span>
    </button>    

    <!-- ko if: cart().summary_count -->
    <strong class="subtitle"><!-- ko i18n: 'Recently added item(s)' --><!-- /ko --></strong>
    <div data-action="scroll" class="minicart-items-wrapper">
        <ol id="mini-cart" class="minicart-items" data-bind="foreach: { data: cart().items, as: 'item' }">
            <!-- ko foreach: $parent.getRegion($parent.getItemRenderer(item.product_type)) -->
                <!-- ko template: {name: getTemplate(), data: item, afterRender: function() {$parents[1].initSidebar()}} --><!-- /ko -->
            <!-- /ko -->
        </ol>
    </div>
    <!-- /ko -->

    <!-- ko ifnot: cart().summary_count -->
        <strong class="subtitle empty" data-bind="visible: closeSidebar()">
            <!-- ko i18n: 'You have no items in your shopping cart.' --><!-- /ko -->
        </strong>
        <!-- ko if: cart().cart_empty_message -->
            <p class="minicart empty text"><!-- ko text: cart().cart_empty_message --><!-- /ko --></p>

            <div class="actions">
                <div class="secondary">
                    <a class="action viewcart" data-bind="attr: {href: shoppingCartUrl}">
                        <span><!-- ko text: $t('View and edit cart') --><!-- /ko --></span>
                    </a>
                </div>
            </div>
        <!-- /ko -->
    <!-- /ko -->    

    <!-- ko if: cart().summary_count -->
        <div class="items-total">
            <span class="count"><!-- ko text: cart().summary_count --><!-- /ko --></span>
            <!-- ko if: cart().summary_count == 1 -->
                <!-- ko i18n: 'item' --><!-- /ko -->
            <!-- /ko -->
            <!-- ko if: cart().summary_count > 1 -->
                <!-- ko i18n: 'items' --><!-- /ko -->
            <!-- /ko -->
        </div>

        <!-- ko if: cart().possible_onepage_checkout -->
            <!-- ko foreach: getRegion('subtotalContainer') -->
                <!-- ko template: getTemplate() --><!-- /ko -->
            <!-- /ko -->
        <!-- /ko -->

        <div class="actions">
            <div class="secondary">
                <a class="action viewcart" data-bind="attr: {href: shoppingCartUrl}">
                    <span><!-- ko i18n: 'View Shopping Cart' --><!-- /ko --></span>
                </a>
            </div>
        </div>

        <!-- ko foreach: getRegion('extraInfo') -->
            <!-- ko template: getTemplate() --><!-- /ko -->
        <!-- /ko -->

        <!-- ko if: cart().possible_onepage_checkout -->
        <div class="actions">
            <div class="primary">
                <button
                        id="top-cart-btn-checkout"
                        type="button"
                        class="action primary checkout"
                        data-bind="attr: {title: $t('Checkout')}">
                    <!-- ko i18n: 'Checkout' --><!-- /ko -->
                </button>
                <div data-bind="html: cart().extra_actions"></div>
            </div>
        </div>
        <!-- /ko -->
    <!-- /ko -->

    <div id="minicart-widgets" class="minicart-widgets">
        <!-- ko foreach: getRegion('promotion') -->
            <!-- ko template: getTemplate() --><!-- /ko -->
        <!-- /ko -->
    </div>
</div>
<!-- ko foreach: getRegion('sign-in-popup') -->
<!-- ko template: getTemplate() --><!-- /ko -->
<!-- /ko -->

Add above code inside content.html file. Clear cache of magento and clear cache of browser. After clearing cache, Your minicart updated.

  • Do you know how I can display subtotal in minicart.phtml template (parent of content.html). I guess that I need to do some layout updates in <block class="Magento\Checkout\Block\Cart\Sidebar" name="minicart" as="minicart" after="logo" template="cart/minicart.phtml"> block? – Miroslav Petroff Apr 27 '16 at 6:56

Your Answer

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