Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Sign-in Link on Mobile


Simon-JustGoodJuju

Question

Site URL: https://www.justgoodjuju.com

Thanks to Tuanphan's help, I have the Customer Sign-in link renamed on our site and it works great when viewed on desktop.  Can anyone give me guidance on how to make the same thing happen on Mobile?

Code:

/*  CUSTOMER ACCOUNT SIGN IN LINK  */
.Header-account span.unauth 
{
    visibility: hidden;
}
.Header-account span.unauth:after 
{
    visibility: visible;
    content: "VIP Customer";
}

Link to post
  • Answers 17
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Add to Code Injection Footer <script> $(document).ready(function() { $('.header-menu .customerAccountLoginMobile').appendTo('.header-display-mobile .header-actions.header-actions--right

Posted Images

17 answers to this question

Recommended Posts

  • 0
span.unauth {
    visibility: hidden;
}
span.unauth:after {
    visibility: visible;
    content: "VIP Customer";
}

remove code you used, and insert above code

Link to post
  • 0

mobile uses

.Mobile-bar.Mobile-bar--top span.unauth {
    visibility: hidden;
}
.Mobile-bar.Mobile-bar--top span.unauth:after {
    visibility: visible;
    content: "VIP Customer";
}

 

Link to post
  • 0
On 4/2/2020 at 9:18 PM, tuanphan said:

mobile uses


.Mobile-bar.Mobile-bar--top span.unauth {
    visibility: hidden;
}
.Mobile-bar.Mobile-bar--top span.unauth:after {
    visibility: visible;
    content: "VIP Customer";
}

 

I tried both codes, and they don't work 😞

Link to post
  • 0
17 hours ago, inunzi said:

Use this CSS

.header-menu-nav-item span.unauth {
    visibility: hidden;
}
.header-menu-nav-item span.unauth:before {
    visibility: visible;
    content: "VIP Customer";
}

 

Link to post
  • 0
12 hours ago, tuanphan said:

Use this CSS



.header-menu-nav-item span.unauth {
    visibility: hidden;
}
.header-menu-nav-item span.unauth:before {
    visibility: visible;
    content: "VIP Customer";
}

 

The code worked! But the only problem is that the text "VIP LOGIN" is still in my mobile menu 😞.

Edited by inunzi
Link to post
  • 0
40 minutes ago, inunzi said:

The code worked! But the only problem is that the text "VIP LOGIN" is still in my mobile menu 😞.

You want to hide or change text? If hide, just remove vip customer code

Link to post
  • 0
3 hours ago, tuanphan said:

You want to hide or change text? If hide, just remove vip customer code

I am trying to have the login link in my header on mobile as well as it is on desktop.

Link to post
  • 0
On 10/23/2020 at 10:02 PM, inunzi said:

Yes correct! @tuanphan (sorry for the tag)

Add to Code Injection Footer

<script>
  $(document).ready(function() { 
		$('.header-menu .customerAccountLoginMobile').appendTo('.header-display-mobile .header-actions.header-actions--right');
	});
</script>

 

Link to post
  • 0
1 hour ago, tuanphan said:

Add to Code Injection Footer



<script>
  $(document).ready(function() { 
		$('.header-menu .customerAccountLoginMobile').appendTo('.header-display-mobile .header-actions.header-actions--right');
	});
</script>

 

It works!!! Is there anyway to change the size of the svg icon with css? And also is there anyway to have the svg icon to the left of the bag icon? Because, I tried removing “right” and then adding “left” but it didn’t work 😕

D40CDB2D-9BD0-4D69-B237-C4C04D9A3F8D.png

Edited by inunzi
Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...