cancel
Showing results for 
Search instead for 
Did you mean: 

Magento2.3: add custom login and logout button

SOLVED

Magento2.3: add custom login and logout button

My actual requirement is to add login and logout button in my custom header.phtml. I am using a custom theme package. This is the header.phtml file path where I want to button:

 

app/design/frontend/packageName/themeName/Magento_Theme/templates/html/header.phtml

any help?

 

1 ACCEPTED SOLUTION

Accepted Solutions

Re: Magento2.3: add custom login and logout button

I was looking for the complete custom solution for my fully customized `header.phtml` file. I got solution for that.

 

Here is the code working for me:

 

 

<?php 
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$customerSession = $objectManager->create('Magento\Customer\Model\Session');
if($customerSession->isLoggedIn()) : ?>
	<span class="header_account_link_list logout">
		<a class= "header_account_link" href="<?php echo $this->getUrl("customer/account/logout");?>"><?php echo __('Logout')?></a>
	</span>
<?php else: ?>
	<span class="header_account_link_list login">
		<a class= "header_account_link" href="<?php echo $this->getUrl("customer/account/login");?>"><?php echo __('Sign in')?></a>
	</span>
<?php endif;?>

 

 

View solution in original post

5 REPLIES 5

Re: Magento2.3: add custom login and logout button

Hi @PankajS_Magento ,

It won't be appropriate if you customise the header.phtml direct. In header there are several block and containers. I think you want to customise the header for login and logout link.

 

Magento provide several referenceBlock and referenceContainer such as header-wrapper, header.container to customize the design and layout of header. 

 

In another question you asked to add link before minicart.

https://community.magento.com/t5/Magento-2-x-Programming/Magento-2-3-add-login-link-before-minicart/....

 

If you are asking for this requirement, I have provided the solution in the answer.

 

If you find this helpful, please Accept as solution and provide Kudos.

 

Thanks. 

 

 

Re: Magento2.3: add custom login and logout button

Hi @PankajS_Magento 

 

It is better to add custom links via JavaScript component and HTML file. Please let me know if you are looking for guidance.

Re: Magento2.3: add custom login and logout button

I was looking for the complete custom solution for my fully customized `header.phtml` file. I got solution for that.

 

Here is the code working for me:

 

 

<?php 
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$customerSession = $objectManager->create('Magento\Customer\Model\Session');
if($customerSession->isLoggedIn()) : ?>
	<span class="header_account_link_list logout">
		<a class= "header_account_link" href="<?php echo $this->getUrl("customer/account/logout");?>"><?php echo __('Logout')?></a>
	</span>
<?php else: ?>
	<span class="header_account_link_list login">
		<a class= "header_account_link" href="<?php echo $this->getUrl("customer/account/login");?>"><?php echo __('Sign in')?></a>
	</span>
<?php endif;?>

 

 

Re: Magento2.3: add custom login and logout button

Hi @PankajS_Magento 

 

Thank you for the response.

My recommendation is to avoid using an object manager and session objects directly in a phtml template. It is better to define JS Component and HTML template and render it in your fully customized header and theme.

Thanks.

Re: Magento2.3: add custom login and logout button

Editing core files is not a right approach so you have to create a custom module for it. Once the module created and these are the steps which you have to follow:

Create default.xml (Layout File) in app/code/Magenticians/Mymodule/view/frontend/layout and add this code under it:

<?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>
     <referenceBlock name="header.links">
         <block class="Magenticians\Mymodule\Block\Link" name="custom-header-link">
             <arguments>
     <argument name="label" xsi:type="string" translate="true">Login</argument>
     <argument name="path" xsi:type="string" translate="true">customer/account/login</argument>
     </arguments>
         </block>
     </referenceBlock>
</body>
</page>

You can see that I have set the label as Login and Path to the store's login page.

Create Link.php (Block File) in app/code/Magenticians/Mymodule/Block and add this code under it:

<?php
namespace Magenticians\Mymodule\Block;

class Link extends \Magento\Framework\View\Element\Html\Link
{
/**
* Render block HTML.
*
* @return string
*/
protected function _toHtml()
    {
     if (false != $this->getTemplate()) 
     {
     return parent::_toHtml();
     }
     return '<li><a ' . $this->getLinkAttributes() . ' >' . $this->escapeHtml($this->getLabel()) . '</a></li>';
    }
}

At last, just run the following CLI commands in the root directory of your store:

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento cache:clean
php bin/magento cache:flush


To know more, you can also check this guide: Add Custom Header Link in Magento 2

 

Sharing here so that it will help others also.