How can I edit the 'Log in' option on my checkout page?

Store Design
, , , , ,
1

Hi there,

I have a “Log in” option on my checkout page as below:

NickMercy_0-1710761197646.png
NickMercy_0-1710761197646.png905×157 5.13 KB

how do I edit this field to look something like this? or possible add it like log in/Register:

NickMercy_1-1710761255098.png
NickMercy_1-1710761255098.png880×165 8.22 KB

Thanks for the help.

Regards,

Nicholas

2
  1. Click on the 3 dots next to the theme. Then click on “Edit Default Theme Content”.
  2. In the search box search for “Login”.
  3. Then under Checkout & System, change the default placeholder text with the ones you need.
3

Hi Bhaskar,

Thank you. I did what you ask but how do you add the “Already have account” part without the link? and can we customize it so the register button takes you to register page and the log in takes you to log in one?

NickMercy_0-1710763756066.png

Thanks for help

4

Hi Nick,
Changing the default theme content will only change the text and not the functionality.
To change the functionality, you’ll need to edit the theme code.
But since checkout.liquid is only available for shopify plus merchants, the functionality can be added only if you’re in the shopify plus plan.
Hope that helps.

5

It helps clarify things thank you. I do have Shopify Plus though and access to that page but I cannot find the field to change it there?

thanks.

6

I won’t be able to provide any assistance without looking at the checkout.liquid file.
Could you please provide it here if possible.

However a workaround for this is to add these links by hardcoding it in the checkout.liquid file.
Register
Login
Add these links wherever you want to show it and add some styles to achieve the desired requirement.

7

Great thanks for help! Here is my code.

{{ page_title }}

{{ content_for_header }}

{{ checkout_stylesheets }}
{% comment %}.order-summary__section–discount .edit_checkout+.edit_checkout{display: none;}{% endcomment %}
{{ checkout_scripts }}
{% comment %}

{% endcomment %}

{{ skip_to_content_link }}
{{ content_for_logo }}

{{ order_summary_toggle }}

{{ content_for_logo }} {{ breadcrumb }} {{ alternative_payment_methods }} {{ content_for_layout }} {{ content_for_footer }}
{% comment %} {% if checkout.applied_gift_cards.size == 0 %} .order-summary__section--discount .edit_checkout+.edit_checkout{display: block;} {% else %} {% endif %} {% endcomment %}

{{ tracking_code }}

8

Hi Nick, I believe the contents of the checkout page are being loaded from a different file or template. ({{ content_for_layout }}). I couldn’t find anything related to the link either in the above code.

However, the previous solution I gave works in a similar manner. You can surely give it a try.