Customer Account Login Account Icon

Solved
Highlighted
New Member
8 0 0

Hi Jasoliya, thank for your answer.

 

I find the header.liquid and place the code there. The account icon appears, that's great. And now, I would like to change this account icon to one that I will upload to Files. So, where do I have to place the link to the file?

 

Thank you for your time.

Martin

0 Likes
Highlighted
Shopify Expert
3298 526 775

If you found place and uploaded svg in file then use code like that:

<img scr="svg_url_from_file" width="30">

Note: chaneg src to svg link.

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
2 0 0

I'm not sure what css is but I did email you for further help.

0 Likes
Highlighted
Shopify Expert
3298 526 775

ok mail me or PM

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
5 0 1

I cant find it. i go to header.liquid, but it is not there. 

 

I am looking in this area here:

<div class="header-bar__right post-large--display-table-cell">

{% if shop.customer_accounts_enabled %}
<ul class="header-bar__module header-bar__module--list">
{% if customer %}
<li>
<a href="{{ routes.account_url }}">{{ 'layout.customer.account' | t }}</a>
</li>
<li>
{{ 'layout.customer.log_out' | t | customer_logout_link }}
</li>
{% else %}
<li>
{{ 'layout.customer.log_in' | t | customer_login_link }}
</li>
<li>{{ 'layout.customer.or' | t }}</li>
<li>
{{ 'layout.customer.create_account' | t | customer_register_link }}
</li>
{% endif %}
</ul>
{% endif %}



<div class="header-bar__module">
<span class="header-bar__sep" aria-hidden="true"></span>
<a href="{{ routes.cart_url }}" class="cart-page-link">
<span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
</a>

</div>



<div class="header-bar__module">
<a href="{{ routes.cart_url }}" class="cart-page-link">
{% unless cart.item_count == 0 %}:{% endunless %}
<span class="cart-count header-bar__cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
</a>

</div>


{% if section.settings.header_search_enable %}
{% if section.settings.show_announcement %}
<div class="header-bar__module header-bar__search">
{% include 'search-bar' with 'header' %}
</div>
{% endif %}
{% endif %}

</div>
</div>
</div>

 

0 Likes
Highlighted
Shopify Expert
3298 526 775

You can see this code is for login link:

 

{{ 'layout.customer.log_in' | t | customer_login_link }}

 

Register link:

{ 'layout.customer.create_account' | t | customer_register_link }}

You can replace both with account icon.

 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
2 0 0

I did it, and it worked, it added an Icon, and removed the "account" buttom but the "Account" word still appears on mobile device in menu.

0 Likes
Highlighted
New Member
5 0 1
yes, i see. from where can i get the code for the icon?

0 Likes
Highlighted
New Member
1 0 0

Hi 

 

0 Likes
Highlighted
New Member
5 0 1

I have minimal theme and does not look like the picture above. 

 

look like this:

 

<div class="header-bar__module">
<span class="header-bar__sep" aria-hidden="true"></span>
<a href="#swym-wishlist" class="swym-wishlist">
<i aria-hidden="true" focusable="false" role="presentation" class="icon icon-swym-wishlist"></i>
</a>
</div>

<div class="header-bar__module">
<span class="header-bar__sep" aria-hidden="true"></span>
<a href="{{ routes.cart_url }}" class="cart-page-link">
<span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
</a>
</div>



<div class="header-bar__module">
<a href="{{ routes.cart_url }}" class="cart-page-link">
{% unless cart.item_count == 0 %}:{% endunless %}
<span class="cart-count header-bar__cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
</a>
</div>



{% if section.settings.header_search_enable %}
{% if section.settings.show_announcement %}
<div class="header-bar__module header-bar__search">
{% include 'search-bar' with 'header' %}
</div>
{% endif %}
{% endif %}

 

Where exactly place the follow:

<a href="/account/login" id="customer_login_link" class="site-header__link site-header__cart">
    <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-login" viewBox="0 0 28.33 37.68"><path d="M14.17 14.9a7.45 7.45 0 1 0-7.5-7.45 7.46 7.46 0 0 0 7.5 7.45zm0-10.91a3.45 3.45 0 1 1-3.5 3.46A3.46 3.46 0 0 1 14.17 4zM14.17 16.47A14.18 14.18 0 0 0 0 30.68c0 1.41.66 4 5.11 5.66a27.17 27.17 0 0 0 9.06 1.34c6.54 0 14.17-1.84 14.17-7a14.18 14.18 0 0 0-14.17-14.21zm0 17.21c-6.3 0-10.17-1.77-10.17-3a10.17 10.17 0 1 1 20.33 0c.01 1.23-3.86 3-10.16 3z"></path></svg>
</a>

 

0 Likes