Move "password" icon to bottom of password page

Store Design
1

Hello! I’m wondering if there’s a way to physically move the “Enter Using Password,” button from the top right of the page to a central, lower location. Specifically, I’d like to move it to underneath the newsletter sign-up form.

Debut Theme

https://www.infinityparkour.com (soon to change)

Thank you!

2

Hello InfinityParkour,

Add this css at the bottom of :

Online Store-> Themes → Edit code->Assets->theme.scss.liquid

.password-login {
text-align: center!important;
}
3 Likes
3

I went into themes → Edit Code → Assets

but I cannot find theme.scss.liquid

I only see styles.scss.liquid and theme.js.liquid

How do I fix this?

I really want to move my ‘enter using password’ icon.

Thank you!

1 Like
4

Hello ysmoonlight,
Please share your site url.
So that i can check and let you know the exact solution here.

1 Like
5

https://moonlightexclusive.com/

Thank you for your help!

1 Like
6

Hello @ysmoonlight

Your site is password protected please share password for you reference store url.

So that i can check and let you know the exact solution here.

Thanks…

7

Thanks @oscprofessional , i’ve managed to center the button but it still appears on top.

Could you help me to place it on the middle of the page or just under the newsletter sign-up button.

8

Hi @diego_campusco and @InfinityParkour

I was wondering if you ever figured out how to move the ENTER PASSWORD box to the bottom of the password page?

I managed to centre it based on the above code from @oscprofessional but that’s it.

Sadly for some reason my community page isn’t allowing me to create a new post. SO hopefully someone can help here!

Thanks in advance

2 Likes
9

Unfortunately, no :disappointed_face:
I called shopify and they suggested hiring a professional to design our
website.
I tried editing the code but that also didn’t work.

1 Like
10

Thanks for coming back to me. That’s a shame. I tried to have a play as well and couldn’t figure it out.

I did however, find a Youtube video on how to hide it. Not sure if it will help you but here it is:

https://www.youtube.com/watch?v=e_Wc4M9DNMk

Best of luck with your store!

2 Likes
11

Hi! I have been working on this all day and have a liquid theme. After combining a couple of codes I figured it out.

  1. Go to “Online Store>Edit Code>Assets>theme.scss.liquid”

  2. Scroll to the bottom of your code and instert>>

.password-login {
text-align: center!important;
position: fixed; /* or absolute */
top: 50%;
left: 45%;
}

You may have/want to edit the “top”, which is up and down, or “left”, which is left and right.

Keep in mind that if you want to move

“LEFT”-

Left-you will decrease the number

Right-increase the number

“TOP”

Up-decrease the number

Down-increase the number

I hope this helps all!