Magento 2: How to check that customer is logged in on frontend?
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 -->
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
JSfile 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!