cancel
Showing results for 
Search instead for 
Did you mean: 

Magento2.3: add custom login and logout button

SOLVED
   Did you know you can see the translated content as per your choice?

Translation is in progress. Please check again after few minutes.

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.