How to add a Sign-in link next to the account login icon

Result:

Modify this file:

myshopify.com/admin/themes/current?key=sections/header.liquid&line=9

Modify this line from:

<a href="/account"><img src="{{ 'account.svg' | asset_url }}"></a>

to:

<a href="/account"><img src="{{ 'account.svg' | asset_url }}"> Sign-in</a>

Example:

Save the file.


Option: Remove icon and only use text

To remove the icon completely and only have the Sign-in text:

<a href="/account">Sign-in</a>

If you'd like to customize the font used for the Sign-in text:

Add the following code to the very bottom of this file on a new line:
assets/style.scss.liquid

Option 1: Title Font

/* -- code to change font for header account area -- */
.header-account-link {
  font-family: $titleFontStack; 
}
/* -- end -- */

Option 2: Subheading Font

/* -- code to change font for header account area -- */
.header-account-link {
  font-family: $accentFontStack; 
}
/* -- end -- */

Option 3: Body Font

/* -- code to change font for header account area -- */
.header-account-link {
  font-family: $bodyFontStack; 
}
/* -- end -- */

Save the file.

Still need help? Contact Us Contact Us