5

Checkout Minicart content.html

<div class="block-content">
    <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: getCartParam('summary_count') -->
    <div class="items-total">
        <span class="count"><!-- ko text: getCartParam('summary_count') --><!-- /ko --></span>
        <!-- ko if: getCartParam('summary_count') == 1 -->
        <!-- ko i18n: 'item' --><!-- /ko -->
        <!-- /ko -->
        <!-- ko if: getCartParam('summary_count') > 1 -->
        <!-- ko i18n: 'items' --><!-- /ko -->
        <!-- /ko -->
    </div>

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

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

    <!-- ko if: getCartParam('possible_onepage_checkout') -->
    <div class="actions">
        <div class="primary">
            <!-- ko if: customer().firstname -->
                <a id="top-cart-btn-checkout"
                   class="action primary checkout"
                   href="#">
                    <!-- ko i18n: 'Go to Checkout' --><!-- /ko -->
                </a>
            <!-- /ko -->
            <div data-bind="html: getCartParam('extra_actions')"></div>
        </div>
    </div>
    <!-- /ko -->
    <!-- /ko -->

    <!-- ko if: getCartParam('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: getCartParam('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: getCartParam('summary_count') -->
    <strong class="subtitle empty" data-bind="visible: closeSidebar()">
        <!-- ko i18n: 'You have no items in your shopping cart.' --><!-- /ko -->
    </strong>
    <!-- ko if: getCartParam('cart_empty_message') -->
    <p class="minicart empty text"><!-- ko text: getCartParam('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: getCartParam('summary_count') -->
    <div class="actions">
        <div class="secondary">
            <a class="action viewcart cartAction" data-bind="attr: {href: shoppingCartUrl}">
                <span class="viewcartBtnWrapper"><!-- ko i18n: 'View and edit cart' --><!-- /ko --></span>
            </a>
        </div>
    </div>
    <!-- /ko -->

    <div id="minicart-widgets" class="minicart-widgets">
        <!-- ko foreach: getRegion('promotion') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!-- /ko -->
    </div>
</div>
<script type="text/x-magento-init">
{
    "*": {
        "Magento_Ui/js/core/app": {
            "components": {
                "customer": {
                    "component": "Magento_Customer/js/model/customer"
                }
            }
        }
    }
}
</script>

Error

Uncaught ReferenceError: Unable to process binding "if: function(){return getCartParam('summary_count') }"
Message: Unable to process binding "if: function(){return getCartParam('possible_onepage_checkout') }"
Message: Unable to process binding "if: function(){return customer().firstname }"
Message: customer is not defined
    at if (eval at createBindingsStringEvaluator (knockout.min.js:268), <anonymous>:3:55)
    at ko.computed.disposeWhenNodeIsRemoved (knockout.min.js:365)
    at evaluateImmediate (knockout.min.js:183)
    at Object.ko.computed.ko.dependentObservable (knockout.min.js:204)
    at init (knockout.min.js:365)
    at knockout.min.js:300
    at Object.ignore (knockout.min.js:129)
    at knockout.min.js:300
    at Object.arrayForEach (knockout.min.js:17)
    at applyBindingsToNodeInternal (knockout.min.js:299)

Please let me know how can I check the customer is login or not by knockout js HTML page?

9
  • 2
    if you get <!-- ko if: customer().firstname --> firstname it means you are logged in. Commented Nov 15, 2019 at 11:32
  • Not getting <!-- ko if: customer().firstname --> got the error in console @RakeshVarma Commented Nov 15, 2019 at 12:17
  • Please let me know what the issue in above code? @RakeshVarma Commented Nov 15, 2019 at 12:19
  • can you please post the error Commented Nov 15, 2019 at 12:24
  • Please check the error in post @RakeshVarma Commented Nov 15, 2019 at 12:39

4 Answers 4

4

You can create default.xml file here in your module

app/code/Vendor/Module/view/frontend/layout/default.xml

Content for this file is..

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="header-wrapper">
            <referenceBlock name="minicart">
                <arguments>
                    <argument name="jsLayout" xsi:type="array">
                        <item name="components" xsi:type="array">
                            <item name="minicart_content" xsi:type="array">
                                <item name="config" xsi:type="array">
                                    <item name="template" xsi:type="string">Vendor_Module/minicart/content</item>
                                </item>
                            </item>
                        </item>
                    </argument>
                </arguments>
            </referenceBlock>
        </referenceContainer>
    </body>
</page>

Now you need to create content.html file here on this path

app/code/Vendor/Module/view/frontend/web/template/minicart/content.html

You can copy content of this default Vendor file there and comment button code

vendor/magento/module-checkout/view/frontend/web/template/minicart/content.html

If you want to add condition in that button then you need to create one requirejs-config.js file here on this location in your custom module..

app/code/Vendor/Module/view/frontend/requirejs-config.js

Content for this file is..

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/view/minicart': {
                'Vendor_Module/js/view/minicart-mixin': true
            }
        }
    }
};

Now create one minicart-mixin.js file here on this location

app/code/Vendor/Module/view/frontend/web/js/view/minicart-mixin.js

Content for this file is..

define([
    'uiComponent',
    'Magento_Customer/js/customer-data',
    'jquery',
    'ko',
    'sidebar',
    'mage/translate'
], function (Component, customerData, $, ko) {
    'use strict';

    var mixin = {
        isCustomerLoggedIn: function () {
            var customer = customerData.get('customer');
            if(customer().firstname){
                return true;
            }else{
                return false;
            }
        }
    };

    return function (target) {
        return target.extend(mixin);
    };
});
  • Here in this JS file I've added isCustomerLoggedIn() function there you can add your condition here based on your requirement to show hide your button.

And you can add condition in your content.html file like this

app/code/Vendor/Module/view/frontend/web/template/minicart/content.html

Content for this file is..

<!--
/**
 * Copyright © 2013-2017 Magento, Inc. 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: !!getCartParam('summary_count') == false },
                       attr: { title: $t('Items in Cart') }">
            <!-- ko text: getCartParam('summary_count') --><!-- /ko -->
        </span>
    </strong>
</div>

<div class="block-content">
    <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: getCartParam('summary_count') -->
        <div class="items-total">
            <span class="count"><!-- ko text: getCartParam('summary_count') --><!-- /ko --></span>
            <!-- ko if: getCartParam('summary_count') == 1 -->
                <!-- ko i18n: 'item' --><!-- /ko -->
            <!-- /ko -->
            <!-- ko if: getCartParam('summary_count') > 1 -->
                <!-- ko i18n: 'items' --><!-- /ko -->
            <!-- /ko -->
        </div>

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

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

        <!-- ko if: getCartParam('possible_onepage_checkout') -->
        <div class="actions">
            <div class="primary">
                <!-- ko if: (isCustomerLoggedIn()) -->
                    <button
                            id="top-cart-btn-checkout"
                            type="button"
                            class="action primary checkout"
                            data-action="close"
                            data-bind="
                                attr: {
                                    title: $t('Proceed to Checkout (Logged In)')
                                },
                                click: closeMinicart()
                            "
                            translate="'Proceed to Checkout (Logged In)'"
                    />
                <!--/ko-->

                <!-- ko ifnot: (isCustomerLoggedIn()) -->
                    <button
                            id="top-cart-btn-checkout"
                            type="button"
                            class="action primary checkout"
                            data-action="close"
                            data-bind="
                                attr: {
                                    title: $t('Proceed to Checkout (Not Logged In)')
                                },
                                click: closeMinicart()
                            "
                            translate="'Proceed to Checkout (Not Logged In)'"
                    />
                <!--/ko-->
                <div data-bind="html: getCartParam('extra_actions')"></div>
            </div>
        </div>
        <!-- /ko -->
    <!-- /ko -->

    <!-- ko if: getCartParam('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: getCartParam('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: getCartParam('summary_count') -->
        <strong class="subtitle empty" data-bind="visible: closeSidebar()">
            <!-- ko i18n: 'You have no items in your shopping cart.' --><!-- /ko -->
        </strong>
        <!-- ko if: getCartParam('cart_empty_message') -->
            <p class="minicart empty text"><!-- ko text: getCartParam('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: getCartParam('summary_count') -->
    <div class="actions">
        <div class="secondary">
            <a class="action viewcart" data-bind="attr: {href: shoppingCartUrl}">
                <span><!-- ko i18n: 'View and edit cart' --><!-- /ko --></span>
            </a>
        </div>
    </div>
    <!-- /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 -->

Hope this will help you!

3
  • Let me know if it helps. Commented Nov 16, 2019 at 17:05
  • 2
    It is worked. Thanks Commented Nov 18, 2019 at 9:44
  • You're welcome buddy. :) Commented Nov 18, 2019 at 9:45
5

create js file and check using below code

define([
    'uiComponent',
    'Magento_Customer/js/model/customer'
], function (
    Component,
    customer
) {
    'use strict';

    return Component.extend({
        defaults: {
            template: 'CustomModule/custom-file'
        },

        /**
         * Customer is logged in
         *
         * @return {boolean}
         */
        isLoggedIn: function () {
            return customer.isLoggedIn();
        }
    });
});

check this in custom-file.html

<!-- ko if: isLoggedIn() -->
    <div>Customer is logged in</div>
<!-- /ko -->
3
  • I will check and update you. Thanks! Commented Nov 15, 2019 at 12:34
  • yes please, thanks Commented Nov 15, 2019 at 12:34
  • Got the console error: Message: isLoggedIn is not defined Commented Nov 15, 2019 at 13:01
1
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$customerSession = $objectManager->get('Magento\Customer\Model\Session');
if($customerSession->isLoggedIn()) {
  //your code
}

we can easily use it in phtml file

7
  • I want to check in content.html checkout page Commented Nov 15, 2019 at 11:42
  • you can use this code and use it in any phtml Commented Nov 16, 2019 at 6:35
  • It is not usable for me. Commented Nov 18, 2019 at 7:05
  • can you show me the part of your code Commented Nov 20, 2019 at 4:10
  • I have posted my code above and my issue is resolved. Thanks for your help Commented Nov 20, 2019 at 6:10
-1

try this. I have added new <div data-bind="scope:'customer'"> to define scope of your js component.

<div data-bind="scope:'customer'">
<div class="block-content">
   <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: getCartParam('summary_count') -->
   <div class="items-total">
      <span class="count">
         <!-- ko text: getCartParam('summary_count') --><!-- /ko -->
      </span>
      <!-- ko if: getCartParam('summary_count') == 1 -->
      <!-- ko i18n: 'item' --><!-- /ko -->
      <!-- /ko -->
      <!-- ko if: getCartParam('summary_count') > 1 -->
      <!-- ko i18n: 'items' --><!-- /ko -->
      <!-- /ko -->
   </div>
   <!-- ko if: getCartParam('possible_onepage_checkout') -->
   <!-- ko foreach: getRegion('subtotalContainer') -->
   <!-- ko template: getTemplate() --><!-- /ko -->
   <!-- /ko -->
   <!-- /ko -->
   <!-- ko foreach: getRegion('extraInfo') -->
   <!-- ko template: getTemplate() --><!-- /ko -->
   <!-- /ko -->
   <!-- ko if: getCartParam('possible_onepage_checkout') -->
   <div class="actions">
      <div class="primary">
         <!-- ko if: customer().firstname -->
         <a id="top-cart-btn-checkout"
            class="action primary checkout"
            href="#">
            <!-- ko i18n: 'Go to Checkout' --><!-- /ko -->
         </a>
         <!-- /ko -->
         <div data-bind="html: getCartParam('extra_actions')"></div>
      </div>
   </div>
   <!-- /ko -->
   <!-- /ko -->
   <!-- ko if: getCartParam('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: getCartParam('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: getCartParam('summary_count') -->
   <strong class="subtitle empty" data-bind="visible: closeSidebar()">
      <!-- ko i18n: 'You have no items in your shopping cart.' --><!-- /ko -->
   </strong>
   <!-- ko if: getCartParam('cart_empty_message') -->
   <p class="minicart empty text">
      <!-- ko text: getCartParam('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: getCartParam('summary_count') -->
   <div class="actions">
      <div class="secondary">
         <a class="action viewcart cartAction" data-bind="attr: {href: shoppingCartUrl}">
            <span class="viewcartBtnWrapper">
               <!-- ko i18n: 'View and edit cart' --><!-- /ko -->
            </span>
         </a>
      </div>
   </div>
   <!-- /ko -->
   <div id="minicart-widgets" class="minicart-widgets">
      <!-- ko foreach: getRegion('promotion') -->
      <!-- ko template: getTemplate() --><!-- /ko -->
      <!-- /ko -->
   </div>
</div>

9
  • Div is not closed. Commented Nov 15, 2019 at 13:04
  • updated answer with closing div. Is it working? Commented Nov 15, 2019 at 13:07
  • I have got the error. Please check the message in chatroom. Commented Nov 15, 2019 at 13:15
  • why down vote?? Commented Nov 16, 2019 at 5:30
  • I have not downed vote. Commented Nov 18, 2019 at 5:38

Your Answer

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

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