Password Page Customize ( Shopify Tinker Theme )

[dreamtechzone_5]

Hello Everyone!

I am using the Shopify Tinker theme. I want to put () text on the right side of Enter store password. Is it possible to put this? Please help me. Thanks in advance.

[devcoders]

Hi @dreamtechzone_5

Welcome to the Shopify Community! Please share your store URL and password (if it’s password-protected), so I can check and provide you with the exact solution.

Best regards,
Devcoder

[dreamtechzone_5]

VELVET GLOW

Password: Admin

[devcoders]

Hi @dreamtechzone_5

In your Shopify Admin go to online store > themes > actions > edit code
Find Asset > base.css and paste this at the bottow of the file:

.form-section .label-wrapper {
    justify-content: end;
}

Best regards,
Devcoder

[dreamtechzone_5]

Not like this. I would like to keep it similar to the image below.

[NKCreativeSoulutions]

Take the css labels from @devcoders and add ::after, then use the content property.

[dreamtechzone_5]

Give me the full update code. Thank you.

[NKCreativeSoulutions]

I have. You just need to put it all together yourself. A bit of research, if you need it, will make you a better programmer.

[websensepro]

Hi @dreamtechzone_5 ,

1. Go to Online Store → Theme → Edit code.
2. Open your theme.css / base.css file and paste the code in the bottom of the file.

.content--block .label-wrapper label[for="password"]::after {
  content: " : (Admin)";
  font-weight: normal;
  display: inline-block;
  margin-left: 2px;
}

Thanks!

[websensepro]

[dreamtechzone_5]

Not work.

[websensepro]

@websensepro

.content--block .label-wrapper label[for="password"]::after {
  content: " : (Admin)";
  font-weight: normal;
  display: inline-block;
  margin-left: 2px;
}

Please try using !important.

.content--block .label-wrapper label[for="password"]::after {
  content: " : (Admin)" !important;
  font-weight: normal !important;
  display: inline-block !important;
  margin-left: 2px !important;
}

Check it on Incongnito mode.

Hope it will work.

Thanks!

[dreamtechzone_5]

I added it. But not work

[tim_tairli]

This page is not a part of the theme, so theme stylesheet does not apply to it.

If you go to “edit theme” and select “password page” from the drop-down at the top it would look different:

Try searching in “Edit default theme content” – Checkout & system

[websensepro]

Let’s try this, Go to your main-password.liquid file and add code:

<style>
  .content--block .label-wrapper label[for="password"]::after {
    content: " : (Admin)" !important;
    font-weight: normal !important;
    display: inline-block !important;
    margin-left: 2px !important;
  }
</style>

Thanks!

[dreamtechzone_5]

Added code. but not work.

[Dan-From-Ryviu]

You can edit that text from your Shopify admin > Sales channels > Online store > click “…” in Tinker theme > Edit theme content, search for that text

---

Best regards, Dan from Ryviu Product Reviews & Loyalty

[dreamtechzone_5]

I want to keep this page like this too.

[NKCreativeSoulutions]

How are you going?

The theme you’re using is Tinker, right? Which has a different login/password screen as the horizon one (the screen shot you’ve posted).

As @Dan-From-Ryviu correctly said, the best way is to go into the password page:

Then choose the Edit default theme content, and look for this/these using the search word: password:

I’ve updated the text as you wished. You could also set the placeholder text, and it would look like this:

Another, maybe not so good option is to go into the password.liquid and change it like this:

[dreamtechzone_5]

You may not have understood what I meant. It is working fine in image number 1 but it is not working in image number 2. Basically I want to fix it in image number 2.

I want like that