How To Put Customer Name On Header When Logged In on dawn theme ?

Solved

How To Put Customer Name On Header When Logged In on dawn theme ?

itshimanshu97
Tourist
6 0 1

Hi guys! Is there an option or maybe some code you could help me with that could help me display customer name as "hi, customer name" when logged in rather than displaying "account" 

Accepted Solutions (2)

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

This is an accepted solution.

Go to your online store > Themes > Edit code > open header.liquid file find this code 

{% render 'icon-account' %} 

Below this line of code

{%- if shop.customer_accounts_enabled -%}

And then replace code above by this code 

          {% if customer %}
            Hi, {{ customer.first_name }}!
          {% else %}}
            {% render 'icon-account' %}
          {% endif %}

Code will look like this Screenshot 2023-03-09 at 16.49.33.png

 

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

This is an accepted solution.

Hi, it has 2 lines of this code in header.liquid 

 

 

{% render 'icon-account' %} 

 

 

Replace above code for both of them to apply code for mobile devices also

 

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 17 (17)

zaczee
Globetrotter
855 46 42

Hi @itshimanshu97 ,

 

Can you share your store url

 

itshimanshu97
Tourist
6 0 1

Hi zaczee, 

 

my store url is www.theelemstore.com

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

This is an accepted solution.

Go to your online store > Themes > Edit code > open header.liquid file find this code 

{% render 'icon-account' %} 

Below this line of code

{%- if shop.customer_accounts_enabled -%}

And then replace code above by this code 

          {% if customer %}
            Hi, {{ customer.first_name }}!
          {% else %}}
            {% render 'icon-account' %}
          {% endif %}

Code will look like this Screenshot 2023-03-09 at 16.49.33.png

 

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

itshimanshu97
Tourist
6 0 1

hi dan, 

 

thanks for the response but it didnt work!

 

I am attaching the screenshot of the code that i replaced according to your instructions but it still doesn't displays customer name

 

My store url is www.theelemstore.comScreenshot 2023-03-09 at 3.44.27 PM.png

 

With best Regards

Himanshu

Dan-From-Ryviu
Shopify Partner
8435 1660 1675
Did create account and login?--
Regards,

Dan

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

itshimanshu97
Tourist
6 0 1

yes i did

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

Hi @itshimanshu97,

It's working as you can see in this image Screenshot 2023-03-10 at 08.52.21.png

Also it has an mistake in the code, please remove one bracket at the en of this line of code Screenshot 2023-03-10 at 08.53.33.png

 

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

itshimanshu97
Tourist
6 0 1

Hi dan,

 

Thankyou very much for helping out and yes the code is working! But not on mobile devices... can you help me with this so that It works on mobile devices as well?

 

Best regards

himanshu

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

This is an accepted solution.

Hi, it has 2 lines of this code in header.liquid 

 

 

{% render 'icon-account' %} 

 

 

Replace above code for both of them to apply code for mobile devices also

 

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

itshimanshu97
Tourist
6 0 1

Thanks Dan!

 

I replaced the other code and it worked fine on mobile but i also had to add one more line of code to the code that you shared and i would like to mention it for others that might be looking for the same solution...

 

The other line of code should be replaced by code below for it to work perfectly fine on mobile devices as you might see "account" written next to your name if you dont add <span class = "visually hidden"> next to the code provided by dan

 

so the code would be:

 

{% if customer %}
Hi, {{ customer.first_name }}!
{% else %}
{% render 'icon-account' %}
{% endif %}
<span class="visually-hidden">

 

Best Regards

Himanshu

TaraWilken
Visitor
2 0 1

Thanks Himanshu and Dan. This solution did work.  Here are a couple of my comments to get it to work correctly.  The code that you can copy from for the solution is what has the extra "}" 

Remove that to start. 

This screen shot is the top part of the solution code.

Image 5-4-23 at 10.00 AM.jpg

I'm using the Dawn theme and don't have other customizations in this part of the code. So for me the mobile code that needs to be update was around line 233.  

The desktop code was around line 709. 

Dan and Himanshu are correct, you need to update both spots to get it to work correctly on desktop and mobile. Add the extra line of code that Himanshu added to remove the word "account" on the mobile version. 

 

BD-E
New Member
5 0 0

Hi,

 

could you let me know what was the code on mobile that you edited on dawn theme?

i was  able to get it working on desktop, but mobile does not have the same coding to update so i tried to improvise where the mobile code was to edit myself, but not getting it to work properly. 

 

thanks

TaraWilken
Visitor
2 0 1

I updated this several months ago, maybe the code you are looking for has dropped down a few more lines than what I mentioned.  I don't recall it being different code than what was mentioned in the main solution. 

Hamamao
Tourist
8 0 0

Hi Dan

 

Is this just for Shopify+ or also for the normal shopify?

Because I don't see the Edit code under Thems.

 

Regards,

Oren

Dan-From-Ryviu
Shopify Partner
8435 1660 1675

You can see edit code in Sale channels > Online store > Themes > click three dots button > Edit codeScreenshot 2023-04-13 at 10.01.54.png

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

MSNTAJ53
Visitor
1 0 0

Hi Mr. Dan, 

I applied the code and it works, but my problem is now the position of the text, how do I change that ?

Have attached a screenshot for referenceScreenshot 2023-12-22 at 14.40.57.jpg

Preet46
Visitor
1 0 0

After paste Code Name is showing Like this ,,  the theme is  Enterprise .

 

Screenshot_2.jpg