Magento 2.2 how to change header link create an account text to icon

Question

enter image description here

I want to change create an account text to icon.

I can find the layout file under

var\www\html\vendor\magento\module-customer\view\frontend\layout\default.xml

 <block class="Magento\Customer\Block\Account\RegisterLink" name="register-link">
 <arguments>
 <argument name="label" xsi:type="string" translate="true">Create an Account</argument>
 </arguments>
</block>

How to change create an account text to icon

• Rathna: Its working. Thx Patel
• Prince Patel: Yr Welcome.. :)

Answer 1

The HTML of register link is generated from block RegisterLink.php so you need to override block and add new css class in function _toHtml()

vendor/magento/module-customer/Block/Account/RegisterLink.php

protected function _toHtml()
{
 if (!$this->_registration->isAllowed()
 || $this->httpContext->getValue(Context::CONTEXT_AUTH)
 ) {
 return '';
 }
 return '<li class="register-link"><a ' . $this->getLinkAttributes() . ' ></a></li>';
}

Now add new class in css file

li.register-link:before {
 font-size: 22px;
 content: '\e611';
 font-family: 'luma-icons';
}

Answer 2

You can use in this way, define template to your block template="your/template/pathhere.html" and replace your/template/pathhere.html with template file path:

<block class="Magento\Customer\Block\Account\RegisterLink" template="your/template/pathhere.html" name="register-link" >
 <arguments>
 <argument name="label" xsi:type="string" translate="true">Create an Account</argument>
 </arguments>
</block>

And inside your template you can use icon/image to display icon/image and can call getHref to get link url that you can use to link that icon. Also you can call $block->escapeHtml($block->getLabel()) to get label in your template.